/* Agent personal — stil după Urechi, direcția „AI high-tech”: fundal negru, spectru violet→albastru→cyan→roz,
   butoane dreptunghiulare 12 px cu reflex interior, acțiunea principală cu margine în gradient conic, fonturi de sistem. */
:root{
  --c1:#a78bfa; --c2:#60a5fa; --c3:#67e8f9; --c4:#f472b6;
  --page:#000; --scr:#08090b; --fill:#15161a; --edge:rgba(255,255,255,.10); --hi:rgba(255,255,255,.08);
  --text:#f5f5f7; --muted:#a1a1a8; --ok:#30d158; --red:#ff6961; --rec:#ff453a; --warn:#f2c063;
  --amb1:rgba(124,92,255,.17); --amb3:rgba(96,165,250,.20);
  --sans:-apple-system,system-ui,"SF Pro Text",Inter,Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --sunk:inset 0 1px 3px rgba(0,0,0,.55);
  color-scheme:dark;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{margin:0;font-family:var(--sans);color:var(--text);background:var(--page);
  background-image:radial-gradient(1200px 500px at 50% -10%,rgba(124,92,255,.10),transparent 70%);
  min-height:100vh;display:flex;flex-direction:column;
  padding:max(14px,env(safe-area-inset-top)) 16px max(14px,env(safe-area-inset-bottom))}
header{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:28px}
h1{font-size:16px;margin:0;font-weight:600;letter-spacing:.2px}
#status{font-size:12px;color:var(--muted);font-family:var(--mono)}
#status.live::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--rec);margin-right:7px;vertical-align:1px;
  box-shadow:0 0 0 3px rgba(255,69,58,.18);animation:rec 1.6s ease-in-out infinite}
@keyframes rec{0%,100%{opacity:1}50%{opacity:.35}}

.page{display:none;flex-direction:column;gap:12px;margin-top:16px}
.page.on{display:flex}
input{font-size:16px;padding:13px 14px;border-radius:12px;border:1px solid var(--edge);background:var(--fill);color:var(--text);
  box-shadow:var(--sunk);outline:none;width:100%}
input:focus{border-color:rgba(167,139,250,.55)}
input#pin{font-size:30px;letter-spacing:10px;text-align:center;font-family:var(--mono)}
.btn{font:inherit;font-size:16px;font-weight:600;padding:14px;border-radius:12px;border:1px solid var(--edge);background:var(--fill);color:var(--text);
  box-shadow:inset 0 1px 0 var(--hi);cursor:pointer;min-height:52px}
.btn:active{transform:translateY(1px)}
.btn.pri{position:relative;border:1px solid transparent;background:linear-gradient(var(--fill),var(--fill)) padding-box,
  conic-gradient(from 210deg,var(--c1),var(--c2),var(--c3),var(--c4),var(--c1)) border-box;
  box-shadow:0 8px 30px -14px color-mix(in srgb,var(--c1) 70%,transparent),inset 0 1px 0 var(--hi)}
.btn.danger{color:#fff;background:linear-gradient(var(--fill),var(--fill));border-color:rgba(255,105,97,.45)}
.btn.danger.on{background:var(--rec)}
.seg{display:flex;flex-direction:column;gap:8px}
.seg label{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--edge);border-radius:12px;background:var(--fill);box-shadow:var(--sunk);font-size:14px;line-height:1.35}
.seg label b{display:block;font-size:15px}
.seg input[type=radio]{width:18px;height:18px;margin:2px 0 0;accent-color:var(--c1);box-shadow:none}
.hint{font-size:12.5px;color:var(--muted);text-align:center;line-height:1.4;margin:0}
.hint a{color:var(--c2)}
#warn{display:none;background:rgba(255,69,58,.14);border:1px solid rgba(255,69,58,.5);color:#fff;padding:10px 12px;border-radius:12px;font-size:14px;text-align:center}
#msg{color:var(--red);text-align:center;font-size:14px;min-height:18px;margin:0}

/* ecranul de apel: linia de voce */
#pageCall.on{flex:1;min-height:0}
#stage{flex:1;min-height:200px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
#wave{width:100%;height:160px;display:block}
#phase{font-size:15px;color:var(--muted);letter-spacing:.3px;text-align:center;min-height:20px;transition:color .25s}
#phase.hot{color:var(--text)}
#camera{font-family:var(--mono);font-size:12px;color:var(--muted)}
#talk{min-height:84px;font-size:21px;border-radius:14px}
#talk.ask{background:linear-gradient(var(--fill),var(--fill)) padding-box,conic-gradient(from 210deg,var(--c4),var(--c1),var(--c2),var(--c4)) border-box;color:#fff}
#talk.on{border-color:rgba(48,209,88,.55)}
#bar{display:flex;gap:8px}
#bar .btn{flex:1;font-size:14px;padding:11px;min-height:46px}
#log{display:none;max-height:34vh;overflow:auto;font-size:13.5px;line-height:1.4;border-top:1px solid var(--edge);padding-top:8px;margin-top:4px}
#log p{margin:0 0 8px}
#log b{color:var(--c2)}

/* notificări */
.badge{font:inherit;font-size:13px;color:var(--muted);background:var(--fill);border:1px solid var(--edge);border-radius:10px;padding:5px 9px;margin-left:10px;cursor:pointer}
.badge.hot{color:#fff;border-color:rgba(244,114,182,.6);box-shadow:0 0 0 3px rgba(244,114,182,.15)}
.badge b{font-family:var(--mono)}
#inboxPanel{display:none;position:fixed;inset:auto 12px 12px 12px;top:max(56px,env(safe-area-inset-top));background:var(--scr);border:1px solid var(--edge);border-radius:16px;padding:12px;z-index:9;overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.6)}
#inboxPanel.on{display:block}
.inbox-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.inbox-head span{flex:1;font-weight:600}
.btn.mini{font-size:13px;padding:7px 10px;min-height:0}
.item{border:1px solid var(--edge);border-radius:12px;padding:10px;margin-bottom:8px;background:var(--fill)}
.item.unread{border-color:rgba(167,139,250,.5)}
.it-head{display:flex;justify-content:space-between;gap:8px;font-size:14px}
.it-src{color:var(--muted);font-family:var(--mono);font-size:11px;white-space:nowrap}
.it-text{font-size:13.5px;color:var(--muted);margin:6px 0;line-height:1.4;max-height:5.6em;overflow:hidden}
.it-act{display:flex;gap:8px;justify-content:flex-end}