:root{color-scheme:dark;--ice:#8cecff;--violet:#866dff;--panel:#07101ee8;--line:#29405f;--muted:#8396ad}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f2f8ff;background:#010207}
body{min-height:100vh;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#14265a55 0,transparent 32%),radial-gradient(circle at 76% 20%,#4b207833 0,transparent 24%),radial-gradient(circle at 20% 80%,#06496533 0,transparent 30%),#010207}
.galaxy:before,.galaxy:after{content:"";position:fixed;inset:-30%;pointer-events:none;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.5px);background-size:113px 113px;opacity:.15;animation:drift 80s linear infinite}
.galaxy:after{background-size:191px 191px;opacity:.08;animation-duration:120s;animation-direction:reverse}
.aurora{position:fixed;inset:0;pointer-events:none;background:conic-gradient(from 210deg at 50% 50%,transparent,#4a33ff12,#42dcff12,transparent 38%);filter:blur(70px);animation:breathe 8s ease-in-out infinite}
.top{position:fixed;top:0;left:0;right:0;height:76px;padding:20px 26px;display:flex;justify-content:space-between;align-items:center;z-index:5;background:linear-gradient(#010207bb,transparent)}
.brand{font-size:12px;font-weight:900;letter-spacing:.22em}.brand b{color:var(--ice)}.beta{display:inline-flex;margin-left:10px;padding:5px 8px;border:1px solid #73e9ff55;border-radius:999px;color:#bff7ff;font-size:9px;letter-spacing:.18em;background:#0a203055}
.top-right{display:flex;gap:12px;align-items:center;font-size:10px;letter-spacing:.14em;color:#7890aa}#ownerButton{border:1px solid #365875;background:#07101ecc;color:#9fdff1;border-radius:999px;padding:8px 12px;font:inherit;letter-spacing:.12em;cursor:pointer}
.stage{min-height:100vh;display:grid;place-items:center;padding:92px 20px 148px;position:relative}.rex{width:min(760px,94vw);display:grid;place-items:center;text-align:center}
.eyebrow{font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:#7fa2bf;margin-bottom:12px}.headline{margin:0;font-size:clamp(34px,6vw,68px);letter-spacing:-.055em;line-height:.98;font-weight:760}.headline span{background:linear-gradient(90deg,#fff,#9eeeff 48%,#b7a8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{max-width:590px;margin:16px auto 10px;color:#8da0b5;font-size:14px;line-height:1.65}
.orb-wrap{position:relative;width:300px;height:300px;margin:12px 0 4px;display:grid;place-items:center}.orbit,.orbit:before,.orbit:after{position:absolute;content:"";border-radius:50%;border:1px solid #73e9ff20}.orbit{inset:4px;animation:spin 18s linear infinite}.orbit:before{inset:22px;border-color:#8d70ff25}.orbit:after{inset:49px;border-color:#fff1}
.halo{position:absolute;inset:34px;border-radius:50%;background:radial-gradient(circle,#59e9ff20,transparent 65%);filter:blur(4px);animation:halo 3s ease-in-out infinite}
#rexOrb{width:154px;height:154px;border:0;border-radius:50%;cursor:pointer;position:relative;z-index:2;background:radial-gradient(circle at 34% 28%,#fff 0 2%,#c9fbff 5%,#5ee7ff 15%,#5f72ff 43%,#43238f 66%,#090b24 82%,#02030a 100%);box-shadow:0 0 25px #b8f8ff,0 0 80px #4ddfff88,0 0 150px #6950ff66,inset -18px -22px 42px #040515;animation:pulse 2.7s ease-in-out infinite;transition:.25s ease}
#rexOrb:after{content:"";position:absolute;inset:17%;border-radius:50%;background:linear-gradient(135deg,#ffffff75,transparent 30%);filter:blur(5px)}
#rexOrb.listening{animation:pulse .7s ease-in-out infinite;box-shadow:0 0 40px #fff,0 0 110px #5eeaff,0 0 200px #755cff}
#rexOrb.thinking{animation:think 1.3s ease-in-out infinite;box-shadow:0 0 34px #b19cff,0 0 120px #705cffaa,0 0 210px #3822aa66}
#rexOrb.speaking{animation:speakPulse .4s ease-in-out infinite alternate;box-shadow:0 0 46px #e7fdff,0 0 125px #5eeaffbb,0 0 215px #846cff88}
.voice-line{position:absolute;z-index:4;width:108px;height:34px;display:flex;align-items:center;justify-content:center;gap:4px;pointer-events:none}.voice-line i{display:block;width:3px;height:7px;border-radius:999px;background:#e9fdff;box-shadow:0 0 9px #6eeaff;opacity:.35;transform:scaleY(.45)}#rexOrb.speaking~.voice-line i{opacity:1;animation:voiceBar .48s ease-in-out infinite alternate}#rexOrb.speaking~.voice-line i:nth-child(2){animation-delay:-.16s}#rexOrb.speaking~.voice-line i:nth-child(3){animation-delay:-.31s}#rexOrb.speaking~.voice-line i:nth-child(4){animation-delay:-.09s}#rexOrb.speaking~.voice-line i:nth-child(5){animation-delay:-.24s}#rexOrb.speaking~.voice-line i:nth-child(6){animation-delay:-.38s}#rexOrb.speaking~.voice-line i:nth-child(7){animation-delay:-.13s}#rexOrb.speaking~.voice-line i:nth-child(8){animation-delay:-.29s}#rexOrb.speaking~.voice-line i:nth-child(9){animation-delay:-.05s}
.state{font-size:10px;letter-spacing:.28em;color:#9fdff1;margin-top:5px}.talk-hint{margin-top:11px;color:#60768d;font-size:12px}.live-captions{width:min(620px,88vw);min-height:42px;margin:10px auto 0;color:#9fb2c7;font-size:12px;line-height:1.45}.live-captions b{color:#dffaff}.voice-controls{display:flex;gap:8px;align-items:center;justify-content:center}
#voice,#endVoice{margin-top:16px;border:1px solid #78e8ff55;background:linear-gradient(180deg,#10263b,#07131f);color:#d9fbff;border-radius:999px;padding:11px 17px;cursor:pointer;font-weight:800;letter-spacing:.04em;box-shadow:0 10px 45px #0009}#endVoice{border-color:#8b5366;color:#ffc7d3;background:#211019}
.command{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);width:min(720px,92vw);display:flex;gap:9px;z-index:6;padding:7px;border:1px solid #243a54;background:#050b14dd;border-radius:999px;box-shadow:0 18px 70px #000b;backdrop-filter:blur(18px)}
.command input{min-width:0;flex:1;border:0;background:transparent;color:white;padding:12px 15px;outline:none;font-size:14px}.command input::placeholder{color:#5f7287}.command button,.action{border:1px solid #456987;background:#0c1c30;color:#c9f7ff;border-radius:999px;padding:0 17px;cursor:pointer;font-weight:800}
#workspace{position:fixed;inset:76px 20px 24px 28%;z-index:10;background:linear-gradient(180deg,#081321f5,#03070dfa);border:1px solid #2a425f;border-radius:25px;box-shadow:0 30px 120px #000;backdrop-filter:blur(22px);padding:24px;overflow:auto}body.workspace-open .stage{width:27%;place-items:center;padding:82px 8px 24px}body.workspace-open .rex{width:100%}body.workspace-open .headline{font-size:28px}body.workspace-open .sub,body.workspace-open .eyebrow,body.workspace-open .talk-hint{display:none}body.workspace-open .orb-wrap{width:190px;height:190px}body.workspace-open #rexOrb{width:104px;height:104px}#webPanel{height:calc(100% - 58px);margin-top:12px}#webSurface{height:calc(100% - 52px);border:1px solid #1d3047;border-radius:16px;background:#f7f9fc;color:#10131a;display:block;overflow:hidden;font-size:14px}.rex-app-grid{background:#07101e;padding:12px 8px;display:flex;flex-direction:column;gap:8px}.rex-app-grid button{border:1px solid #29405f;background:#0c1c30;color:#c9f7ff;border-radius:10px;padding:10px 6px;font-size:10px;font-weight:900;cursor:pointer}.rex-app-grid button.active{border-color:#8cecff;box-shadow:0 0 18px #4ddfff55}#rexAppView{padding:24px;overflow:auto}#rexAppView h3{margin:0 0 8px;font-size:22px}#rexAppView p{color:#536273;line-height:1.55;white-space:pre-wrap}.rex-source{display:block;margin:10px 0;padding:12px 14px;border:1px solid #d9e2ec;border-radius:12px;background:#fff;color:#164c7e;text-decoration:none;font-weight:750}.rex-source:hover{border-color:#75cfe4}.web-toolbar{height:44px;display:flex;align-items:center;gap:7px;padding:5px 8px;border:1px solid #243a54;border-radius:12px;background:#050b14;color:#9fdff1;font-size:11px;letter-spacing:.04em}.web-toolbar button{height:32px;min-width:32px;border:1px solid #365875;background:#0b1929;color:#d7f9ff;border-radius:8px;font-weight:900;cursor:pointer}.web-toolbar #webAddressInput{height:32px;min-width:0;flex:1;border:1px solid #365875;background:#f8fbff;color:#10131a;border-radius:9px;padding:0 12px;outline:none;font-size:13px;letter-spacing:0}.web-toolbar #webAddressInput:focus{border-color:#75dff5;box-shadow:0 0 0 2px #75dff522}.web-toolbar #webGo{padding:0 13px}.voice-only-hint{white-space:nowrap;color:#79a8bb;font-size:9px}.web-window-actions{display:flex;gap:6px}.web-window-actions button{border:1px solid #365875;background:#07101e;color:#bff7ff;border-radius:999px;padding:5px 9px;font-size:9px;font-weight:800;cursor:pointer}body.workspace-full #workspace{inset:12px;z-index:20}body.workspace-full .stage{position:fixed;right:18px;bottom:18px;width:120px;min-height:120px;padding:0;z-index:30;pointer-events:none}body.workspace-full .rex{pointer-events:auto}body.workspace-full .headline,body.workspace-full .sub,body.workspace-full .eyebrow,body.workspace-full .talk-hint,body.workspace-full .state,body.workspace-full .voice-controls{display:none}body.workspace-full .orb-wrap{width:110px;height:110px;margin:0}body.workspace-full #rexOrb{width:66px;height:66px}body.workspace-min #workspace{inset:auto 18px 18px auto;width:280px;height:58px;padding:8px 12px;overflow:hidden}body.workspace-min #workspace .workspace-head{border:0;padding:0}body.workspace-min #workspace #report,body.workspace-min #workspace #webPanel,body.workspace-min #workspace .approval{display:none!important}body.workspace-min .stage{width:100%;padding:92px 20px 148px}body.workspace-min .rex{width:min(760px,94vw)}.workspace-head{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid #1d3047;padding-bottom:16px}.workspace-head h2{margin:0;font-size:17px;letter-spacing:.05em}.close{background:transparent;border:1px solid #314b68;color:white;border-radius:50%;width:38px;height:38px;cursor:pointer}#report{white-space:pre-wrap;line-height:1.65;color:#d8e7f5;margin-top:20px}.approval{margin-top:18px}.action{padding:12px 18px}[hidden]{display:none!important}
@keyframes pulse{50%{transform:scale(1.08);filter:brightness(1.2)}}@keyframes halo{50%{transform:scale(1.17);opacity:.35}}@keyframes think{50%{transform:scale(.96);filter:hue-rotate(24deg) brightness(1.18)}}@keyframes speakPulse{from{transform:scale(1.02)}to{transform:scale(1.13);filter:brightness(1.3)}}@keyframes voiceBar{from{height:6px;transform:scaleY(.55)}to{height:29px;transform:scaleY(1)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes drift{to{transform:translate3d(113px,113px,0)}}@keyframes breathe{50%{opacity:.5;transform:scale(1.08)}}
@media(max-width:600px){.top{padding:16px}.top #status{display:none}.headline{font-size:38px}.sub{font-size:13px}.orb-wrap{width:235px;height:235px}#rexOrb{width:126px;height:126px}#workspace{inset:62px 10px 86px}.command{bottom:14px}.command #send{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}