:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#000;color:#fff}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:#000}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid white;outline-offset:5px}[hidden]{display:none!important}.backdrop{position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse at 50% 20%,#49030b,transparent 65%),#000;pointer-events:none}.backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent,rgba(0,0,0,.25) 35%,rgba(0,0,0,.55))}video{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}#activation{opacity:0;transition:opacity .4s}body.searching #activation{opacity:1}header,main,.motion{position:relative;z-index:1}header{display:flex;justify-content:space-between;align-items:center;padding:32px 4.2%;gap:20px;font-size:14px}.brand{font-weight:700;letter-spacing:4px}.brand span{color:#ff2948}.hero{text-align:center;padding:clamp(95px,19vh,200px) 20px 32px;max-width:1100px;margin:auto}.eyebrow{font-size:12px;letter-spacing:5px;color:#ccc}h1{font-size:clamp(38px,5.8vw,82px);line-height:1.06;letter-spacing:-3px;margin:34px 0 24px;text-shadow:0 2px 25px #000}h1 span{background:linear-gradient(#fff 15%,#ffc5ce 46%,#ed1636 90%);color:transparent;background-clip:text}.subtitle{font-size:clamp(17px,2vw,24px);color:#ccc}.actions{display:flex;justify-content:center;gap:100px;margin:56px 0 26px}.actions button{width:54px;height:54px;border-radius:50%;border:1px solid #ff2948;background:#170308aa;color:#fff;box-shadow:0 -2px 12px #e5193c55;display:grid;place-items:center}.actions button:hover{background:#591024}.actions svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7}.listening #mic{animation:pulse 1.2s infinite;background:#b20c2b}.listening #mic:after{content:'';position:absolute;width:85px;height:85px;border:1px solid #ff2948;border-radius:50%}@keyframes pulse{50%{box-shadow:0 0 25px 13px #ed163655;transform:scale(1.08)}}#composer{max-width:680px;margin:25px auto 0;animation:reveal .3s ease-out}@keyframes reveal{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}form{display:flex;gap:10px;padding:8px;border:1px solid #ee2347;border-radius:36px;background:#090909ec;box-shadow:0 0 25px #ed163620}input{width:100%;min-width:0;border:0;background:none;color:#fff;padding:10px 14px;outline:none}form button{flex:0 0 44px;border:0;border-radius:50%;background:#ed1636;color:white;font-size:26px}.hint,#status{color:#bbb;font-size:13px;line-height:1.6}#status{min-height:24px}#results{max-width:960px;margin:0 auto 90px;padding:24px;background:#080808ed;border:1px solid #54202a;border-radius:20px}#results h2{font-size:21px;overflow-wrap:anywhere}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.card{padding:20px;border:1px solid #43232a;border-radius:12px;background:#150c0f;display:block}.card:hover{border-color:#ff2948}.card small{display:block;color:#bbb;margin-top:10px}.card strong{display:block;margin-top:8px}.badge{font-size:11px;text-transform:uppercase;color:#ff6b83;letter-spacing:1px}.motion{position:fixed;bottom:12px;right:16px;background:#000b;border:1px solid #444;border-radius:16px;padding:8px 12px;color:#aaa;font-size:11px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}button:disabled{opacity:.5;cursor:wait}@media(max-width:600px){header{padding:24px 20px;font-size:11px}.brand{letter-spacing:2px}.hero{padding-top:19vh}h1{letter-spacing:-1.5px}.eyebrow{font-size:9px;letter-spacing:3px}.actions{gap:70px;margin-top:40px}.cards{grid-template-columns:1fr}#results{margin:0 16px 80px;padding:18px}video{object-position:center}input{font-size:16px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Match the idle clip's larger baked-in globe to the activation clip. */
.backdrop{background:#000;overflow:hidden}
.backdrop #idle{transform-origin:50% 100%;transform:translateY(5vh) scale(.75)}
/* Blend the source frame into black rather than exposing a hard rectangle. */
.backdrop #idle{mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 90%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 90%,transparent)}
#query:focus-visible{outline:none}
#search:focus-within{border-color:#ff5470;box-shadow:0 0 0 2px #ff365a66,0 0 24px #ed16364d}
@media(max-aspect-ratio:4/3){
  /* Widen the source box before scaling so its sides stay off-screen. */
  .backdrop #idle{width:133.333334%;left:-16.666667%;transform:translateY(1vh) scale(.75)}
}
