:root{--bg:#080d1e;--nav:#030817;--surface:#10182b;--panel:#050a1b;--panel2:#0a1022;--line:#263148;--line2:#1a2439;--text:#f5f7fb;--muted:#a8b2c7;--faint:#748099;--accent:#ff303c;--accent2:#e32735;--green:#3bd58a;--yellow:#f0ca52;--blue:#62a6ff;--danger:#ff5c69;--font:"Iosevka","JetBrains Mono","Cascadia Code","SFMono-Regular",Consolas,"Liberation Mono",monospace}
*{box-sizing:border-box}html,body{height:100%;margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px}button,input,textarea{font:inherit}button{color:inherit}a{color:inherit;text-decoration:none}.app{min-height:100%;display:grid;grid-template-columns:242px 1fr}.sidebar{position:fixed;left:0;top:0;bottom:0;width:242px;background:var(--nav);border-right:1px solid var(--line2);display:flex;flex-direction:column;z-index:4}.brand{height:38px;border-bottom:1px solid var(--line2);display:flex;align-items:center;padding:0 12px;font-weight:700}.brand b{letter-spacing:.04em}.workspace-switch{height:48px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:9px;padding:0 10px;color:#e8ecf5}.nav{padding:10px 0}.nav-section-label{padding:14px 8px 8px;color:var(--faint);font-size:12px}.nav-btn{width:100%;height:38px;border:0;background:transparent;display:flex;align-items:center;gap:10px;padding:0 10px;color:#f4f5fa;cursor:pointer;text-align:left}.nav-btn:hover{background:#0c1326}.nav-btn.active{background:var(--accent);color:white}.nav-btn img,.icon{width:16px;height:16px;filter:brightness(0) invert(1);opacity:.86}.nav-spacer{flex:1}.user-box{border-top:1px solid var(--line2);padding:8px}.user-box .nav-btn{padding-left:0}.main{grid-column:2;min-width:0}.topbar{position:sticky;top:0;z-index:3;height:38px;border-bottom:1px solid var(--line);background:#050a1a;display:flex;align-items:center}.crumbs{display:flex;align-items:center;gap:8px;padding-left:24px;color:var(--muted);font-size:13px}.top-actions{margin-left:auto;height:100%;display:flex}.top-action{height:100%;padding:0 16px;border:0;border-left:1px solid var(--line);background:#050a1a;cursor:pointer}.top-action:hover{background:#10182b}.content{padding:32px max(28px,calc((100vw - 242px - 1060px)/2));max-width:1280px}.welcome h1{margin:0 0 7px;font-size:26px;letter-spacing:-.03em}.welcome p{margin:0;color:var(--muted)}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:30px 0 26px}.metric{border:1px solid var(--line);background:var(--panel);padding:18px 16px;min-height:114px}.metric .label{color:#f6f7fb}.metric .value{font-size:34px;font-weight:800;margin-top:5px}.metric .sub{color:var(--muted);margin-top:3px;font-size:12px}.metric .sub.good{color:var(--green)}.section-bar{display:flex;align-items:center;gap:9px;margin:10px 0 10px}.tabs{display:flex}.tab{height:34px;padding:0 14px;border:1px solid transparent;background:transparent;color:var(--muted);cursor:pointer}.tab.active{border-color:var(--line);background:var(--panel);color:white}.section-actions{margin-left:auto;display:flex;gap:8px}.btn{height:34px;border:1px solid var(--line);background:var(--panel);padding:0 12px;cursor:pointer}.btn:hover{border-color:#43506d;background:#0e1730}.btn.primary{background:var(--accent);border-color:#ff4954;color:#fff}.btn.primary:hover{background:var(--accent2)}.btn:disabled{opacity:.45;cursor:not-allowed}.panel{border:1px solid var(--line);background:var(--panel);margin-bottom:16px}.panel-head{padding:18px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:12px}.panel-head h2{font-size:18px;margin:0}.panel-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.panel-body{padding:18px}.project-list{border:1px solid var(--line);background:var(--panel)}.project-row{display:grid;grid-template-columns:minmax(240px,1.5fr) 160px 120px 160px 30px;gap:14px;align-items:center;min-height:58px;padding:0 14px;border-bottom:1px solid var(--line2);cursor:pointer}.project-row:hover{background:#0b1328}.project-row:last-child{border-bottom:0}.project-title{font-weight:700}.project-desc{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status{display:inline-flex;width:max-content;border:1px solid #7e6a24;color:var(--yellow);padding:2px 8px;font-size:11px}.status.active{border-color:#227447;color:var(--green)}.status.error{border-color:#7e2730;color:var(--danger)}.empty{padding:46px;text-align:center;color:var(--muted)}.modal-backdrop{position:fixed;inset:0;background:rgba(1,4,13,.72);z-index:20;display:grid;place-items:center;padding:20px}.modal{width:min(720px,96vw);max-height:92vh;border:1px solid #35415c;background:#0c1428;box-shadow:0 16px 60px #000;display:flex;flex-direction:column}.modal-title{height:44px;background:#050a19;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 14px;font-weight:700}.modal-title button{margin-left:auto;border:0;background:transparent;cursor:pointer}.modal-content{padding:20px;overflow:auto}.modal-footer{border-top:1px solid var(--line);padding:12px;display:flex;justify-content:flex-end;gap:8px;background:#080f21}.steps{display:flex;margin-bottom:20px;border-bottom:1px solid var(--line)}.step{padding:10px 12px;color:var(--faint)}.step.active{color:white;border-bottom:2px solid var(--accent)}.field{display:grid;gap:7px;margin-bottom:16px}.field label{color:#dfe4ef;font-size:12px}.field small{color:var(--faint)}.input,.textarea{width:100%;border:1px solid #35405a;background:#050b1b;color:white;padding:9px 10px;outline:none}.input:focus,.textarea:focus{border-color:#687792}.textarea{min-height:110px;resize:vertical}.inline{display:flex;gap:10px;align-items:center}.port-state{font-size:12px;color:var(--muted)}.port-state.ok{color:var(--green)}.port-state.bad{color:var(--danger)}.review{display:grid;grid-template-columns:150px 1fr;border:1px solid var(--line)}.review div{padding:9px 10px;border-bottom:1px solid var(--line2)}.review div:nth-child(odd){color:var(--muted);background:#070d1d}.project-view{display:grid;grid-template-columns:180px 1fr;min-height:620px;border:1px solid var(--line);background:var(--panel)}.project-subnav{border-right:1px solid var(--line);background:#050a19;padding:8px}.project-subnav button{width:100%;border:0;background:transparent;color:var(--muted);text-align:left;padding:10px;cursor:pointer}.project-subnav button:hover{background:#0d162a;color:white}.project-subnav button.active{background:#111b32;color:white;border-left:2px solid var(--accent)}.project-content{padding:20px;min-width:0}.codebox{background:#020611;border:1px solid var(--line);padding:12px;color:#c4cde0;white-space:pre-wrap;overflow:auto;max-height:300px}.logbox{background:#020611;border:1px solid var(--line);padding:12px;color:#bac6dc;white-space:pre-wrap;overflow:auto;height:360px}.snapshot-row,.update-row{display:grid;grid-template-columns:1fr 100px 170px 110px;gap:10px;padding:9px 10px;border-bottom:1px solid var(--line2);align-items:center}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.notice{padding:10px 12px;border:1px solid var(--line);background:#070e20;color:var(--muted);margin-bottom:12px}.notice.error{border-color:#6d2c34;color:#ff929b}.notice.success{border-color:#235d42;color:#6ce6a5}.hidden{display:none!important}@media(max-width:950px){.metric-grid{grid-template-columns:repeat(2,1fr)}.project-row{grid-template-columns:1fr 120px}.project-row>*:nth-child(n+3){display:none}.admin-grid{grid-template-columns:1fr}}@media(max-width:700px){.app{grid-template-columns:58px 1fr}.sidebar{width:58px}.brand b,.workspace-switch span,.nav-btn span,.user-box span,.nav-section-label{display:none}.nav-btn{justify-content:center}.main{grid-column:2}.content{padding:24px 14px}.metric-grid{grid-template-columns:1fr}.project-view{grid-template-columns:1fr}.project-subnav{border-right:0;border-bottom:1px solid var(--line);display:flex;overflow:auto}.project-subnav button{width:auto;white-space:nowrap}}

/* Woonstel 0.0.3 UI control rules */
html,body,.app,.sidebar,.main,.topbar,.content,.panel,.panel-head,.panel-body,.nav,.nav-btn,.btn,.tab,.metric,.project-row,.project-subnav,.project-subnav button,.modal,.modal-title,.modal-footer,.notice,.status,.option-group,.option-button,.user-row,.upload-surface{border-radius:0!important}
body,button,.nav,.sidebar,.topbar,.panel,.metric,.project-row,.project-subnav,.status,.option-button,.modal-title,.modal-footer,.section-bar,.settings-row,.user-row,.upload-surface{user-select:none;-webkit-user-select:none}
input,textarea,pre,.codebox,.logbox,.selectable,.review>div:nth-child(even),.update-row>div:first-child,.snapshot-row>div:first-child{user-select:text;-webkit-user-select:text}
button,input,textarea{appearance:none;-webkit-appearance:none;border-radius:0}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}
.input,.textarea{background:#050b1b!important;color:#fff!important;border:1px solid #35405a!important;box-shadow:none!important}
.input:focus,.textarea:focus{outline:none!important;border-color:#687792!important;background:#071023!important}
.input:disabled{color:#8c95aa!important;background:#070c18!important;border-color:#28324a!important}
.btn,.top-action,.nav-btn,.tab,.option-button,.title-button{border-radius:0!important;box-shadow:none}
.btn:hover,.top-action:hover,.nav-btn:hover,.tab:hover,.option-button:hover,.title-button:hover{box-shadow:inset 1px 1px 0 #667086,inset -1px -1px 0 #02050d}
.btn:active,.top-action:active,.nav-btn:active,.tab:active,.option-button:active,.title-button:active,.option-button.active{box-shadow:inset 1px 1px 0 #02050d,inset -1px -1px 0 #69748b}
.btn.danger{background:#311018;border-color:#7a2632;color:#ffadb4}.btn.danger:hover{background:#43151f;border-color:#9e3441}.btn.compact{height:28px;padding:0 9px;font-size:12px}
.title-button{margin-left:auto;width:30px;height:28px;border:1px solid transparent;background:transparent;color:#fff;cursor:pointer;font:inherit}
.option-group{display:flex;gap:4px;align-items:center}.option-button{height:30px;padding:0 12px;border:1px solid #35405a;background:#080f21;color:#b9c2d6;cursor:pointer}.option-button:hover{background:#0f1930;color:#fff}.option-button.active{background:#1c263c;color:#fff;border-color:#56627b}
.settings-row{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid var(--line2);margin-top:18px;padding-top:16px}
.user-row{display:grid;grid-template-columns:minmax(150px,1.3fr) 80px 110px 86px;gap:10px;align-items:center;min-height:48px;border-bottom:1px solid var(--line2);padding:7px 0}.user-row:last-child{border-bottom:0}.section-rule{border:0;border-top:1px solid var(--line);margin:18px 0}
.admin-user-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.password-admin-field{margin-top:16px}.user-manager{width:min(660px,96vw)}.confirm-modal{width:min(520px,94vw)}
.upload-surface{border:1px dashed #43506d;padding:36px;text-align:center;cursor:pointer;background:#070d1c}.upload-surface:hover{background:#0b1428;border-color:#6b7894}
.toast-stack{position:fixed;right:14px;bottom:14px;z-index:1000;display:grid;gap:6px;max-width:min(430px,calc(100vw - 28px));pointer-events:none}.woonstel-toast{background:#05070d;border:1px solid #4a5263;color:#fff;padding:10px 12px;box-shadow:4px 4px 0 rgba(0,0,0,.35);user-select:text}.woonstel-toast.success{border-color:#2d7550}.woonstel-toast.error{border-color:#9a3944}.woonstel-toast.warning{border-color:#8a702f}
.woonstel-tooltip{position:fixed;z-index:2000;max-width:360px;background:#000;border:1px solid #666;color:#fff;padding:6px 8px;font-size:12px;line-height:1.35;pointer-events:none;border-radius:0!important;box-shadow:none!important;white-space:normal;user-select:none}

/* protected /dev surface */
.dev-page{padding:28px 28px 58px;background:var(--bg);color:var(--text)}.dev-main{max-width:900px;margin:auto}.dev-statusbar{position:fixed;left:0;right:0;bottom:0;height:30px;display:flex;align-items:center;gap:14px;padding:0 12px;background:#030712;border-top:1px solid #2c354b;color:#adb7cb;font-size:12px;z-index:300}.dev-statusbar .dev-spacer{flex:1}.dev-status{display:inline-flex;align-items:center;gap:7px}.dev-status-dot{width:7px;height:7px;background:#697184;border:1px solid #8e96a7}.dev-status.online .dev-status-dot{background:#31c87d;border-color:#5de5a4}.dev-status.error .dev-status-dot{background:#ff4e5a;border-color:#ff7c85}.dev-version{color:#fff;user-select:text}