:root{--bg-primary: #1a1a1f;--bg-secondary: #252529;--bg-tertiary: #2d2d33;--text-primary: #e8e8ec;--text-secondary: #a0a0a8;--text-muted: #6a6a72;--accent: #E97A93;--accent-hover: #f08da3;--warning: #f5a623;--success: #4cd964;--error: #ff6b6b;--border: #3a3a42;--border-light: #4a4a52}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased}#root{min-height:100%;display:flex;flex-direction:column}.screen{flex:1;display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}.content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;text-align:center}.header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border)}.header-left{display:flex;align-items:center;gap:1rem}.logo{font-size:1.5rem;font-weight:700;color:var(--accent);line-height:1;cursor:pointer}.logo:hover{opacity:.8}.game-code{font-size:.875rem;color:var(--text-secondary);font-family:monospace;line-height:1.5rem;display:flex;align-items:center}.header-menu{position:relative}.menu-btn{background:transparent;border:1px solid var(--border);color:var(--text-secondary);width:2.5rem;height:2.5rem;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center}.menu-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:199}.menu-dropdown{position:absolute;top:100%;right:0;margin-top:.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;min-width:160px;z-index:200;overflow:hidden}.menu-dropdown button,.menu-dropdown a{display:block;width:100%;padding:.75rem 1rem;background:transparent;border:none;color:var(--text-primary);text-align:left;font-size:.9rem;cursor:pointer;text-decoration:none}.menu-dropdown button:hover,.menu-dropdown a:hover{background:var(--bg-tertiary)}.menu-dropdown a{color:var(--text-secondary)}.menu-divider{height:1px;background:var(--border);margin:.25rem 0}.menu-info{padding:.5rem 1rem;color:var(--text-muted);font-size:.8rem}h2{font-size:1.75rem;margin-bottom:.5rem;color:var(--text-primary)}.subtitle{color:var(--text-secondary);margin-bottom:2rem}.hint{color:var(--text-muted);font-size:.875rem;margin-top:1.5rem}.hint a{color:var(--accent);text-decoration:none}.primary-btn{background:var(--accent);color:#fff;border:none;padding:.875rem 2rem;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:background .2s;min-width:200px}.primary-btn:hover:not(:disabled){background:var(--accent-hover)}.primary-btn:disabled{opacity:.5;cursor:not-allowed}.back-link{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;margin-top:1.5rem;font-size:.875rem}.back-link:hover{color:var(--text-primary)}.join-form{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:280px;margin-top:1.5rem}input[type=text],input[type=email]{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);padding:.875rem 1rem;font-size:1rem;border-radius:8px;outline:none;transition:border-color .2s}input[type=text]:focus,input[type=email]:focus{border-color:var(--accent)}input[type=text]::placeholder,input[type=email]::placeholder{color:var(--text-muted)}input:disabled{opacity:.5}.code-input-wrapper{position:relative}.code-input{text-align:center;font-size:1.5rem;font-family:monospace;letter-spacing:.25em;text-transform:uppercase}.code-input.valid{border-color:var(--success)}.code-input.invalid{border-color:var(--error)}.validation-icon{position:absolute;right:1rem;top:50%;transform:translateY(-50%);font-size:.875rem}.valid-icon{color:var(--success)}.invalid-icon{color:var(--error)}.code-field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}.code-error-banner{display:flex;align-items:center;gap:.5rem;background:#ff6b6b1a;border:1px solid var(--error);border-radius:8px;padding:.625rem .875rem;color:var(--error);font-size:.875rem}.error-icon{display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;background:var(--error);color:#fff;border-radius:50%;font-weight:700;font-size:.75rem;flex-shrink:0}.qr-share{display:flex;flex-direction:column;align-items:center;gap:1rem;margin-bottom:1.5rem}.qr-code{padding:1rem;background:var(--bg-secondary);border-radius:12px}.game-code-display{font-size:1.125rem;color:var(--text-secondary)}.game-code-display strong{color:var(--text-primary);font-family:monospace;font-size:1.25rem}.copy-btn{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.875rem}.copy-btn:hover{background:var(--bg-tertiary)}.error{color:var(--error);margin-top:1rem;font-size:.875rem}.lobby-screen{display:flex;flex-direction:column}.lobby-content{flex:1;display:flex;flex-direction:column;padding:1rem;overflow-y:auto}.current-question{background:linear-gradient(135deg,#e97a9326,#e97a930d);border:1px solid var(--accent);border-radius:12px;padding:1rem;margin-bottom:1rem}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.asker{font-size:.875rem;color:var(--accent);font-weight:500}.clear-question-btn{background:transparent;border:1px solid var(--border);color:var(--text-muted);width:1.5rem;height:1.5rem;border-radius:4px;cursor:pointer;font-size:.75rem}.question-text{font-size:1.25rem;font-weight:500;line-height:1.4;word-break:break-word}.turn-indicator{text-align:center;padding:1.5rem 1rem;margin-bottom:1rem}.your-turn{font-size:1.5rem;font-weight:600;color:var(--accent);margin-bottom:.25rem}.turn-hint{font-size:.875rem;color:var(--text-secondary)}.waiting-for{font-size:1rem;color:var(--text-secondary)}.waiting-message{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;color:var(--text-secondary)}.waiting-hint{font-size:.875rem;color:var(--text-muted)}.share-btn{background:var(--accent);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;cursor:pointer}.player-list{flex:1;display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.player-item{display:flex;justify-content:space-between;align-items:center;padding:.875rem 1rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;transition:all .2s}.player-item.current{border-color:var(--accent);background:#e97a931a}.player-item.is-me{background:var(--bg-tertiary)}.player-item.reorder-mode{cursor:grab}.player-item.reorder-mode:active{cursor:grabbing}.player-info{display:flex;align-items:center;gap:.5rem}.current-indicator{color:var(--accent);font-weight:700}.player-name{font-weight:500}.me-badge{font-size:.75rem;color:var(--text-muted)}.edit-name-btn{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:.25rem;margin-left:.25rem;display:flex;align-items:center;opacity:.6;transition:opacity .2s}.edit-name-btn:hover{opacity:1;color:var(--accent)}.edit-name-input{background:var(--bg-tertiary);border:1px solid var(--accent);color:var(--text-primary);padding:.25rem .5rem;font-size:1rem;border-radius:4px;width:120px}.player-actions{display:flex;align-items:center;gap:.5rem}.ask-label{font-size:.75rem;color:var(--accent);font-weight:600;padding:.25rem .5rem;background:#e97a9333;border-radius:4px}.drag-handle{color:var(--text-muted);font-size:1.25rem}.kick-btn{background:transparent;border:1px solid var(--border);color:var(--text-muted);width:1.5rem;height:1.5rem;border-radius:4px;cursor:pointer;font-size:.75rem;opacity:.5;transition:opacity .2s,color .2s}.kick-btn:hover{opacity:1;color:var(--error);border-color:var(--error)}.reorder-toggle{background:transparent;border:1px solid var(--border);color:var(--text-secondary);padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.875rem;align-self:flex-start}.reorder-toggle.active{border-color:var(--accent);color:var(--accent)}.action-bar{display:flex;gap:.5rem;padding:.75rem 0;border-top:1px solid var(--border)}.action-btn{flex:1;background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);padding:.75rem;border-radius:8px;cursor:pointer;font-size:.875rem;position:relative}.action-btn:hover,.action-btn.active{border-color:var(--accent);color:var(--text-primary)}.action-btn.has-triggers{color:var(--warning)}.action-btn.my-turn{border-color:var(--accent);background:#e97a931a;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.action-btn .badge{position:absolute;top:-4px;right:-4px;background:var(--accent);color:#fff;font-size:.625rem;padding:2px 6px;border-radius:10px;min-width:16px;text-align:center}.next-turn-btn{background:var(--accent);color:#fff;border:none;padding:1rem;font-size:1.125rem;font-weight:600;border-radius:8px;cursor:pointer;margin-top:auto}.next-turn-btn:hover:not(:disabled){background:var(--accent-hover)}.next-turn-btn:disabled{opacity:.5;cursor:not-allowed}.trigger-banner{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#f5a6231a;border:none;border-bottom:1px solid var(--border);color:var(--warning);cursor:pointer;width:100%;text-align:left}.trigger-icon{font-weight:700;font-size:1.125rem}.trigger-text{flex:1}.trigger-expand{font-size:.75rem;color:var(--text-muted)}.panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:100;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.panel{position:fixed;bottom:0;left:0;right:0;max-height:70vh;background:var(--bg-secondary);border-top:1px solid var(--border);border-radius:16px 16px 0 0;overflow-y:auto;padding:1rem;animation:slideUp .2s ease-out;z-index:101}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.panel-header h3{font-size:1.125rem}.close-btn{background:transparent;border:1px solid var(--border);color:var(--text-secondary);width:2rem;height:2rem;border-radius:4px;cursor:pointer}.panel-hint{color:var(--text-muted);font-size:.875rem;margin-bottom:1rem}.add-question-form{display:flex;gap:.5rem;margin-bottom:1rem}.add-question-form input{flex:1}.add-question-form button{background:var(--accent);color:#fff;border:none;width:2.5rem;border-radius:8px;cursor:pointer;font-size:1.25rem}.add-question-form button:disabled{opacity:.5}.empty-state{color:var(--text-muted);text-align:center;padding:2rem}.draft-list{list-style:none}.draft-item{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;padding:.75rem;background:var(--bg-tertiary);border-radius:8px;margin-bottom:.5rem}.draft-item.up-next{border:1px solid var(--accent)}.draft-content{flex:1;display:flex;flex-direction:column;gap:.25rem}.up-next-badge{font-size:.625rem;color:var(--accent);font-weight:600}.draft-text{word-break:break-word}.draft-actions{display:flex;gap:.25rem}.draft-actions button{background:transparent;border:1px solid var(--border);color:var(--text-muted);width:1.75rem;height:1.75rem;border-radius:4px;cursor:pointer;font-size:.75rem}.draft-actions button:hover{color:var(--text-primary)}.draft-actions .ask-btn{background:var(--accent);border-color:var(--accent);color:#fff;width:auto;padding:0 .5rem;font-weight:600}.draft-actions .ask-btn:hover{background:var(--accent-hover);color:#fff}.edit-form{width:100%}.edit-form input{width:100%;margin-bottom:.5rem}.edit-actions{display:flex;gap:.5rem}.edit-actions button{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);padding:.375rem .75rem;border-radius:4px;cursor:pointer;font-size:.875rem}.category-list{display:flex;flex-direction:column;gap:.5rem}.category-header{display:flex;justify-content:space-between;align-items:center;width:100%;background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);padding:.75rem 1rem;border-radius:8px;cursor:pointer;font-size:1rem;text-align:left}.category-header.expanded{border-radius:8px 8px 0 0}.expand-icon{color:var(--text-muted)}.prompts-list{list-style:none;background:var(--bg-tertiary);border:1px solid var(--border);border-top:none;border-radius:0 0 8px 8px;padding:.5rem}.prompt-item{padding:.5rem .75rem;color:var(--text-secondary);font-size:.875rem}.prompt-item:before{content:"- ";color:var(--text-muted)}.trigger-section{margin-bottom:1.5rem}.trigger-section h4{font-size:.875rem;color:var(--text-secondary);margin-bottom:.75rem;text-transform:uppercase;letter-spacing:.05em}.preset-grid{display:flex;flex-wrap:wrap;gap:.5rem}.preset-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);padding:.5rem .75rem;border-radius:6px;cursor:pointer;font-size:.875rem}.preset-btn:hover{border-color:var(--warning);color:var(--text-primary)}.preset-btn.active{background:#f5a62326;border-color:var(--warning);color:var(--warning)}.custom-trigger-form{display:flex;gap:.5rem;margin-bottom:.75rem}.custom-trigger-form input{flex:1}.custom-trigger-form button{background:var(--warning);color:#fff;border:none;width:2.5rem;border-radius:8px;cursor:pointer;font-size:1.25rem}.custom-trigger-form button:disabled{opacity:.5}.custom-list{list-style:none}.custom-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:var(--bg-tertiary);border-radius:6px;margin-bottom:.5rem;color:var(--text-secondary)}.custom-item button{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:.25rem}.active-triggers{display:flex;flex-wrap:wrap;gap:.5rem}.active-trigger-chip{background:#f5a62326;color:var(--warning);padding:.375rem .75rem;border-radius:6px;font-size:.875rem}.rules-link{background:transparent;border:none;color:var(--text-muted);cursor:pointer;margin-top:1rem;font-size:.875rem;text-decoration:underline}.rules-link:hover{color:var(--text-secondary)}.rules-screen .rules-content{flex:1;padding:1.5rem;max-width:600px;margin:0 auto;overflow-y:auto}.rules-screen h2{text-align:center;margin-bottom:1.5rem}.rules-section{margin-bottom:1.5rem}.rules-section h3{font-size:1rem;color:var(--accent);margin-bottom:.5rem}.rules-section p{color:var(--text-secondary);font-size:.9375rem;line-height:1.6}.rules-section ol,.rules-section ul{color:var(--text-secondary);font-size:.9375rem;line-height:1.6;margin-left:1.25rem}.rules-section li{margin-bottom:.5rem}.rules-screen .back-link{display:block;margin:1.5rem auto 0}.rules-modal{max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.rules-modal .panel-header{flex-shrink:0;position:sticky;top:0;background:var(--bg-secondary);z-index:1;border-bottom:1px solid var(--border);padding-bottom:.75rem}.rules-modal-content{flex:1;overflow-y:auto;padding-top:.75rem;padding-bottom:1rem}@supports (padding: max(0px)){.screen{padding-top:max(0px,env(safe-area-inset-top));padding-bottom:max(0px,env(safe-area-inset-bottom))}.header{padding-top:max(.75rem,env(safe-area-inset-top))}.panel{padding-bottom:max(1rem,env(safe-area-inset-bottom))}}