/* VoßBot OS — structured UI revision v0.2 */
:root{--bg:#071019;--panel:#0d1c28;--panel2:#112737;--line:#254252;--text:#e7f4f9;--muted:#8ca9b9;--accent:#34d4eb}
body{background:radial-gradient(circle at 75% -10%,#103448 0,transparent 36%),var(--bg);color:var(--text)}
.app{grid-template-columns:252px minmax(0,1fr);min-height:100vh}
.side{background:#091722;border-right:1px solid #203949;padding:22px 12px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:2px}
.brand{padding:8px 12px 26px;border-bottom:1px solid #1c3443;margin-bottom:18px;font-size:22px;letter-spacing:-.5px}
.brand small{letter-spacing:1.35px;font-weight:500;color:#78a3b5}
.nav{border-radius:11px;margin:0 0 4px;padding:13px 15px;font-size:14px;color:#a9c2cf;transition:background .15s}
.nav.active{background:linear-gradient(90deg,#114458,#0d2a3a);color:#f2fdff;border-color:#1c7d93;box-shadow:inset 3px 0 0 #39d9ed}
.main{max-width:1390px;padding:32px clamp(20px,3vw,48px) 24px}
header{padding:0 0 23px;border-bottom:1px solid #223d4d;align-items:center}
header h1{font-size:clamp(27px,3vw,35px);letter-spacing:-.8px;margin:8px 0 5px}
.kicker{font-weight:700;letter-spacing:1.5px;font-size:11px}
.muted{color:var(--muted);line-height:1.55}
header .actions{align-items:center}
header .actions .tag{padding:10px 12px}
button{font-size:13px;font-weight:600;transition:background .16s,border-color .16s,transform .16s}
button:active{transform:translateY(1px)}
.primary{background:#0b6980;color:#effcff}
.cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:24px 0 26px}
.card,.panel{background:linear-gradient(160deg,#102431 0%,#0b1a26 100%);border:1px solid #284556;box-shadow:0 8px 30px #0002}
.card{padding:20px;min-height:142px;border-radius:15px}
.card>.muted{font-size:12px;font-weight:600;letter-spacing:.2px}
.metric{font-size:32px;line-height:1.1;margin:14px 0}
.tag{border-color:#2a5265;background:#0a2533;color:#8bc6d4;font-weight:600;white-space:nowrap}
.panel{padding:23px;border-radius:17px}
.panel h2{font-size:17px;letter-spacing:-.2px;padding-bottom:15px;border-bottom:1px solid #244354;margin:0 0 17px}
.layout{grid-template-columns:minmax(0,1.45fr) minmax(290px,1fr);gap:18px}
.stack{gap:9px}
.item{padding:14px 15px;border-color:#244253;background:#0c202d;min-height:67px}
.item strong{font-size:14px}
.item small{font-size:12px}
.item button{flex-shrink:0}
#dashboard .panel:nth-child(2) .stack{grid-template-columns:1fr 1fr;display:grid}
#dashboard .panel:nth-child(2) button{min-height:66px;text-align:left;line-height:1.35;padding:13px}
.content{margin-top:18px;min-height:180px}
.log{font-size:12px;color:#b9d0da}
.log div{padding:10px 0}
.page:not(.hide){animation:appear .18s ease-out}
@keyframes appear{from{opacity:.6;transform:translateY(4px)}to{opacity:1;transform:none}}
.window{border-color:#2dbed7;box-shadow:0 25px 90px #000d}
.windowbar{background:#103c4e}
.windowbody{line-height:1.65}
footer{padding-top:14px;border-top:1px solid #1c3443}
@media(max-width:1050px){.app{grid-template-columns:205px minmax(0,1fr)}.side{padding:14px 8px}.brand{font-size:18px}.nav{padding:12px 9px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.layout{grid-template-columns:1fr}}
@media(max-width:690px){.app{display:block}.side{position:sticky;top:0;height:auto;z-index:3;display:flex;flex-direction:row;overflow-x:auto;align-items:center;gap:4px;padding:9px;background:#0b1c29;scrollbar-width:none}.side::-webkit-scrollbar{display:none}.brand{min-width:116px;margin:0;padding:6px 9px;border:0;font-size:15px;white-space:nowrap}.brand small{font-size:9px;letter-spacing:.5px}.nav{min-width:max-content;padding:11px 12px;font-size:12px;margin:0}.nav.active{box-shadow:inset 0 -3px 0 #39d9ed}.main{padding:20px 14px 24px}header{align-items:flex-start;gap:14px}header .actions{width:100%;justify-content:flex-start}header .actions button{flex:1}.cards{gap:9px;margin:18px 0}.card{padding:15px 12px;min-height:125px}.metric{font-size:26px;margin:10px 0}.panel{padding:16px}.layout{gap:12px}#dashboard .panel:nth-child(2) .stack{grid-template-columns:1fr 1fr}.item{padding:11px 10px}.item button{padding:9px}.window{left:4%;width:92vw;top:24%}}
@media(max-width:390px){#dashboard .panel:nth-child(2) .stack{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}header .actions .tag{width:100%;justify-content:center}}