:root {
  --accent: #41b9e8; --accent-soft: #112f40; --accent-muted: #75cce9;
  --accent-border: #287c9d; --accent-glow: rgba(65,185,232,.35); --accent-particle: #6ed7ff;
  --bg: #071018; --surface: rgba(12,24,35,.9); --surface-2: #10212e;
  --text: #edf6fa; --text-muted: #a9bbc5; --border: rgba(177,207,220,.18); --shadow: rgba(0,0,0,.45);
}
body[data-appearance="light"] { --bg:#edf4f7; --surface:rgba(255,255,255,.93); --surface-2:#e1edf2; --text:#13242d; --text-muted:#526974; --border:rgba(26,63,80,.18); --shadow:rgba(19,41,52,.14); }
body[data-accent="red"] {--accent:#f26970;--accent-soft:#3b1b24;--accent-muted:#ff9b9f;--accent-border:#a6414d;--accent-glow:rgba(242,105,112,.35);--accent-particle:#ff9298}
body[data-accent="orange"] {--accent:#f29b5a;--accent-soft:#3d2718;--accent-muted:#ffc58e;--accent-border:#b86a32;--accent-glow:rgba(242,155,90,.35);--accent-particle:#ffbd78}
body[data-accent="gold"] {--accent:#e3bd57;--accent-soft:#382f17;--accent-muted:#f5dc8a;--accent-border:#a88831;--accent-glow:rgba(227,189,87,.35);--accent-particle:#f6d66c}
body[data-accent="green"] {--accent:#51bd91;--accent-soft:#143328;--accent-muted:#8ce0b8;--accent-border:#348660;--accent-glow:rgba(81,189,145,.35);--accent-particle:#7ae8b2}
body[data-accent="indigo"] {--accent:#7786ed;--accent-soft:#20254d;--accent-muted:#aab5ff;--accent-border:#535fba;--accent-glow:rgba(119,134,237,.35);--accent-particle:#a4b3ff}
body[data-accent="violet"] {--accent:#af76e8;--accent-soft:#35204a;--accent-muted:#dab0ff;--accent-border:#824db3;--accent-glow:rgba(175,118,232,.35);--accent-particle:#d19cff}
* { box-sizing:border-box; }
body { background:radial-gradient(circle at 50% -10%,var(--accent-soft),transparent 45%),var(--bg); color:var(--text); transition:background .35s,color .35s; }
#echoCanvas { position:fixed; inset:0; z-index:-1; opacity:.68; pointer-events:none; }
.echo-shell { width:min(1080px,calc(100% - 32px)); margin:28px auto 52px; }
.echo-header { display:flex; justify-content:space-between; gap:20px; align-items:center; margin-bottom:22px; }
.brand-lockup { display:flex; align-items:center; gap:13px; }.brand { color:var(--text); letter-spacing:-.04em; font-size:29px; }.subtitle,.footer,.meta { color:var(--text-muted)!important; }.theme-controls,.language-control,.carousel-controls { display:flex; gap:7px; align-items:center; }.utility-button,.accent-select { min-height:40px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); border-radius:10px; padding:7px 10px; cursor:pointer; }.accent-select { max-width:100px; }
.center-logo-mark { width:clamp(58px,8vw,88px); aspect-ratio:152.56 / 145.75; margin:0 auto 18px; background:var(--accent); -webkit-mask:url("/static/branding/Logo-Type01-SVG.svg") center / contain no-repeat; mask:url("/static/branding/Logo-Type01-SVG.svg") center / contain no-repeat; filter:drop-shadow(0 0 16px var(--accent-glow)); transition:filter .35s,transform .35s; }
.voice-panel { position:relative; overflow:hidden; background:var(--surface)!important; border:1px solid var(--border)!important; box-shadow:0 22px 60px var(--shadow)!important; padding:clamp(20px,4vw,42px)!important; backdrop-filter:blur(16px); }
.listen-orbit { width:124px;height:124px;border:1px solid var(--accent-border);border-radius:50%;margin:0 auto 18px;position:relative;box-shadow:0 0 35px var(--accent-glow),inset 0 0 30px var(--accent-soft); }.listen-orbit span { position:absolute;width:6px;height:6px;background:var(--accent-particle);border-radius:50%;box-shadow:0 0 10px var(--accent-particle); }.listen-orbit span:nth-child(1){top:14px;left:55px}.listen-orbit span:nth-child(2){right:18px;bottom:32px}.listen-orbit span:nth-child(3){left:20px;bottom:26px}
.listen-controls { justify-content:center; }.record-button,.stop-button { min-height:52px; border-radius:28px!important; background:var(--accent)!important; color:#06131a!important; }.stop-button { background:var(--surface-2)!important;color:var(--text)!important;border:1px solid var(--border)!important; }.listen-guidance { text-align:center;color:var(--text-muted);margin:14px 0 6px; }.recording-playback { display:block;margin:14px auto 0;background:transparent!important;color:var(--text)!important;border:1px solid var(--border)!important; }
.status { text-align:center;color:var(--accent-muted)!important; }.query-preview,.heard { background:var(--surface-2)!important;color:var(--text);border:1px solid var(--border); }.heard-label,.heard-text { color:var(--text)!important; }.heard { max-width:720px;margin:14px auto 0; }.evidence-toggle { color:var(--text-muted)!important; }
.result-experience { display:none; margin-top:24px; }.result-toolbar { display:flex;justify-content:space-between;align-items:center;margin-bottom:12px; }.lang-button { border:1px solid var(--border); background:transparent; color:var(--text-muted); padding:7px 11px; min-height:36px; }.lang-button.active { background:var(--accent-soft);color:var(--accent-muted);border-color:var(--accent-border); }.carousel-position { color:var(--text-muted);font-size:13px; }
body[data-ui-state="REVEAL"] .result-experience.has-results { display:block; }.results { display:block!important;margin-top:0!important; }.result { display:none; background:linear-gradient(145deg,var(--surface),var(--surface-2))!important;border:1px solid var(--border)!important;border-radius:20px!important;padding:clamp(20px,4vw,38px)!important;box-shadow:0 16px 38px var(--shadow)!important; }.result.active-result { display:block; }.result-top { border-bottom:1px solid var(--border);padding-bottom:14px; }.location { color:var(--accent-muted); font-size:16px!important; letter-spacing:.03em; }.matched { color:var(--text); font-size:clamp(22px,4vw,31px)!important;line-height:2!important; }.evidence-label { color:var(--accent-muted)!important; }.matcher-partial-result .evidence-label { color:#e5c66a!important; }.play { background:var(--accent)!important;color:#06131a!important; }.meta { font-size:13px!important; }
.carousel-controls { justify-content:center;margin:13px 0 18px; }.contextual-hook { display:grid;gap:5px;border:1px solid var(--accent-border);border-left:3px solid var(--accent);border-radius:14px;padding:16px;background:linear-gradient(90deg,var(--accent-soft),transparent); }.contextual-hook strong { font-size:16px; }.contextual-hook span:last-child { color:var(--text-muted); }.eyebrow { font-size:11px;letter-spacing:.14em;color:var(--accent-muted);font-weight:700; }.explore-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:13px 0; }.explore-grid button { min-height:48px;background:var(--surface-2)!important;border:1px solid var(--border)!important;color:var(--text)!important; }.related-results { display:none; margin-top:14px; }.related-results.has-related { display:block; }.related-result-card { padding:10px;margin-top:7px;border:1px solid var(--border);border-radius:10px;color:var(--text-muted); }
body[data-ui-state="LISTENING"] .listen-orbit { animation:echo-pulse 1.45s infinite ease-in-out; } body[data-ui-state="IDENTIFYING"] .listen-orbit { animation:echo-spin 1.9s infinite linear; } body[data-ui-state="REVEAL"] #echoCanvas { opacity:.2; } @keyframes echo-pulse {50%{transform:scale(1.12);box-shadow:0 0 58px var(--accent-glow),inset 0 0 35px var(--accent-soft)}} @keyframes echo-spin {to{transform:rotate(360deg)}}
button:focus-visible,select:focus-visible { outline:3px solid var(--accent-muted);outline-offset:3px; } [dir="rtl"] { text-align:right; }
@media (max-width:600px){.echo-shell{width:min(100% - 20px,600px);margin-top:14px}.echo-header{align-items:flex-start}.brand{font-size:24px}.brand-logo{width:38px;height:38px}.theme-controls{flex-direction:column;align-items:stretch}.accent-select{max-width:86px}.explore-grid{grid-template-columns:repeat(2,1fr)}.result-toolbar{align-items:flex-start}.result-top{gap:9px}.matched{font-size:24px!important}.play{min-height:44px}.carousel-controls .utility-button{min-width:44px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}#echoCanvas{display:none}}
.quran-enrichment{display:grid;gap:10px;margin-bottom:18px}.canonical-key{color:var(--accent-muted);font-weight:700}.canonical-arabic{font-size:clamp(24px,4vw,36px);line-height:2;color:var(--text)}.canonical-translation{font-size:16px;line-height:1.7}.surah-facts,.translation-attribution,.enrichment-unavailable{font-size:13px;color:var(--text-muted)}.quran-actions,.explore-tabs,.listen-options{display:flex;flex-wrap:wrap;gap:8px}.quran-action,.explore-button,.word-audio{background:var(--surface-2)!important;color:var(--text)!important;border:1px solid var(--border)!important;min-height:38px;padding:7px 11px}.exploration{border-top:1px solid var(--border);padding-top:14px;margin-top:4px}.explore-content{margin-top:10px;color:var(--text-muted);line-height:1.65}.word-list{display:flex;flex-wrap:wrap;gap:7px}.quran-word{background:var(--accent-soft)!important;color:var(--text)!important;border:1px solid var(--accent-border)!important;padding:8px 10px}.word-detail,.context-row,.tafsir-row{display:grid;gap:5px;padding:11px 0;border-bottom:1px solid var(--border)}.word-detail strong{font-size:25px;color:var(--text)}.center-logo-mark:hover{filter:drop-shadow(0 0 23px var(--accent-glow));transform:translateY(-1px)}body[data-ui-state="LISTENING"] .center-logo-mark{filter:drop-shadow(0 0 27px var(--accent-glow))}body[data-ui-state="IDENTIFYING"] .center-logo-mark{filter:drop-shadow(0 0 31px var(--accent-glow))}
.fusion-result{display:block}.fusion-heading{font-weight:700;letter-spacing:.08em}.fusion-summary{color:var(--text-muted);margin:14px 0}.fusion-occurrences{border-top:1px solid var(--border);margin-top:16px;padding-top:14px}.fusion-occurrences h3{color:var(--accent-muted);font-size:12px;letter-spacing:.12em;margin:0 0 10px}.fusion-occurrence-list{display:grid;gap:6px}.fusion-occurrence{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:8px 10px}.fusion-occurrences .explore-button{margin-top:10px}.fusion-multiple .fusion-heading,.fusion-bismillah .fusion-heading{color:var(--accent-muted)}.fusion-unresolved .fusion-summary{max-width:42rem}
.fusion-resolved .fusion-heading{margin-bottom:12px}.fusion-occurrence{display:flex;align-items:center;justify-content:space-between;min-height:42px;text-align:start;cursor:pointer}.fusion-occurrence::after{content:"→";color:var(--accent-muted)}.fusion-occurrence:hover{border-color:var(--accent-border);background:var(--accent-soft)}.fusion-occurrence-detail{margin-top:10px}.fusion-occurrence-detail .quran-enrichment{padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}.surah-facts{font-size:14px;font-weight:700;color:var(--text)}.translation-attribution{display:block;margin-top:-3px}@media (max-width:600px){.result-top{align-items:flex-start}.fusion-occurrence{min-height:46px}.quran-actions,.explore-tabs{gap:7px}.quran-action,.explore-button{flex:1 1 auto}}
