:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#f5f0e8;background:#0b0d0e}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}.shell{min-height:100vh;padding:22px 28px 14px;background:radial-gradient(circle at 50% 10%,#25292a,#0b0d0e 56%)}header{max-width:1180px;margin:0 auto 18px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:10px;font-family:Georgia,serif}.brand i{display:grid;place-items:center;width:27px;height:27px;border:1px solid #85745d;border-radius:50%;color:#dfc596}.connection{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #363a3b;border-radius:99px;background:#141718cc;color:#b9b2a8;font-size:12px}.connection b,.presence b{width:7px;height:7px;border-radius:50%;background:#9caa9f;box-shadow:0 0 10px #8cb69b}.connection.online b{background:#6bd697}.stage{position:relative;max-width:1180px;height:min(78vh,730px);min-height:530px;margin:auto;overflow:hidden;border:1px solid #3b3937;border-radius:22px;background:#211e1b;box-shadow:0 30px 80px #000a}.room{position:absolute;inset:-2%;overflow:hidden}.room img{width:100%;height:100%;object-fit:cover;object-position:center 47%;transition:transform 1.2s,filter .7s;animation:camera 13s ease-in-out infinite alternate}.stage.thinking .room img{filter:brightness(.94) saturate(.93)}.stage.speaking .room img{animation:camera 7s ease-in-out infinite alternate,gesture 2.8s ease-in-out infinite;filter:brightness(1.035) saturate(1.04)}.light{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 61% 45%,#f6c98912,transparent 28%),linear-gradient(180deg,#07101a10,transparent 55%,#130b078a)}.grain{position:absolute;inset:0;opacity:.11;pointer-events:none;background:repeating-linear-gradient(0deg,#fff07 0,#fff07 1px,transparent 1px,transparent 3px)}.presence{position:absolute;top:17px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid #fff2;border-radius:99px;background:#111a;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);font-size:11px;text-transform:capitalize}.presence.thinking b{background:#d3b679;animation:pulse .8s infinite}.presence.speaking b{background:#9fbce4;animation:pulse .35s infinite}.name{position:absolute;left:20px;bottom:18px;padding:9px 13px;border-radius:10px;background:#1119;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);font-size:13px}.name span{display:block;color:#c5beb3;font-size:10px}.caption{position:absolute;left:50%;bottom:92px;transform:translate(-50%);max-width:min(660px,78%);padding:11px 16px;border-radius:12px;background:#111e;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);font-size:14px;line-height:1.45;text-align:center}.caption.heard{color:#dff4e7;border:1px solid #82d3a055}.voice-bars{display:inline-flex;align-items:center;height:14px;margin-left:10px;gap:2px;vertical-align:middle}.voice-bars i{width:2px;height:4px;background:#a9c7e8;border-radius:2px;animation:voice .48s ease-in-out infinite alternate}.voice-bars i:nth-child(2n){animation-delay:.15s}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:22px;text-align:center;background:#0c1010a0;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.portrait{width:78px;height:78px;border:3px solid #c5a47c;border-radius:50%;background:url(/maya-study-v2.png) 53% 27%/240% auto}.overlay h1{margin:18px 0 7px;font:500 35px Georgia,serif}.overlay p{max-width:470px;margin:0 0 25px;color:#d0c8bd;font-size:14px}.overlay small{margin-top:13px;color:#9e978d;font-size:10px}.call{padding:13px 27px;border:0;border-radius:99px;background:#eff0e9;color:#151817;font-weight:750;cursor:pointer}.call span{display:inline-block;margin-right:8px;transform:rotate(-35deg)}.controls{position:absolute;left:50%;bottom:19px;transform:translate(-50%);display:flex;gap:8px;padding:8px;border-radius:99px;background:#111c}.controls button,.typebox button{padding:10px 17px;border:1px solid #fff2;border-radius:99px;background:#292c2b;color:#fff;cursor:pointer}.controls .hangup{background:#a64b46}.typebox{position:absolute;left:20px;bottom:20px;display:flex;width:min(310px,32%);padding:7px;border-radius:12px;background:#111c}.typebox input{min-width:0;flex:1;padding:7px 8px;border:0;outline:0;background:transparent;color:#fff;font-size:11px}.typebox button{padding:7px 10px;font-size:10px}.error{position:absolute;top:62px;left:50%;transform:translate(-50%);display:flex;gap:12px;padding:10px 13px;border:1px solid #bc766e;border-radius:10px;background:#4e2927e8;font-size:12px}.error button{border:0;background:none;color:#fff;font-size:18px}footer{text-align:center;margin-top:12px;color:#77746f;font-size:10px}@keyframes pulse{50%{opacity:.25}}@keyframes camera{0%{transform:scale(1.02) translate(-.25%,-.1%)}to{transform:scale(1.035) translate(.25%,.15%)}}@keyframes gesture{35%{transform:scale(1.036) translate(-.12%) rotate(.08deg)}60%{transform:scale(1.032) translate(.15%) rotate(-.06deg)}}@keyframes voice{to{height:14px}}@media(max-width:720px){.shell{padding:12px}.stage{height:82vh;min-height:530px}.room img{object-position:56% center}.typebox{left:12px;bottom:76px;width:calc(100% - 24px)}.caption{bottom:130px;max-width:90%}.name{display:none}.controls{bottom:15px}.overlay h1{font-size:29px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
