@import "https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700&display=swap";:root,[data-theme=forest]{color-scheme:dark;--bg-main:#101b16;--glass-bg:#1a2821;--glass-bg-soft:#14221b;--glass-bg-hover:#26382d;--glass-border:#35483b;--surface:#18251e;--primary:#b6d3ac;--secondary:#b8c7ac;--accent:#e4c99b;--green:#97c6a1;--danger:#f2a8a8;--text-primary:#eff3e9;--text-secondary:#becbbd;--text-muted:#9baa9c}[data-theme=midnight]{--bg-main:#121923;--glass-bg:#1c2735;--glass-bg-soft:#16202d;--glass-bg-hover:#29394d;--glass-border:#3a4c64;--surface:#1a2431;--primary:#b2c8ed;--secondary:#c4b9e0;--accent:#b2d9e1;--text-primary:#edf2fa;--text-secondary:#c0ccdc;--text-muted:#a0aec2}[data-theme=warm]{--bg-main:#241a16;--glass-bg:#30241e;--glass-bg-soft:#281d18;--glass-bg-hover:#443329;--glass-border:#5d493b;--surface:#2d211b;--primary:#e6c294;--secondary:#d9c9b5;--accent:#e9b5a4;--text-primary:#fcf0e5;--text-secondary:#dbc8b6;--text-muted:#baa591}[data-theme=aqua]{--bg-main:#102023;--glass-bg:#1b3033;--glass-bg-soft:#14282b;--glass-bg-hover:#294247;--glass-border:#3b565b;--surface:#192c30;--primary:#acd8d6;--secondary:#b4cddc;--accent:#d6cfac;--text-primary:#eaf5f4;--text-secondary:#bcd0d1;--text-muted:#9db6b8}[data-theme=amethyst]{--bg-main:#201927;--glass-bg:#2b2435;--glass-bg-soft:#241d2d;--glass-bg-hover:#3b3149;--glass-border:#51445e;--surface:#292131;--primary:#d2bde4;--secondary:#c2c8e5;--accent:#dfc2c8;--text-primary:#f5effa;--text-secondary:#d0c2da;--text-muted:#b3a2c0}:root{--bg-gradient:none;--glass-blur:none;--border-color:var(--glass-border);--border-width:1px;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-pill:999px;--shadow-solid:none;--shadow-solid-hover:none;--shadow-solid-active:none}*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100%}body{background:var(--bg-main);color:var(--text-primary);min-height:100vh;font-family:Instrument Sans,sans-serif;font-size:15px;line-height:1.5}button,input,textarea,select{font:inherit;min-width:0}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-underline-offset:4px}button:focus-visible,a:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--primary);outline-offset:4px}button:disabled{cursor:wait;opacity:.6}svg{flex-shrink:0}::selection{background:var(--primary);color:var(--bg-main)}.hidden{display:none!important}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-4{margin-top:24px}.mb-2{margin-bottom:16px}.mb-4{margin-bottom:24px}.p-0{padding:0!important}.text-center{text-align:center}.text-muted{color:var(--text-muted)}h1,h2,h3,h4,h5,h6{letter-spacing:-.035em;font-weight:600;line-height:1.15}label{color:var(--text-secondary);font-size:.9rem;display:block}.brand{letter-spacing:-.075em;align-items:baseline;font-size:2rem;font-weight:600;line-height:1;text-decoration:none;display:inline-flex}.brand-period{color:var(--primary)}.brutal-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);flex-direction:column;padding:18px;display:flex}input.brutal-input,input.input-field,select.brutal-input{background:var(--glass-bg-soft);border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--text-primary);outline:none;width:100%;padding:12px 14px;font-size:.88rem;transition:border-color .15s,box-shadow .15s}input::placeholder{color:var(--text-muted);opacity:1}input.brutal-input:focus,input.input-field:focus,select.brutal-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent)}.btn{border:1px solid var(--glass-border);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-primary);background:var(--glass-bg-soft);white-space:nowrap;justify-content:center;align-items:center;gap:8px;padding:10px 16px;font-size:.85rem;font-weight:600;transition:background .15s,border-color .15s;display:inline-flex}.btn:hover{background:var(--glass-bg-hover);border-color:var(--text-muted)}.btn-primary{background:var(--primary);color:var(--bg-main);border-color:var(--primary)}.btn-primary:hover{background:color-mix(in srgb, var(--primary) 90%, white);border-color:var(--primary)}.btn-secondary{background:0 0}.btn-danger{color:var(--danger);border-color:color-mix(in srgb, var(--danger) 35%, transparent);background:0 0}.btn-danger:hover{background:color-mix(in srgb, var(--danger) 10%, transparent);border-color:var(--danger)}.icon-btn{background:var(--glass-bg-soft);border:1px solid var(--glass-border);cursor:pointer;width:40px;height:40px;color:var(--text-primary);border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s;display:inline-flex}.icon-btn:hover{background:var(--glass-bg-hover)}.icon-btn:disabled{opacity:.4;cursor:not-allowed}.icon-btn.active{background:var(--primary);color:var(--bg-main);border-color:#0000}.panel-heading{letter-spacing:-.01em;font-size:.85rem;font-weight:600}.panel-description{color:var(--text-muted);font-size:.78rem;line-height:1.6}.profile-header{align-items:center;gap:12px;min-width:0;display:flex}.profile-card{padding:16px 12px}#my-presence-card{cursor:pointer}#my-presence-card:hover{border-color:var(--text-muted)}.avatar{background:var(--glass-bg-hover);border:1px solid var(--glass-border);width:40px;height:40px;color:var(--primary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;font-weight:500;display:inline-flex}.profile-info{min-width:0}.profile-info h3{letter-spacing:-.01em;overflow-wrap:anywhere;margin-bottom:5px;font-size:.86rem}.status-indicator{color:var(--text-secondary);align-items:center;gap:6px;font-size:.72rem;display:inline-flex}.dot{border-radius:50%;flex-shrink:0;width:6px;height:6px;display:inline-block}.dot.green{background:var(--green)}.dot.yellow{background:var(--accent)}.name-tag{z-index:20;color:#eff3e9;background:#101b16c9;border-radius:6px;height:fit-content;padding:4px 9px;font-size:.72rem;position:absolute;top:12px;left:12px}.dummy-placeholder{background:var(--bg-main);color:var(--text-primary);z-index:10;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}.dummy-placeholder .text{color:var(--text-muted);font-size:.75rem}.floating-reaction{pointer-events:none;z-index:30;font-size:2rem;animation:1.8s ease-out forwards reactionFloat;position:absolute;top:50%;left:50%}.hand-raised-badge{z-index:20;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:6px;place-items:center;width:30px;height:30px;display:grid;position:absolute;top:12px;right:12px}.reactions-menu{z-index:25;position:absolute;bottom:12px;left:12px}.reactions-menu summary{list-style:none}.reactions-menu summary::-webkit-details-marker{display:none}.reaction-bar{border:1px solid var(--glass-border);background:var(--surface);border-radius:10px;gap:4px;padding:6px;display:flex;position:absolute;bottom:48px;left:0}.input-row{gap:8px;min-width:0;display:flex}.pill-timer{border:0;border-bottom:1px solid var(--glass-border);background:0 0;border-radius:0;flex-direction:column;flex-shrink:0;gap:14px;padding:18px;display:flex}.timer-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.timer-heading h2{letter-spacing:-.01em;font-size:.85rem}.timer-heading-copy{flex-direction:column;gap:5px;display:flex}.timer-heading-copy>span{color:var(--text-muted);font-size:.73rem}.timer-utilities{gap:6px;display:flex}.timer-utilities .icon-btn{background:0 0;width:36px;height:36px}.timer-main{justify-content:space-between;align-items:center;gap:16px;display:flex}.pill-timer .time-display{letter-spacing:-.065em;font-variant-numeric:tabular-nums;color:var(--text-primary);font-size:3.6rem;font-weight:400;line-height:1}.timer-modes{background:var(--glass-bg-soft);border:1px solid var(--glass-border);border-radius:9px;gap:4px;padding:4px;display:flex}.mode-btn{color:var(--text-muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:5px;flex:1;padding:7px 10px;font-size:.78rem;font-weight:500}.mode-btn:hover{color:var(--text-primary)}.mode-btn.active{background:var(--glass-bg-hover);color:var(--text-primary)}.timer-controls{align-items:center;gap:8px;display:flex}#timer-toggle-btn{width:46px;height:46px}#timer-reset-btn{background:0 0}#timer-toggle-btn{background:var(--primary);color:var(--bg-main);border:0}.tabbed-container{background:0 0;border:0;border-radius:0;flex:1;min-height:0;overflow:hidden}.tabs-header{border-bottom:1px solid var(--glass-border);padding:0 16px;display:flex}.tab-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;flex:1;padding:16px 12px;font-size:.85rem;font-weight:500}.tab-btn.active{color:var(--text-primary);border-bottom-color:var(--primary)}.tab-content{flex-direction:column;flex:1;min-height:0;padding:18px;display:none;overflow:hidden}.tab-content.active{display:flex}.task-list{scrollbar-width:thin;scrollbar-color:var(--glass-border) transparent;flex-direction:column;flex:1;gap:8px;min-height:0;list-style:none;display:flex;overflow-y:auto}.task-item{border-bottom:1px solid var(--glass-border);flex-shrink:0;align-items:center;gap:8px;padding:12px 0;font-size:.82rem;display:flex}.task-content{overflow-wrap:anywhere;min-width:0}.task-item.completed .task-title{color:var(--text-muted);text-decoration:line-through}.task-checkbox{border:1px solid var(--text-muted);cursor:pointer;background:0 0;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;display:inline-flex}.task-item.completed .task-checkbox{background:var(--primary);border-color:var(--primary)}.task-checkbox svg{stroke:var(--bg-main)}.task-assignee-select{background:var(--glass-bg-soft);border:1px solid var(--glass-border);max-width:85px;color:var(--text-secondary);cursor:pointer;border-radius:6px;padding:5px 4px;font-size:.68rem}.progress-heading{color:var(--text-muted);justify-content:space-between;margin:24px 0 8px;font-size:.72rem;display:flex}.task-progress-bar{background:var(--glass-border);border-radius:4px;flex-shrink:0;height:3px;overflow:hidden}.task-progress-fill{background:var(--primary);height:100%;transition:width .3s}.task-empty-msg{text-align:center;color:var(--text-muted);padding:32px 12px;font-size:.8rem;line-height:1.7}.task-empty-msg strong{color:var(--text-secondary);margin-bottom:6px;font-weight:500;display:block}.modal-overlay{backdrop-filter:blur(6px);z-index:1200;background:#0009;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0;overflow-y:auto}.modal-overlay:has(#join-modal:not(.hidden)){background:var(--bg-main);backdrop-filter:none}.modal{background:var(--surface);border:1px solid var(--glass-border);border-radius:var(--radius-lg);width:min(460px,100%);max-height:calc(100dvh - 48px);color:var(--text-primary);padding:32px;overflow-y:auto}.lobby-brand{align-self:flex-start;margin-bottom:36px;font-size:2.3rem}#join-modal{grid-template-columns:1fr 1fr;width:min(960px,100%);padding:0;display:grid}.lobby-intro{color:#f5f7ef;background:linear-gradient(#0b181d70,#0b181de8),url(/thunderstorm_wp.png) 50%/cover;flex-direction:column;justify-content:space-between;padding:40px;display:flex}.lobby-intro .brand-period{color:#b6d3ac}#join-title{letter-spacing:-.055em;font-size:clamp(2.5rem,4vw,3.5rem);line-height:1.08}.lobby-intro h1+p{color:#d1ddd8;max-width:28ch;margin-top:24px;line-height:1.7}.lobby-intro-note{color:#b7c8c1;margin-top:48px;font-size:.78rem;line-height:1.8}.lobby-form{flex-direction:column;padding:48px 40px 32px;display:flex}.lobby-form h2{letter-spacing:-.035em;font-size:1.5rem}.lobby-description{color:var(--text-secondary);margin:14px 0 30px;font-size:.88rem}#join-modal label{margin-bottom:8px;font-size:.82rem}#join-modal input{margin-bottom:20px}.room-code-field{text-transform:uppercase;letter-spacing:.08em}.room-code-field::placeholder{text-transform:none;letter-spacing:normal}#join-modal .btn{min-height:46px}.lobby-divider{color:var(--text-muted);align-items:center;gap:12px;margin:22px 0;font-size:.75rem;display:flex}.lobby-divider:before,.lobby-divider:after{content:"";background:var(--glass-border);flex:1;height:1px}.lobby-note{text-align:center;color:var(--text-muted);margin-top:22px;font-size:.74rem;line-height:1.8}.logout-link{color:var(--text-muted);align-self:center;margin-top:24px;font-size:.78rem}.toast{z-index:2000;border:1px solid var(--primary);background:var(--surface);width:max-content;max-width:min(520px,100vw - 32px);color:var(--text-primary);overflow-wrap:anywhere;border-radius:12px;padding:14px 20px;font-size:.85rem;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0004}.toast[data-kind=error]{border-color:var(--danger)}.inline-error{border-left:2px solid var(--danger);color:var(--danger);background:color-mix(in srgb, var(--danger) 5%, transparent);margin-bottom:20px;padding:12px;font-size:.82rem}.network-banner{border:1px solid var(--accent);background:var(--surface);color:var(--accent);border-radius:10px;flex-shrink:0;padding:12px 16px;font-size:.82rem}.stage-status:before{content:"";background:var(--accent);border-radius:50%;width:6px;height:6px}.stage-status[data-state=connected]:before{background:var(--green)}.stage-status[data-state=offline]:before{background:var(--danger)}.dialog-description{color:var(--text-secondary);margin:20px 0 28px;font-size:.9rem;line-height:1.7}.dialog-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}.task-item.saving{opacity:.65}.chat-message{border:0;border-bottom:1px solid var(--glass-border);overflow-wrap:anywhere;white-space:pre-wrap;background:0 0;border-radius:0;flex-shrink:0;align-self:stretch;max-width:100%;padding:14px 0;font-size:.88rem;line-height:1.65}.ai-message{border-left:2px solid var(--primary);padding-left:12px}.message-sender{color:var(--text-muted);margin-bottom:6px;font-size:.72rem}#chat-messages:empty:before{content:"Start the conversation. Messages are shared with everyone in this room.";color:var(--text-muted);text-align:center;margin:auto 12px;font-size:.8rem;line-height:1.7}#ai-pending{margin-bottom:12px}#chat-messages{scrollbar-width:thin;scrollbar-color:var(--glass-border) transparent;scrollbar-gutter:stable;flex-direction:column;flex:1;gap:8px;min-height:0;margin-bottom:16px;padding-right:6px;display:flex;overflow-y:auto}.chat-compose{border:1px solid var(--glass-border);background:var(--glass-bg-soft);border-radius:12px;flex-shrink:0;padding:12px}.chat-compose:focus-within{border-color:var(--primary);box-shadow:0 0 0 2px color-mix(in srgb, var(--primary) 12%, transparent)}#chat-input{resize:vertical;width:100%;min-height:52px;max-height:120px;color:var(--text-primary);background:0 0;border:0;outline:0;padding:0;font-size:.9rem;line-height:1.5;display:block}#chat-input::placeholder{color:var(--text-muted)}.chat-compose-actions{justify-content:space-between;align-items:center;gap:12px;margin-top:10px;display:flex}#chat-compose-help{color:var(--text-muted);font-size:.72rem}#chat-compose-help kbd{font:inherit;color:var(--text-secondary);margin-right:5px}.chat-compose-actions .btn{padding:8px 16px}.focus-active .right-sidebar{z-index:1000;width:max-content;max-width:calc(100vw - 32px);height:auto;min-height:0;position:fixed;bottom:20px;left:50%;overflow:visible;transform:translate(-50%)}.focus-active .tabbed-container,.focus-active .timer-heading-copy{display:none}.focus-active .pill-timer{border:0;flex-direction:row;align-items:center;gap:16px;padding:12px}.focus-active .timer-heading{display:contents}.focus-active .timer-main{order:0;gap:10px}.focus-active .timer-modes{flex:none;order:1;width:max-content;min-width:max-content}.focus-active .mode-btn{flex:none}.focus-active .timer-utilities{order:2}.focus-active .pill-timer .time-display{font-size:2rem}.focus-active #timer-toggle-btn{width:40px;height:40px}.focus-active #timer-reset-btn{width:36px;height:36px}.room-guidance{border-top:1px solid var(--glass-border);color:var(--text-muted);justify-content:space-between;align-items:center;gap:16px;margin:0 24px;padding:16px 0;font-size:.78rem;display:flex}.room-guidance .btn{padding:8px 12px;font-size:.75rem}.profile-open-hint{border-top:1px solid var(--glass-border);color:var(--text-muted);justify-content:space-between;align-items:center;gap:8px;margin-top:16px;padding-top:12px;font-size:.7rem;display:flex}.profile-open-hint>span{font-size:1rem}.profile-identity{align-items:center;gap:14px;margin:12px 0 28px;font-size:.85rem;display:flex}.profile-identity .avatar{width:48px;height:48px;font-size:1.2rem}.profile-identity p span{color:var(--text-muted);font-size:.75rem}.profile-name-form>label{color:var(--text-secondary);margin-bottom:8px;font-size:.8rem;display:block}.profile-name-form .input-row input{min-width:0}.focus-summary{border-top:1px solid var(--glass-border);flex-direction:column;gap:4px;margin-top:28px;padding:24px 0;display:flex}.focus-summary>span{color:var(--text-secondary);font-size:.8rem}.focus-summary strong{letter-spacing:-.06em;font-variant-numeric:tabular-nums;font-size:3rem;font-weight:500;line-height:1.2}.focus-summary p{color:var(--text-muted);font-size:.75rem}.profile-stat-list{border-block:1px solid var(--glass-border)}.profile-stat-list>div{justify-content:space-between;align-items:center;gap:16px;padding:12px 0;font-size:.82rem;display:flex}.profile-stat-list>div+div{border-top:1px solid color-mix(in srgb, var(--glass-border) 50%, transparent)}.profile-stat-list dt{color:var(--text-secondary)}.profile-stat-list dd{font-variant-numeric:tabular-nums;font-weight:500}.profile-footnote{color:var(--text-muted);margin-top:20px;font-size:.72rem;line-height:1.7}.audio-providers{background:var(--glass-bg-soft);border-radius:8px;gap:4px;padding:3px;display:flex}.provider-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:5px;flex:1;padding:7px 4px;font-size:.72rem}.provider-btn[aria-pressed=true]{color:var(--text-primary);background:var(--glass-bg-hover)}.audio-empty{border:1px dashed var(--glass-border);border-radius:8px;flex-direction:column;justify-content:center;min-height:152px;padding:18px;display:flex}.audio-empty>span{font-size:.82rem;font-weight:500}.audio-empty p{color:var(--text-muted);margin-top:8px;font-size:.74rem}.audio-note{color:var(--text-muted);font-size:.68rem;line-height:1.6}.dummy-placeholder{background:linear-gradient(#0b181d91,#0b181de8),url(/thunderstorm_wp.png) 50%/cover}.dummy-placeholder .avatar{color:#d8e7d1;background:#15251ce0;border-color:#ffffff26;width:64px;height:64px;font-size:1.5rem}.dummy-placeholder .text{color:#d1ddd8}@media (width>=761px) and (width<=1050px){.ambience-panel{grid-template-columns:minmax(0,1fr) 180px}.ambience-panel>:first-child,.ambience-panel .audio-providers,.ambience-panel .audio-note{grid-column:1}.ambience-panel iframe,.ambience-panel .audio-empty{grid-area:1/2/5;height:152px}}@media (width<=700px){#join-modal{grid-template-columns:1fr;padding:0}.lobby-intro{padding:28px}.lobby-brand{margin-bottom:28px}#join-title{font-size:2.3rem}.lobby-intro h1+p{max-width:40ch;margin-top:16px;font-size:.85rem}.lobby-intro-note{display:none}.lobby-form{padding:28px}.lobby-form h2{font-size:1.25rem}}@media (width<=760px){.focus-active .timer-modes{display:none}}@media (width<=480px){.modal-overlay{padding:16px}.modal{max-height:calc(100dvh - 32px);padding:24px}#join-modal{padding:0}}@media (width>=1051px) and (height<=700px){body:not(.focus-active) .right-sidebar .pill-timer{gap:10px;padding:14px}body:not(.focus-active) .right-sidebar .time-display{font-size:3rem}body:not(.focus-active) .right-sidebar .timer-utilities .icon-btn{width:32px;height:32px}.right-sidebar .mode-btn{padding-block:5px}.right-sidebar .tab-content{padding:14px}.right-sidebar .chat-compose{padding:10px}.right-sidebar .chat-compose-actions{margin-top:8px}.right-sidebar #chat-input{height:44px;min-height:44px}.right-sidebar #chat-messages{margin-bottom:12px}}@media (width>=1051px) and (height<=560px){body:not(.focus-active) .right-sidebar .pill-timer{grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:12px;display:grid}body:not(.focus-active) .right-sidebar .timer-heading,body:not(.focus-active) .right-sidebar .timer-main{display:contents}body:not(.focus-active) .right-sidebar .timer-heading-copy{display:none}body:not(.focus-active) .right-sidebar .time-display{grid-area:1/1;font-size:2.5rem}body:not(.focus-active) .right-sidebar .timer-controls{grid-area:1/2;gap:4px}body:not(.focus-active) .right-sidebar .timer-utilities{grid-area:1/3;gap:4px}body:not(.focus-active) .right-sidebar .timer-modes{grid-column:1/-1}body:not(.focus-active) .right-sidebar .timer-controls .icon-btn{width:32px;height:32px}body:not(.focus-active) .right-sidebar .timer-utilities .icon-btn{width:28px;height:28px}}
