:root{color-scheme:dark;--bg:#090d0e;--ink:#e4efed;--dim:#92aaa6;--aqua:#71d9c8;--line:#2b3937;--panel:#101918;--danger:#f6c4ac;font-family:"Geeza Pro","Noto Sans Arabic",Tahoma,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);min-height:100svh}button,input,select,textarea{font:inherit}button,select,textarea{border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--ink)}button{min-height:44px;padding:9px 20px;cursor:pointer;touch-action:manipulation;transition:background .18s,border-color .18s}button:hover{background:#1c2a27;border-color:var(--aqua)}button:active{background:#263b35}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--aqua);outline-offset:4px}.quiet{color:var(--dim);font-size:.9rem}.quiet:hover{color:var(--ink)}header{position:absolute;z-index:1;inset-block-start:max(22px,env(safe-area-inset-top));inset-inline:clamp(20px,4vw,56px);display:flex;align-items:baseline;gap:16px}.name{font-size:1.3rem;font-weight:600}.edition{color:var(--dim);font-size:.75rem}
main{min-height:100svh;display:grid;grid-template-rows:1fr auto;align-items:center;padding:100px 24px 100px}.face{direction:ltr;display:flex;align-items:center;justify-content:center;gap:clamp(34px,7vw,116px);height:42svh;transform:translateY(3svh);isolation:isolate}.eye{display:block;width:clamp(72px,20vw,212px);height:clamp(70px,18vw,175px);border-radius:42% 42% 40% 40%;background:var(--aqua);box-shadow:0 0 44px #71d9c817;transition:height .25s,border-radius .25s,transform .25s;animation:blink 7s infinite}.eye-left{animation-delay:.06s}.face[data-phase="requesting"] .eye{height:clamp(40px,11vw,100px);border-radius:50%;animation:none}.face[data-phase="listening"] .eye{height:clamp(86px,22vw,210px);border-radius:48%;animation:attend 1.5s ease-in-out infinite}.face[data-phase="thinking"] .eye{height:clamp(35px,9vw,80px);border-radius:35%;animation:consider 1.8s ease-in-out infinite}.face[data-phase="thinking"] .eye-left{animation-delay:.25s}.face[data-phase="ready"] .eye{border-radius:50% 50% 30% 30%;animation:none}.face[data-phase="speaking"] .eye{animation:voice .65s ease-in-out infinite alternate}.face[data-phase="speaking"] .eye-left{animation-delay:.16s}.interaction{text-align:center;max-width:600px;margin-inline:auto;min-height:155px;align-self:end}#state-label{color:var(--dim);font-size:.9rem;margin:0 0 16px}#primary{border-color:#427f73;color:var(--aqua);min-width:184px}.notice{color:var(--dim);font-size:.8rem;line-height:1.9;margin-block:14px 0;max-width:530px}.notice[data-error="true"]{color:var(--danger)}.drawer-toggle{position:fixed;inset-inline-end:clamp(20px,4vw,56px);inset-block-end:max(20px,env(safe-area-inset-bottom));border-color:transparent}
dialog{border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:28px;max-width:calc(100vw - 24px);line-height:1.9}dialog::backdrop{background:#0009}#drawer{width:min(460px,100%);height:100dvh;max-height:100dvh;margin-block:0;margin-inline:0 auto;overflow:auto;border-radius:0;border-block:0;overscroll-behavior:contain}.drawer-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}h1,h2{font-size:1.05rem;margin:0;font-weight:600}h2{margin-block:24px 10px}dialog p{font-size:.88rem;color:var(--dim);margin-block:12px}.privacy{color:var(--ink)}label{display:block;font-size:.88rem;margin-block:14px 6px}select,textarea{width:100%;padding:10px 12px;min-height:44px;background:var(--bg)}textarea{resize:vertical;min-height:100px;max-height:260px}select{margin-bottom:12px}.switch-row{display:flex;align-items:center;gap:12px}.switch-row label{margin:0}.switch-row input{width:22px;height:22px;accent-color:var(--aqua);flex-shrink:0}.hint{font-size:.76rem!important}.drawer-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;padding-bottom:16px}#transcript{padding:0;list-style:none;margin-block:12px 24px}#transcript li{padding-block:10px;border-bottom:1px solid var(--line);font-size:.92rem;white-space:pre-wrap;overflow-wrap:anywhere}#transcript strong{font-size:.72rem;color:var(--aqua);display:block;margin-bottom:4px}#send{width:100%;color:var(--aqua);border-color:#427f73}#consent{border-radius:12px;width:480px}#consent h2{margin-top:0}.no-js{position:fixed;inset:45% 20px auto;text-align:center;background:var(--bg);padding:20px} [hidden]{display:none!important}
@keyframes blink{0%,43%,48%,100%{transform:scaleY(1)}45%{transform:scaleY(.07)}}@keyframes attend{50%{transform:scale(1.025)}}@keyframes consider{50%{transform:translateY(-8px)}}@keyframes voice{to{transform:scaleY(.83)}}
@media(max-width:480px){main{padding-inline:18px;padding-bottom:108px}.face{gap:36px}.eye{width:28vw;height:27vw}.edition{font-size:.68rem}dialog{padding:22px}.notice{font-size:.75rem}.interaction{min-height:170px}.drawer-toggle{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.face{transform:none}}

/* Candidate additions */
.check{display:flex;align-items:flex-start;gap:10px}.check input{width:22px;height:22px;flex-shrink:0}a{color:var(--aqua)}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:.75rem;max-height:50vh;overflow:auto;direction:ltr;text-align:left}summary{cursor:pointer;min-height:44px}progress{width:100%;margin-block:12px}#play{margin:10px}#stop{margin:10px}button:disabled{opacity:.65}
