@import "https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Righteous&display=swap";*,:before,:after{box-sizing:border-box}:root{--primary:#3b82f6;--primary-dark:#2563eb;--secondary:#f59e0b;--accent:#ec4899;--text:#f8fafc;--text-muted:#f8fafca6;--text-dim:#f8fafc61;--glass:#ffffff1a;--glass-hover:#ffffff26;--glass-border:#ffffff2e;--input-bg:#ffffff12;--r-sm:8px;--r-md:12px;--r-lg:18px;--r-xl:24px;--blur:20px;--t:.18s ease;--font-head:"Righteous", system-ui, sans-serif;--font-body:"Poppins", system-ui, sans-serif}body{font-family:var(--font-body);min-height:100vh;color:var(--text);background:linear-gradient(135deg,#1e1b4b 0%,#312e81 35%,#1d4ed8 70%,#0369a1 100%) fixed;margin:0}.page-center{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:40px 24px;display:flex}.page-room{align-items:flex-start;gap:24px;max-width:1140px;min-height:100vh;margin:0 auto;padding:24px;display:flex}.room-main{flex-direction:column;flex:1;align-items:center;gap:20px;padding-top:16px;display:flex}.room-sidebar{flex-shrink:0;width:300px;max-height:calc(100vh - 48px);position:sticky;top:24px;overflow-y:auto}.glass{background:var(--glass);-webkit-backdrop-filter:blur(var(--blur));border:1px solid var(--glass-border);border-radius:var(--r-xl);padding:32px}.app-brand{font-family:var(--font-head);text-align:center;background:linear-gradient(135deg, #fff 0%, var(--secondary) 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 16px #f59e0b59);letter-spacing:.06em;-webkit-background-clip:text;background-clip:text;margin:0 0 40px;font-size:2.6rem}.cards-row{flex-wrap:wrap;justify-content:center;gap:24px;width:100%;max-width:820px;display:flex}.card-col{flex:1;min-width:280px}.section-title{font-family:var(--font-head);letter-spacing:.04em;margin:0 0 20px;font-size:1.25rem;font-weight:400}.room-heading{font-family:var(--font-head);letter-spacing:.03em;align-items:center;gap:10px;margin:0;font-size:1.4rem;font-weight:400;display:flex}.room-code-chip{border:1px solid var(--glass-border);letter-spacing:.14em;background:#ffffff24;border-radius:8px;padding:3px 14px;font-family:Courier New,monospace;font-size:1.2rem}.host-badge{font-family:var(--font-body);color:var(--secondary);letter-spacing:.06em;text-transform:uppercase;background:#f59e0b26;border:1px solid #f59e0b4d;border-radius:20px;padding:3px 10px;font-size:.72rem;font-weight:600}.divider-v{background:var(--glass-border);flex-shrink:0;align-self:stretch;width:1px;min-height:80px}.divider-h{background:var(--glass-border);border:none;height:1px;margin:4px 0}.form-group{flex-direction:column;gap:6px;margin-bottom:16px;display:flex}.form-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;font-weight:600}.form-input,.form-textarea{background:var(--input-bg);border:1px solid var(--glass-border);border-radius:var(--r-sm);width:100%;color:var(--text);font-family:var(--font-body);transition:border-color var(--t), box-shadow var(--t), background var(--t);outline:none;min-height:48px;padding:12px 16px;font-size:.95rem}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-dim)}.form-input:focus,.form-textarea:focus{background:#ffffff1a;border-color:#3b82f6b3;box-shadow:0 0 0 3px #3b82f633}.form-textarea{resize:vertical;min-height:168px;line-height:1.65}.btn{font-family:var(--font-body);cursor:pointer;transition:transform var(--t), box-shadow var(--t), opacity var(--t);border-radius:var(--r-md);border:none;justify-content:center;align-items:center;width:100%;min-height:48px;font-weight:600;display:inline-flex}.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none!important;transform:none!important}.btn-primary{color:#fff;letter-spacing:.03em;background:linear-gradient(135deg,#3b82f6,#2563eb);font-size:.95rem;box-shadow:0 4px 14px #2563eb59}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 28px #2563eb80}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-spin{color:#fff;font-family:var(--font-head);letter-spacing:.1em;border-radius:var(--r-xl);background:linear-gradient(135deg,#f59e0b,#ec4899);width:auto;min-height:60px;padding:0 60px;font-size:1.4rem;font-weight:400;box-shadow:0 6px 24px #f59e0b61}.btn-spin:hover:not(:disabled){transform:translateY(-2px)scale(1.04);box-shadow:0 12px 36px #f59e0b8c}.btn-spin:active:not(:disabled){transform:translateY(0)scale(1)}.btn-close{color:var(--text);border:1px solid var(--glass-border);border-radius:var(--r-md);background:#ffffff1a;width:auto;padding:10px 32px;font-size:.9rem;font-weight:500}.btn-close:hover{background:#ffffff2e}.btn-danger{color:#fca5a5;border-radius:var(--r-md);background:#dc262633;border:1px solid #dc262666;width:auto;min-height:38px;padding:8px 20px;font-size:.82rem}.btn-danger:hover{color:#fee2e2;background:#dc262659}.btn-ghost{color:var(--text-muted);border:1px solid var(--glass-border);border-radius:var(--r-md);background:#ffffff0f;width:auto;min-height:38px;padding:8px 20px;font-size:.82rem}.btn-ghost:hover{color:var(--text);background:#ffffff1f}.share-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin:0 0 6px;font-size:.72rem;font-weight:600}.share-code{font-family:var(--font-head);letter-spacing:.3em;background:linear-gradient(135deg, #fff, var(--secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 4px;font-size:2.5rem}.share-url{color:var(--text-dim);word-break:break-all;margin:0 0 12px;font-size:.7rem;line-height:1.5}.list-title{font-family:var(--font-head);letter-spacing:.04em;align-items:center;gap:8px;margin:0 0 10px;font-size:1rem;font-weight:400;display:flex}.count-badge{font-family:var(--font-body);color:var(--secondary);background:#f59e0b26;border:1px solid #f59e0b4d;border-radius:20px;padding:1px 9px;font-size:.72rem;font-weight:700}.entry-list{flex-direction:column;gap:5px;margin:0;padding:0;list-style:none;display:flex}.entry-item{border-radius:var(--r-sm);transition:background var(--t);background:#ffffff0f;align-items:center;gap:10px;padding:8px 12px;font-size:.875rem;display:flex}.entry-item:hover{background:#ffffff1a}.entry-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.empty-hint{color:var(--text-dim);margin:0;padding:4px 0;font-size:.82rem;font-style:italic}.log-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.log-item{border-radius:var(--r-sm);background:#ffffff0f;align-items:center;gap:6px;padding:8px 12px;font-size:.82rem;display:flex}.log-name{font-weight:600}.log-arrow{color:var(--secondary)}.log-result{flex:1}.log-time{color:var(--text-dim);white-space:nowrap;font-size:.7rem}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:100;cursor:pointer;background:#0f172ab8;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-card{-webkit-backdrop-filter:blur(40px);border-radius:var(--r-xl);text-align:center;cursor:default;background:#ffffff1f;border:1px solid #ffffff40;width:auto;max-width:min(90vw,580px);padding:52px 56px;box-shadow:0 24px 64px #0006}.modal-sublabel{color:var(--text-muted);text-transform:uppercase;letter-spacing:.12em;margin:0 0 14px;font-size:.75rem;font-weight:600}.modal-result{font-family:var(--font-head);background:linear-gradient(135deg, #fff, var(--secondary));-webkit-text-fill-color:transparent;word-break:break-word;overflow-wrap:anywhere;-webkit-background-clip:text;background-clip:text;margin:0 0 28px;font-size:clamp(1.5rem,5vw,2.8rem);line-height:1.3}.wait-text{color:var(--text-dim);text-align:center;margin:0;font-size:.875rem}.fade-enter-active,.fade-leave-active{transition:opacity .25s}.fade-enter-from,.fade-leave-to{opacity:0}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff2e;border-radius:3px}@media (width<=768px){.page-room{flex-direction:column;padding:16px}.room-sidebar{width:100%;max-height:none;position:static}.cards-row{flex-direction:column;gap:16px}.divider-v{display:none}.modal-card{padding:40px 32px}.modal-result{font-size:2.2rem}.btn-spin{padding:0 40px;font-size:1.2rem}.app-brand{margin-bottom:28px;font-size:2rem}}