@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#030b16;--surface:#081a2b;--surface2:#0b2339;--border:#244760;--text:#eff8ff;--muted:#a0b7ca;--cyan:#48d5ff;--gold:#eec780;--ok:#54e7c5;--danger:#ff929e;--vh:100dvh}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif}body{background:radial-gradient(ellipse at 45% -30%,#123858 0,transparent 58%),var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:'Space Grotesk',sans-serif;letter-spacing:-.035em}p{color:var(--muted);line-height:1.55}small,.small{font-size:12px;color:var(--muted)}.shell{height:100dvh;min-height:550px;display:grid;grid-template-rows:64px minmax(0,1fr) 43px;max-width:1900px;margin:auto;padding:0 clamp(12px,2vw,32px)}.topbar{display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--border);min-width:0}.brand{display:flex;align-items:center;gap:12px;min-width:235px}.brand img{height:42px;width:52px;object-fit:contain}.brand strong{display:block;font-size:14px;letter-spacing:1.1px}.brand small{display:block;color:var(--cyan);letter-spacing:2px;font-size:10px;font-weight:800;margin-top:3px}.menu{display:flex;align-items:center;justify-content:center;gap:4px;flex:1;min-width:0}.menu a{padding:10px 12px;border-radius:9px;font-size:12px;color:#b7cfe0;white-space:nowrap;font-weight:700}.menu a:hover,.menu a.active{background:#10314b;color:#62dcff}.rightbar{display:flex;gap:10px;align-items:center}.chip{border:1px solid #2e7899;border-radius:40px;padding:8px 12px;font-size:10px;color:#65dfff;letter-spacing:.5px;white-space:nowrap}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 12px var(--ok);margin-right:6px}.iconbtn{background:#0e293f;border:1px solid var(--border);border-radius:9px;color:#d9f4ff;padding:9px 11px}.mobile-menu{display:none}.main{min-height:0;overflow:hidden;padding:12px 0}.page{height:100%;min-height:0;display:flex;flex-direction:column;gap:12px}.page-header{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-shrink:0}.page-header h1{font-size:clamp(20px,2vw,28px)}.page-header p{font-size:12px;margin-top:3px}.eyebrow{color:#68cfff;letter-spacing:2px;font-weight:800;font-size:10px}.panel{background:linear-gradient(145deg,#0a2136,#061320 75%);border:1px solid var(--border);border-radius:16px;min-height:0}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:minmax(320px,.9fr) minmax(400px,1.1fr);gap:12px}.voice-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(12px,2vh,22px);min-height:0;overflow:hidden}.voice-heading h2{font-size:clamp(20px,2.6vh,28px);margin:6px 0}.voice-heading h2 em{font-style:normal;color:var(--cyan)}.voice-heading p{font-size:11px}.orb-stage{flex:1;min-height:100px;display:flex;align-items:center;justify-content:center;width:100%;position:relative;overflow:hidden}.orb-stage canvas{width:min(100%,330px,36vh);height:min(100%,330px,36vh);max-width:100%;aspect-ratio:1;display:block}.orb-overlay{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at center,transparent 26%,#071b2900 50%)}.voice-controls{width:100%;display:grid;justify-items:center;gap:7px;flex-shrink:0}.voice-controls .state{font-weight:800;font-size:13px}.voice-controls .micro{color:var(--muted);font-size:11px}.meter{width:min(260px,80%);height:4px;border-radius:9px;background:#294d62;overflow:hidden}.meter>div{height:100%;width:0;background:linear-gradient(90deg,#55e9d0,#5dcaff,#dfbfff);transition:width .09s}.buttons{display:flex;gap:7px;flex-wrap:wrap;justify-content:center;margin-top:6px}.btn{border:1px solid #35617b;border-radius:10px;background:#122d42;color:#e9f7ff;padding:10px 15px;font-weight:800;font-size:12px}.btn.primary{background:linear-gradient(120deg,#1382b5,#3cc9ee);color:#041827;border-color:#56d6fa}.btn.ghost{background:transparent}.voice-bottom{display:flex;justify-content:space-between;width:100%;gap:12px;font-size:10px;color:#8db4cb;padding-top:6px}.data-col{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:12px;min-height:0}.history-card{padding:14px;display:flex;flex-direction:column;gap:10px;min-height:0}.section-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.section-head h3{font-size:16px}.section-head small{font-size:10px}.history{flex:1;overflow:auto;min-height:0;display:flex;flex-direction:column;gap:9px;padding-right:4px;scrollbar-width:thin}.message{border:1px solid #244961;border-radius:11px;background:#071626;padding:11px 12px;font-size:12px;line-height:1.55;overflow-wrap:anywhere}.message.user{border-left:3px solid #50d6ff}.message.ai{border-left:3px solid #f0bf72}.message.error{border-color:#8d3d56;background:#301c2a;color:#ffd6dc}.message .meta{font-size:10px;letter-spacing:1px;color:#83b8d2;font-weight:800;margin-bottom:5px;display:flex;justify-content:space-between}.message.ai .meta{color:#e5c68b}.message.error .meta{color:#ffb2c0}.placeholder{margin:auto;text-align:center;color:#86a9c2;font-size:13px;max-width:270px}.placeholder svg{display:block;margin:0 auto 12px}.metrics-card{padding:13px;flex-shrink:0}.metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;margin-top:10px}.metric{background:#071726;border:1px solid #1e3e55;border-radius:9px;padding:9px 7px;min-width:0}.metric strong{font-size:clamp(13px,1.5vw,19px);display:block;font-variant-numeric:tabular-nums}.metric small{font-size:9px;display:block;margin-top:3px;line-height:1.25}.footer{border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:10px;color:#b4d3e5}.footer .footbrand{display:flex;align-items:center;gap:9px}.footer .footbrand img{width:49px;height:31px;object-fit:cover}.footer .agency{display:flex;align-items:center;gap:9px}.footer .agency img{height:35px;width:35px;object-fit:contain}.footer b{color:#f3ca7d}.content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-height:0;overflow:auto;padding-bottom:8px}.settings-panel{padding:20px;min-height:0}.settings-panel h2{font-size:18px;margin-bottom:5px}.settings-panel p{font-size:12px;margin-bottom:14px}.field{display:flex;flex-direction:column;gap:6px;margin:12px 0}.field label{font-size:12px;color:#bcd4e6;font-weight:700}.field input,.field select,.field textarea{width:100%;background:#041421;border:1px solid #305772;color:#f3fbff;padding:10px 11px;border-radius:9px;outline-offset:2px;min-width:0}.field textarea{min-height:100px;resize:vertical}.inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.switch{display:flex;align-items:center;gap:9px;font-size:12px;color:#c3d7e5;margin:10px 0}.switch input{accent-color:#44c9ff}.note{background:#0b2b3b;border-left:3px solid #49b9e7;padding:11px 12px;font-size:12px;line-height:1.5;color:#c3dfef;border-radius:4px}.warning{border-color:#ac7a4d;background:#2b211b}.codebox{background:#020d17;border:1px solid #31526b;padding:13px;border-radius:10px;color:#b9f0ff;font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:210px;overflow:auto}.log{overflow:auto;max-height:40vh;display:grid;gap:6px}.logitem{padding:10px;background:#071624;border:1px solid #1d3c53;border-radius:8px;font-size:12px;overflow-wrap:anywhere}.pill{display:inline-block;border-radius:20px;border:1px solid #366b83;padding:5px 9px;color:#74d8fa;font-size:10px}.roadmap{display:grid;gap:10px}.road{padding:13px;border:1px solid #284b62;border-radius:10px;background:#081a2a}.road strong{display:block;font-size:13px;margin-bottom:5px}.road p{font-size:12px}.soon{color:#e5c68b;font-size:10px;letter-spacing:1px}.only-scroll{overflow:auto;min-height:0}.hidden{display:none!important}dialog{background:#081a2b;color:white;border:1px solid #376884;border-radius:15px;max-width:450px;width:calc(100% - 24px);padding:20px}dialog::backdrop{background:#000b}body.embed .shell{padding:0;grid-template-rows:minmax(0,1fr)}body.embed .topbar,body.embed .footer,body.embed .data-col,body.embed .page-header{display:none}body.embed .main{padding:0}body.embed .workspace{grid-template-columns:1fr}body.embed .voice-card{border-radius:0}body.embed .orb-stage canvas{width:min(230px,40vh);height:min(230px,40vh)}
@media(max-width:1200px){.menu a{padding:9px 7px;font-size:11px}.brand{min-width:190px}.metrics{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.shell{min-height:0;height:100dvh;grid-template-rows:57px minmax(0,1fr) 40px}.mobile-menu{display:block}.menu{display:none;position:absolute;top:57px;left:12px;right:12px;z-index:10;background:#081d2e;border:1px solid var(--border);border-radius:12px;padding:10px;box-shadow:0 15px 40px #000a;flex-direction:column;align-items:stretch}.menu.open{display:flex}.menu a{font-size:13px;padding:11px}.topbar{gap:8px}.brand{min-width:0;flex:1}.chip{display:none}.workspace{grid-template-columns:1fr;grid-template-rows:minmax(310px,52%) minmax(240px,48%)}.data-col{grid-template-rows:minmax(0,1fr) auto}.metrics{grid-template-columns:repeat(6,1fr)}.orb-stage canvas{width:min(205px,27vh);height:min(205px,27vh)}.content-grid{grid-template-columns:1fr}.footer .footbrand span{display:none}}
@media(max-width:580px){.shell{grid-template-rows:54px minmax(0,1fr) 34px;padding:0 8px}.brand img{width:38px;height:34px}.brand strong{font-size:12px}.brand small{font-size:8px}.rightbar{gap:5px}.main{padding:7px 0}.page{gap:7px}.workspace{gap:7px;grid-template-rows:minmax(295px,51%) minmax(210px,49%)}.voice-card{padding:9px}.voice-heading h2{font-size:19px;margin:3px 0}.voice-heading p{font-size:10px}.orb-stage canvas{width:min(175px,24vh);height:min(175px,24vh)}.voice-controls{gap:4px}.btn{padding:8px 10px;font-size:11px}.voice-bottom{font-size:9px}.history-card{padding:10px}.metrics-card{padding:8px}.metrics{grid-template-columns:repeat(3,1fr);gap:5px;margin-top:6px}.metric{padding:5px}.metric strong{font-size:14px}.metric small{font-size:8px}.footer{font-size:9px}.footer .agency img{height:27px;width:27px}.page-header h1{font-size:19px}}
@media(max-height:690px) and (min-width:901px){.shell{grid-template-rows:52px minmax(0,1fr) 35px}.main{padding:7px 0}.voice-heading h2{font-size:19px;margin:3px 0}.voice-heading p{font-size:10px}.orb-stage canvas{width:min(215px,31vh);height:min(215px,31vh)}.voice-card{padding:9px}.buttons{margin-top:2px}.btn{padding:7px 11px}.metrics-card{padding:8px}.metrics{margin-top:6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}