.item .ii{font-size:25px;text-align:center}
.item small{display:block;color:var(--muted)}
.empty{border:1px dashed #2b4b66;border-radius:18px;padding:28px;text-align:center;color:var(--muted)}
.settingsGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.panel{padding:16px}
.panel p{color:var(--muted);line-height:1.5}
.flow{position:fixed;inset:0;z-index:70;background:#030811dd;display:none;justify-content:flex-end}
.flow.open{display:flex}
.flowPanel{width:min(900px,100%);height:100%;background:#071523;border-left:1px solid #24435f;display:flex;flex-direction:column}
.flowHead{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid #17344e}
.flowCenter{text-align:center}
.flowCenter small{color:var(--cyan);font-weight:850}
.flowCenter b{display:block;margin:2px 0 6px}
.progress{height:5px;background:#102b44;border-radius:99px;overflow:hidden}
.progress i{display:block;height:100%;width:7%;background:linear-gradient(90deg,var(--blue),var(--cyan));transition:.25s}
.chat{flex:1;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:12px}
.msg{display:flex;gap:9px;align-items:flex-end}
.msg.user{justify-content:flex-end}
.bubble{max-width:82%;border:1px solid var(--line);border-radius:18px;padding:12px 14px;background:#0d2032;line-height:1.55}
.user .bubble{border:0;background:linear-gradient(135deg,var(--blue),#338eff)}
.bubble small{color:var(--cyan)}
.actionZone{padding:14px;border-top:1px solid #17344e;background:#081827}
.form{border:1px solid var(--line);border-radius:18px;padding:14px;background:#0c1c2d}
.field{display:block;margin:8px 0}
.field span{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:13px;padding:11px 12px;background:#071522;color:var(--text);outline:none}
.grid2,.grid3{display:grid;gap:9px}
.grid2{grid-template-columns:repeat(2,1fr)}
.grid3{grid-template-columns:repeat(3,1fr)}
.choice{text-align:left;padding:12px;background:#0b1b2c}
.choice strong,.choice small{display:block}
.choice small{color:var(--muted);margin-top:3px}
.drop{border:1px dashed #39719c;border-radius:17px;padding:22px;text-align:center}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
.metric{border:1px solid #23435f;border-radius:14px;background:#081a2b;padding:10px}
.metric small{display:block;color:var(--muted)}
.metric b{display:block;font-size:20px;margin-top:3px}
.steps{display:flex;flex-direction:column;gap:7px}
.step{display:flex;gap:9px;align-items:center;border:1px solid #1b3a55;border-radius:13px;padding:9px 10px;background:#091a2a}
.step i{width:10px;height:10px;border-radius:50%;background:#36536d}
.step.done i{background:var(--green)}
.step.run i{background:var(--cyan);box-shadow:0 0 0 6px #35c8ff14}
.step.warn i{background:var(--amber)}
.resultBox{border-left:4px solid var(--green)}
.warnBox{border-left-color:var(--amber)}
.rod{--size:56px;width:var(--size);height:var(--size);border-radius:calc(var(--size)*.32);border:1px solid #315f87;background:linear-gradient(145deg,#163d69,#08192a);display:grid;place-items:center;position:relative;animation:float 3s ease-in-out infinite;flex:0 0 auto}
.rod.big{--size:112px}
.rod.mini{--size:40px}
.rod:before{content:"";position:absolute;top:-10px;width:2px;height:12px;background:var(--cyan)}
.rod:after{content:"";position:absolute;top:-15px;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px #35c8ffaa}
.face{width:64%;height:44%;border-radius:14px;background:#edf7ff;position:relative}
.eye{position:absolute;top:34%;width:8px;height:11px;border-radius:999px;background:#0a2742;animation:blink 4.5s infinite}
.eye.l{left:24%}
.eye.r{right:24%}
.mouth{position:absolute;left:50%;bottom:18%;width:15px;height:5px;border-bottom:3px solid #0a2742;border-radius:0 0 10px 10px;transform:translateX(-50%)}
.rr{position:absolute;bottom:7%;font-size:11px;font-weight:1000;color:#b9ddff}
@keyframes float{50%{transform:translateY(-4px)}
}
@keyframes blink{0%,44%,48%,100%{transform:scaleY(1)}
46%{transform:scaleY(.12)}
}
.rod.listening{animation:pulseRod 1.1s infinite}
.rod.thinking .eye{animation:look .9s ease-in-out infinite alternate}
.rod.alert{border-color:#b88431}
.rod.alert:after{background:var(--amber)}
.rod.error{border-color:#b64d5a}
.rod.error:after{background:var(--red)}
@keyframes pulseRod{50%{box-shadow:0 0 0 18px transparent}
0%,100%{box-shadow:0 0 0 8px #0b6cff16}
}
@keyframes look{from{transform:translateX(-3px)}
to{transform:translateX(3px)}
}
.rodFloat{position:fixed;right:18px;bottom:18px;z-index:55;display:flex;gap:8px;align-items:end}
.rodPop{display:none;width:min(330px,calc(100vw - 100px));border:1px solid var(--line);background:#0b1a2a;border-radius:19px;padding:12px;box-shadow:var(--shadow)}
.rodPop.open{display:block}
.rodPop p{margin:5px 0;color:#cee0ee;line-height:1.45}
.rodToggle{border:0;background:transparent}
.toast{position:fixed;z-index:120;left:50%;bottom:22px;transform:translate(-50%,20px);opacity:0;border:1px solid #2c5475;background:#0d2032;border-radius:14px;padding:10px 14px;transition:.2s}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1050px){.layout{grid-template-columns:1fr}
.sidebar{position:static;height:auto;display:block}
.nav{flex-direction:row;overflow:auto}
.navbtn{white-space:nowrap}
.sideBottom{display:none}
.toolGrid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:800px){.hero{grid-template-columns:1fr}
.trustStrip{grid-template-columns:repeat(2,1fr)}
.serviceGrid{grid-template-columns:1fr 1fr}
.settingsGrid{grid-template-columns:1fr}
.toolGrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){.app{padding:12px}
.brand b{font-size:15px}
.brand small{font-size:9px}
.topActions .pill{display:none}
.hero h1{font-size:43px}
.quickRow,.grid2,.grid3,.metrics{grid-template-columns:1fr}
.toolGrid{grid-template-columns:1fr 1fr;gap:8px}
.tool{min-height:128px;padding:12px}
.serviceGrid,.trustStrip{grid-template-columns:1fr}
.command{grid-template-columns:52px 1fr}
.flowHead{grid-template-columns:40px 1fr 40px}
.bubble{max-width:90%}
}
