.navbar{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:center;height:var(--nav-height);background:var(--color-bg-secondary);border-top:1px solid var(--color-border);z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;flex:1;height:100%;color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;transition:color .2s,background .2s}.nav-item.active{color:var(--color-primary);background:#e945601a}.layout{min-height:100dvh;display:flex;flex-direction:column}.layout-content{flex:1;max-width:var(--max-width);width:100%;margin:0 auto;padding:var(--space-lg);padding-bottom:calc(var(--nav-height) + var(--space-lg))}.slider-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);width:100%}.slider{-webkit-appearance:none;width:100%;height:8px;border-radius:var(--radius-full);background:var(--color-bg-input);outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:var(--color-primary);cursor:pointer;box-shadow:var(--shadow-md);transition:transform .15s}.slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.slider::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:var(--color-primary);cursor:pointer;border:none}.slider-value{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-primary)}.slider-labels{display:flex;justify-content:space-between;width:100%;color:var(--color-text-muted);font-size:var(--font-size-xs)}.link-preview{display:flex;align-items:center;gap:var(--space-sm);background:var(--color-bg-secondary);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);text-decoration:none;transition:background .2s}.link-preview:hover{background:var(--color-bg-input)}.link-icon{width:24px;height:24px;border-radius:var(--radius-sm);flex-shrink:0}.link-info{display:flex;flex-direction:column;min-width:0}.link-title{color:var(--color-text);font-size:var(--font-size-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.link-domain{color:var(--color-text-muted);font-size:var(--font-size-xs)}.emoji-modal-backdrop{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100}.emoji-modal{background:var(--color-bg-card);border-radius:var(--radius-md);padding:var(--space-md);box-shadow:var(--shadow-lg, 0 4px 24px rgba(0, 0, 0, .3));max-width:280px;width:90%}.emoji-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-sm)}.emoji-grid-btn{font-size:1.5rem;background:none;border:2px solid transparent;border-radius:var(--radius-sm);padding:var(--space-xs);cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;aspect-ratio:1}.emoji-grid-btn:hover{background:var(--color-bg-input)}.emoji-grid-btn.emoji-active{border-color:var(--color-primary);background:#e9456026}.event-card{background:var(--color-bg-card);border-radius:var(--radius-md);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-sm);box-shadow:var(--shadow-sm)}.event-card-latest{border-left:3px solid var(--color-primary);background:#e945600d}.event-header{display:flex;justify-content:space-between;align-items:center}.event-score{font-size:var(--font-size-xl);font-weight:700;color:var(--color-primary);background:#e9456026;width:44px;height:44px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center}.event-header-right{display:flex;align-items:center;gap:var(--space-sm)}.event-time{color:var(--color-text-muted);font-size:var(--font-size-sm)}.event-share-btn{background:transparent;color:var(--color-text-muted);border:none;padding:var(--space-xs);cursor:pointer;transition:color .15s;display:flex;align-items:center}.event-share-btn:hover{color:var(--color-primary)}.event-rooms{display:flex;gap:var(--space-xs);flex-wrap:wrap}.event-room-tag{display:inline-block;font-size:var(--font-size-xs, .7rem);color:var(--color-text-muted);background:var(--color-bg-input);padding:2px var(--space-xs);border-radius:var(--radius-sm);max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}.event-challenge{color:var(--color-warning);font-size:var(--font-size-sm);font-weight:600}.event-note{color:var(--color-text);font-size:var(--font-size-md);line-height:1.4;white-space:pre-wrap}.reactions-row{display:flex;gap:var(--space-xs);flex-wrap:wrap;align-items:center}.reaction-chip{background:var(--color-bg-input);color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-sm);cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:4px}.reaction-chip:hover{border-color:var(--color-primary)}.reaction-chip.reaction-mine{background:#e9456026;color:var(--color-primary);border-color:var(--color-primary)}.reaction-add-btn{background:var(--color-bg-input);color:var(--color-text-muted);border:1px dashed var(--color-border);border-radius:var(--radius-full);width:32px;height:32px;font-size:var(--font-size-md);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.reaction-add-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.beuk-page{display:flex;flex-direction:column;gap:var(--space-xl)}.beuk-form{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-xl)}.beuk-banner{width:100%;max-width:360px;height:auto;border-radius:var(--radius-md)}.beuk-challenges-list{width:100%;display:flex;flex-direction:column;gap:var(--space-xs)}.beuk-challenge-banner{width:100%;background:#ffc10726;color:var(--color-warning);border:1px solid var(--color-warning);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);font-weight:600;display:flex;align-items:center;justify-content:space-between}.beuk-challenge-clear{background:transparent;border:none;color:var(--color-warning);font-size:var(--font-size-lg);cursor:pointer;padding:0 var(--space-xs);line-height:1}.beuk-challenge-warning{width:100%;background:#ff525226;color:var(--color-error);border:1px solid var(--color-error);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm)}.beuk-note{width:100%;resize:none}.beuk-url,.beuk-rooms{width:100%}.beuk-rooms-label{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-xs);display:block}.beuk-room-chips{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.room-chip{background:var(--color-bg-input);color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:var(--space-xs) var(--space-md);font-size:var(--font-size-sm);transition:all .2s}.room-chip.selected{background:#e9456033;color:var(--color-primary);border-color:var(--color-primary)}.beuk-button{width:100%;padding:var(--space-md) var(--space-xl);background:var(--color-primary);color:#fff;font-size:var(--font-size-lg);font-weight:700;border-radius:var(--radius-md);transition:all .2s}.beuk-button:hover:not(:disabled){background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.beuk-button:disabled{opacity:.7}.beuk-button.success{background:var(--color-success)}.events-list{display:flex;flex-direction:column;gap:var(--space-md)}.events-list h2{font-size:var(--font-size-lg);font-weight:600}.heatmap-wrap{display:flex;flex-direction:column;gap:var(--space-xs);overflow-x:auto}.hm-cell{aspect-ratio:1;border-radius:2px;min-width:0}.hm-cell-0{background:var(--color-bg-input)}.hm-cell-1{background:#e9456026}.hm-cell-2{background:#e9456066}.hm-cell-3{background:var(--color-primary)}.hm-cell-future{background:transparent}.hm-day-label{font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:1;display:flex;align-items:center;white-space:nowrap}.hm-month-row{display:grid;gap:2px}.hm-month-label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:capitalize}.hm-grid{display:grid;gap:2px}.hm-legend{display:flex;align-items:center;gap:3px;justify-content:flex-end}.hm-legend .hm-cell{width:10px;height:10px}.hm-legend-label{font-size:var(--font-size-xs);color:var(--color-text-muted);margin:0 2px}.hm-hour-row{display:grid;grid-template-columns:24px repeat(24,1fr);gap:2px}.hm-hour-label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-align:center}.hm-hour-grid{display:flex;flex-direction:column;gap:2px}.hm-hour-row-data{display:grid;grid-template-columns:24px repeat(24,1fr);gap:2px}.stats-page{display:flex;flex-direction:column;gap:var(--space-lg)}.stats-page h1{font-size:var(--font-size-2xl);font-weight:700}.stats-filter{display:flex;gap:var(--space-sm);align-items:center}.stats-filter-btn{background:var(--color-bg-input);color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);cursor:pointer;white-space:nowrap;transition:all .15s}.stats-filter-btn.active{background:#e9456026;color:var(--color-primary);border-color:var(--color-primary)}.stats-filter select{flex:1;background:var(--color-bg-input);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-md);width:100%}.stats-summary{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md)}.stat-card{background:var(--color-bg-card);border-radius:var(--radius-md);padding:var(--space-lg);display:flex;flex-direction:column;align-items:center;gap:var(--space-xs)}.stat-value{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-primary)}.stat-label{font-size:var(--font-size-sm);color:var(--color-text-muted)}.stats-section{background:var(--color-bg-secondary);border-radius:var(--radius-md);padding:var(--space-md)}.stats-section h2{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--space-md)}.leaderboard{display:flex;flex-direction:column;gap:var(--space-xs)}.leaderboard-row{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm);background:var(--color-bg-card);border-radius:var(--radius-sm);overflow:hidden}.lb-rank{font-weight:700;color:var(--color-text-muted);min-width:24px;text-align:center}.lb-name{display:block;font-size:var(--font-size-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lb-count{font-weight:600;color:var(--color-primary);font-size:var(--font-size-sm);flex-shrink:0}.lb-url-info{display:flex;align-items:center;gap:var(--space-sm);flex:1;min-width:0}.lb-url-info>div{min-width:0;flex:1}.lb-icon{width:20px;height:20px;border-radius:var(--radius-sm);flex-shrink:0}.lb-domain{color:var(--color-text-muted);font-size:var(--font-size-xs);display:block}.challenges-page{display:flex;flex-direction:column;gap:var(--space-lg)}.challenges-header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-md)}.challenges-page h1{font-size:var(--font-size-2xl);font-weight:700}.challenges-streak{font-size:var(--font-size-sm);font-weight:600;color:var(--color-primary);white-space:nowrap}.challenges-progress{display:flex;align-items:center;gap:var(--space-sm)}.challenges-progress-bar{flex:1;height:6px;background:var(--color-bg-input);border-radius:3px;overflow:hidden}.challenges-progress-fill{height:100%;background:var(--color-primary);border-radius:3px;transition:width .3s ease}.challenges-progress-text{font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:nowrap}.challenges-days-left{font-size:var(--font-size-sm);font-weight:400;color:var(--color-text-muted)}.challenges-empty{color:var(--color-text-muted)}.challenges-room-select{background:var(--color-bg-input);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-md);width:100%}.challenges-list{display:flex;flex-direction:column;gap:var(--space-md)}.challenge-card{background:var(--color-bg-card);border-radius:var(--radius-md);padding:var(--space-md);display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.challenge-completed{background:color-mix(in srgb,var(--color-primary) 8%,var(--color-bg-card))}.challenge-locked{opacity:.5}.challenge-info{display:flex;align-items:flex-start;gap:var(--space-sm);flex:1;min-width:0}.challenge-type-icon{font-size:var(--font-size-lg);flex-shrink:0}.challenge-text{display:flex;flex-direction:column;gap:2px;min-width:0}.challenge-title{font-size:var(--font-size-sm);font-weight:600}.challenge-desc{font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.challenge-completion-count{font-size:var(--font-size-xs);color:var(--color-primary)}.challenge-locked-label{font-size:var(--font-size-xs);color:var(--color-warning)}.challenge-actions{display:flex;align-items:center;gap:var(--space-xs);flex-shrink:0}.challenge-share-btn{background:transparent;color:var(--color-text-muted);border:none;padding:var(--space-xs);cursor:pointer;transition:color .15s;display:flex;align-items:center}.challenge-share-btn:hover{color:var(--color-primary)}.challenge-done-btn{background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-sm);padding:var(--space-xs) var(--space-md);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:background .15s;white-space:nowrap}.challenge-done-btn:hover:not(:disabled){background:var(--color-primary-hover)}.challenge-done-btn-selected{background:var(--color-success, #4caf50)}.challenge-done-btn-selected:hover:not(:disabled){background:var(--color-success, #4caf50);opacity:.85}.challenge-done-btn:disabled{cursor:not-allowed;opacity:.5}.challenge-selected{outline:2px solid var(--color-primary);outline-offset:-2px}.challenges-go-btn{position:sticky;bottom:calc(var(--space-lg) + 60px);width:100%;padding:var(--space-md) var(--space-xl);background:var(--color-primary);color:#fff;font-size:var(--font-size-lg);font-weight:700;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all .2s;box-shadow:var(--shadow-lg);z-index:10}.challenges-go-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.challenge-sfw-blur{filter:blur(6px);-webkit-user-select:none;user-select:none;pointer-events:none}.special-challenge-section{margin-top:var(--space-md)}.special-challenge-heading{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-muted);margin-bottom:var(--space-sm)}.challenge-special{border:1.5px dashed var(--color-border)}.special-challenge-label{font-size:var(--font-size-xs);font-style:italic;color:var(--color-text-muted)}.room-card{background:var(--color-bg-card);border-radius:var(--radius-md);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-md)}.room-header{display:flex;justify-content:space-between;align-items:flex-start}.room-name{font-size:var(--font-size-lg);font-weight:600;cursor:pointer}.room-name:hover{color:var(--color-primary)}.room-name-unnamed{font-style:italic;color:var(--color-text-muted)}.room-rename-hint{font-size:var(--font-size-xs, .7rem);font-weight:400;font-style:normal;color:var(--color-primary);margin-left:var(--space-xs);opacity:.7}.room-key{display:inline-block;color:var(--color-text-muted);font-size:var(--font-size-xs);font-family:monospace;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}.room-members{color:var(--color-text-muted);font-size:var(--font-size-xs);margin-left:var(--space-sm)}.room-edit-name{display:flex;gap:var(--space-sm)}.room-edit-name input{padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-sm);width:150px}.btn-sm{background:var(--color-primary);color:#fff;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:var(--font-size-sm)}.room-header-actions{display:flex;gap:var(--space-xs);flex-shrink:0}.btn-ping{background:transparent;color:var(--color-text-muted);border:none;padding:var(--space-xs);cursor:pointer;transition:color .15s;display:flex;align-items:center;gap:4px}.btn-ping:hover:not(:disabled){color:var(--color-warning)}.btn-ping-disabled{opacity:.5;cursor:not-allowed}.ping-cooldown-label{font-size:var(--font-size-xs);color:var(--color-text-muted)}.btn-share{background:transparent;color:var(--color-text-muted);border:none;padding:var(--space-xs);cursor:pointer;transition:color .15s;display:flex;align-items:center}.btn-share:hover{color:var(--color-primary)}.btn-leave{background:transparent;color:var(--color-error);border:1px solid var(--color-error);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:var(--font-size-sm);transition:background .2s}.btn-leave:hover{background:#ff525226}.room-notify{display:flex;align-items:center;justify-content:space-between}.room-notify-label{color:var(--color-text-muted);font-size:var(--font-size-sm)}.toggle-switch{position:relative;width:44px;height:24px;background:var(--color-bg-input);border:1px solid var(--color-border);border-radius:12px;cursor:pointer;transition:all .2s;padding:0}.toggle-switch.toggle-on{background:var(--color-primary);border-color:var(--color-primary)}.toggle-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;background:#fff;border-radius:50%;transition:transform .2s}.toggle-switch.toggle-on .toggle-knob{transform:translate(20px)}.room-settings{display:flex;gap:var(--space-md);flex-wrap:wrap}.room-settings label{display:flex;align-items:center;gap:var(--space-xs);color:var(--color-text-muted);font-size:var(--font-size-sm);cursor:pointer}.rooms-page{display:flex;flex-direction:column;gap:var(--space-lg)}.rooms-page h1{font-size:var(--font-size-2xl);font-weight:700}.join-form{display:flex;gap:var(--space-sm)}.join-form input{flex:1}.btn-join{background:var(--color-primary);color:#fff;padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-sm);font-weight:600;transition:background .2s}.btn-join:hover{background:var(--color-primary-hover)}.error-msg{color:var(--color-error);font-size:var(--font-size-sm)}.empty-msg{color:var(--color-text-muted);text-align:center;padding:var(--space-xl)}.rooms-list{display:flex;flex-direction:column;gap:var(--space-md)}:root{--color-bg: #1a1a2e;--color-bg-secondary: #16213e;--color-bg-card: #0f3460;--color-bg-input: #1a1a3e;--color-primary: #e94560;--color-primary-hover: #ff6b81;--color-secondary: #533483;--color-accent: #00d2ff;--color-text: #eee;--color-text-muted: #8892b0;--color-text-inverse: #1a1a2e;--color-success: #00c853;--color-warning: #ffc107;--color-error: #ff5252;--color-border: #2a2a4a;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-2xl: 2rem;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--radius-sm: .375rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 25px rgba(0, 0, 0, .4);--max-width: 600px;--nav-height: 60px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family);background-color:var(--color-bg);color:var(--color-text);min-height:100dvh;-webkit-font-smoothing:antialiased}#root{min-height:100dvh;display:flex;flex-direction:column}a{color:var(--color-accent);text-decoration:none}button{cursor:pointer;font-family:var(--font-family);border:none;outline:none}input,textarea{font-family:var(--font-family);background:var(--color-bg-input);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-md)}input:focus,textarea:focus{outline:none;border-color:var(--color-primary)}