Login Flow

Login Screen *
	submit -> Dashboard
	forgot password -> Password Reset
Dashboard
	Sidebar
		expanded *
			collapse -> collapsed
		collapsed
			expand -> expanded
	logout -> Login Screen
Password Reset
	submit -> Login Screen
	cancel -> Login Screen

[Login Screen]
  div.login style="max-width: 300px; padding: 24px;":
    h2 style="margin-bottom: 16px;": "Sign In"
    input placeholder="Email" style="width: 100%; padding: 8px; margin-bottom: 8px; border: 1px solid #ccc;":
    input type="password" placeholder="Password" style="width: 100%; padding: 8px; margin-bottom: 16px; border: 1px solid #ccc;":
    button @click=submit style="width: 100%; padding: 10px; background: #000; color: #fff;": "Sign In"
    a @click=forgot_password style="display: block; text-align: center; margin-top: 12px; color: #666; font-size: 12px;": "Forgot password?"

[expanded]
  div.sidebar style="width: 200px; background: #f5f5f5; padding: 16px;":
    button @click=collapse style="margin-bottom: 16px;": "<<"
    nav:
      a style="display: block; padding: 8px;": "Home"
      a style="display: block; padding: 8px;": "Settings"
      a style="display: block; padding: 8px;": "Profile"

[collapsed]
  div.sidebar style="width: 60px; background: #f5f5f5; padding: 16px;":
    button @click=expand: ">>"

[Password Reset]
  div.reset style="max-width: 300px; padding: 24px;":
    h2 style="margin-bottom: 16px;": "Reset Password"
    p style="color: #666; margin-bottom: 16px; font-size: 14px;": "Enter your email to receive reset instructions."
    input placeholder="Email" style="width: 100%; padding: 8px; margin-bottom: 16px; border: 1px solid #ccc;":
    button @click=submit style="width: 100%; padding: 10px; background: #000; color: #fff; margin-bottom: 8px;": "Send Reset Link"
    button @click=cancel style="width: 100%; padding: 10px; background: #fff; border: 1px solid #ccc;": "Cancel"