*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--ink: #0f0e0c;--paper: #f5f0e8;--cream: #e8e0d0;--gold: #c9a84c;--gold-dim: #8a6f2e;--muted: #6b6560;--surface: #1a1815;--surface2: #242220;--error: #c0392b;--success: #2e7d5e;--font-display: "Playfair Display", Georgia, serif;--font-body: "EB Garamond", Georgia, serif;--transition: .3s cubic-bezier(.4, 0, .2, 1)}html,body{height:100%;background:var(--ink);color:var(--paper);font-family:var(--font-body);font-size:18px;line-height:1.6}#app{min-height:100vh;display:flex;flex-direction:column}.onboarding{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background:radial-gradient(ellipse at 20% 50%,#1e1a14 0%,transparent 60%),radial-gradient(ellipse at 80% 20%,#1a1610 0%,transparent 50%),var(--ink)}.onboarding-card{width:100%;max-width:480px;animation:fadeUp .6s ease both}.waapal-wordmark{font-family:var(--font-display);font-size:3rem;font-weight:700;color:var(--gold);letter-spacing:-.02em;margin-bottom:.25rem}.waapal-tagline{font-style:italic;color:var(--muted);font-size:1rem;margin-bottom:3rem}.step-indicator{display:flex;gap:.5rem;margin-bottom:2.5rem}.step-dot{width:6px;height:6px;border-radius:50%;background:var(--surface2);transition:var(--transition)}.step-dot.active{background:var(--gold);transform:scale(1.4)}.step-dot.done{background:var(--gold-dim)}.form-group{margin-bottom:1.75rem}.form-label{display:block;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}.form-input,.form-select{width:100%;background:var(--surface);border:1px solid #2e2b26;border-radius:4px;padding:.85rem 1rem;color:var(--paper);font-family:var(--font-body);font-size:1rem;transition:var(--transition);outline:none}.form-input:focus,.form-select:focus{border-color:var(--gold-dim);box-shadow:0 0 0 3px #c9a84c1a}.form-select option{background:var(--surface)}.wake-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem;background:var(--surface);border:1px solid #2e2b26;border-radius:4px}.toggle-label{font-size:.95rem;color:var(--cream)}.toggle{position:relative;width:44px;height:24px}.toggle input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;inset:0;background:var(--surface2);border-radius:24px;cursor:pointer;transition:var(--transition)}.toggle-slider:before{content:"";position:absolute;width:18px;height:18px;left:3px;bottom:3px;background:var(--muted);border-radius:50%;transition:var(--transition)}.toggle input:checked+.toggle-slider{background:var(--gold-dim)}.toggle input:checked+.toggle-slider:before{transform:translate(20px);background:var(--gold)}.btn-primary{width:100%;padding:1rem;background:var(--gold);color:var(--ink);border:none;border-radius:4px;font-family:var(--font-display);font-size:1rem;font-weight:700;letter-spacing:.05em;cursor:pointer;transition:var(--transition);margin-top:.5rem}.btn-primary:hover{background:#d4b55a;transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.activation-screen{text-align:center;padding:2rem 0}.countdown-ring{width:120px;height:120px;margin:2rem auto;position:relative}.countdown-ring svg{transform:rotate(-90deg)}.countdown-ring circle{fill:none;stroke-width:3}.ring-bg{stroke:var(--surface2)}.ring-fill{stroke:var(--gold);stroke-linecap:round;transition:stroke-dashoffset 1s linear}.countdown-number{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:2rem;color:var(--gold)}.main-app{min-height:100vh;display:flex;flex-direction:column;animation:fadeUp .5s ease both}.app-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid #1e1c18}.header-wordmark{font-family:var(--font-display);font-size:1.4rem;color:var(--gold);font-weight:700}.header-meta{font-size:.8rem;color:var(--muted);letter-spacing:.05em}.tab-bar{display:flex;border-bottom:1px solid #1e1c18}.tab{flex:1;padding:.85rem;text-align:center;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;transition:var(--transition);background:none;border-left:none;border-right:none;border-top:none;font-family:var(--font-body)}.tab.active{color:var(--gold);border-bottom-color:var(--gold)}.tab-content{flex:1;padding:1.5rem;overflow-y:auto}.word-card{background:var(--surface);border:1px solid #2e2b26;border-radius:8px;padding:2rem;margin-bottom:1.5rem;animation:fadeUp .4s ease both}.word-card-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:1rem}.word-title{font-family:var(--font-display);font-size:2rem;color:var(--paper);font-weight:700}.word-phonetic{font-style:italic;color:var(--muted);font-size:.9rem;margin-top:.25rem}.word-pos{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-dim);background:#c9a84c14;padding:.25rem .6rem;border-radius:3px}.word-definition{color:var(--cream);margin-bottom:1rem;font-size:1rem;line-height:1.7}.word-example{font-style:italic;color:var(--muted);font-size:.9rem;border-left:2px solid var(--gold-dim);padding-left:1rem;margin-bottom:1.5rem}.word-actions{display:flex;gap:.75rem;flex-wrap:wrap}.btn-action{padding:.6rem 1.2rem;border-radius:4px;font-family:var(--font-body);font-size:.9rem;cursor:pointer;transition:var(--transition);border:1px solid #2e2b26;background:var(--surface2);color:var(--cream)}.btn-action:hover{border-color:var(--gold-dim);color:var(--gold)}.btn-action.primary{background:var(--gold);color:var(--ink);border-color:var(--gold);font-weight:700}.btn-action.primary:hover{background:#d4b55a}.btn-action.recording{background:#c0392b26;border-color:var(--error);color:var(--error);animation:pulse 1.2s infinite}.conversation-box{background:var(--surface2);border:1px solid #2e2b26;border-radius:8px;padding:1.25rem;margin-top:1rem}.conv-prompt{color:var(--muted);font-size:.85rem;letter-spacing:.05em;margin-bottom:.75rem}.conv-response{color:var(--cream);font-size:1rem;min-height:2rem}.conv-feedback{margin-top:.75rem;padding-top:.75rem;border-top:1px solid #2e2b26;font-size:.9rem}.conv-feedback.success{color:var(--success)}.conv-feedback.error{color:var(--error)}.text-input-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}.conv-text-input{flex:1;min-width:0;width:100%;background:var(--surface);border:1px solid #2e2b26;border-radius:4px;padding:.65rem .85rem;color:var(--paper);font-family:var(--font-body);font-size:.95rem;outline:none}.btn-action{flex-shrink:0;padding:.6rem 1rem;border-radius:4px;font-family:var(--font-body);font-size:.85rem;cursor:pointer;transition:var(--transition);border:1px solid #2e2b26;background:var(--surface2);color:var(--cream);white-space:nowrap}.conv-text-input:focus{border-color:var(--gold-dim)}.history-empty{text-align:center;color:var(--muted);font-style:italic;padding:4rem 0}.history-item{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;border-bottom:1px solid #1e1c18;animation:fadeUp .3s ease both}.history-word{font-family:var(--font-display);font-size:1.1rem;color:var(--paper)}.history-meta{font-size:.8rem;color:var(--muted);margin-top:.2rem}.score-badge{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}.score-badge.pass{background:#2e7d5e33;color:var(--success)}.score-badge.fail{background:#c0392b26;color:var(--error)}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@media(max-width:480px){.word-actions,.text-input-row{flex-direction:column}.conv-text-input{width:100%}.btn-action{width:100%;text-align:center}}
