:root{--green:#13996b;--dark:#10271e;--ink:#17211d;--muted:#7b8781;--line:#e5eae7;--bg:#f4f7f5}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink)}
button,input{font:inherit}
.app-shell{display:flex;min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:linear-gradient(180deg,#183a2d,var(--dark));padding:28px 18px 18px;color:#fff;display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-size:20px;font-weight:700;padding:0 10px 28px}
.brand>span,.guest-brand>span{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:linear-gradient(135deg,#58dba4,var(--green));font-size:21px}
.brand b{color:#55d69e}
.sidebar nav{display:flex;flex-direction:column}
.sidebar nav small{font-size:9px;letter-spacing:.16em;color:#789487;margin:8px 12px}
.sidebar nav a{height:43px;display:flex;align-items:center;color:#adbbb4;text-decoration:none;padding:0 13px;border-radius:9px;font-size:12px;margin:1px 0}
.sidebar nav a:hover,.sidebar nav a.active{background:#ffffff12;color:#fff;box-shadow:inset 3px 0 var(--green)}
.user{margin-top:auto;border-top:1px solid #ffffff1a;padding-top:17px;display:flex;align-items:center;gap:9px}
.user i{width:34px;height:34px;border-radius:50%;background:#d9e9e1;color:#286047;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:800}
.user p{margin:0;flex:1}
.user strong,.user span{display:block}
.user strong{font-size:10px}
.user span{font-size:8px;color:#829b90}
.user button{background:none;border:0;color:#91a69d;font-size:18px}
.workspace{margin-left:250px;width:calc(100% - 250px)}
.workspace>header{height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 35px}
.workspace>header label{color:#87938d;font-size:20px}
.workspace>header input{border:0;outline:0;margin-left:7px;width:330px;font-size:11px}
.btn{height:40px;border:0;border-radius:9px;background:var(--green);color:#fff;padding:0 17px;font-weight:700;font-size:11px;cursor:pointer}
.content{padding:32px 35px}
.heading p{font-size:9px;letter-spacing:.12em;color:#94a09a;font-weight:800;margin:0 0 8px}
.heading h1{font-size:26px;margin:0}
.heading>span{display:block;color:var(--muted);font-size:11px;margin-top:7px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:27px}
.stats article{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px;display:flex;gap:12px}
.stats i{width:34px;height:34px;border-radius:9px;background:#e6f7ef;color:var(--green);display:grid;place-items:center;font-style:normal;font-weight:800}
.stats p{font-size:9px;color:var(--muted);margin:0}
.stats strong,.stats small{display:block}
.stats strong{font-size:19px;color:var(--ink);margin:5px 0}
.stats small{font-size:8px}
.panel{background:#fff;border:1px solid var(--line);border-radius:13px;margin-top:15px}
.welcome{padding:28px;display:flex;justify-content:space-between;align-items:center}
.welcome em{font-size:8px;letter-spacing:.13em;color:var(--green);font-style:normal;font-weight:800}
.welcome h2{font-size:18px;margin:7px 0}
.welcome p{font-size:11px;color:var(--muted);max-width:650px;line-height:1.7}
.welcome>span{width:58px;height:58px;border-radius:17px;background:#e7f7ef;color:var(--green);display:grid;place-items:center;font-size:25px}
.guest-body{background:#f2f6f3}
.guest-card{width:min(820px,calc(100% - 30px));margin:35px auto;background:#fff;border:1px solid var(--line);border-radius:18px;padding:35px;box-shadow:0 20px 60px #14251d12}
.guest-brand{display:flex;align-items:center;gap:10px}
.guest-brand b,.guest-brand small{display:block}
.guest-brand b{font-size:17px}
.guest-brand small{font-size:9px;color:var(--muted);margin-top:2px}
.guest-card h1{font-size:25px;margin:27px 0 7px}
.guest-card>p{font-size:11px;color:var(--muted);line-height:1.6}
.requirements{display:flex;gap:7px;flex-wrap:wrap;margin:18px 0}
.requirements div{font-size:9px;padding:7px 9px;border-radius:7px;background:#f1f4f2;color:#69766f}
.requirements .ok span{color:var(--green)}
.requirements .bad{background:#fff0f0;color:#b64b4e}
.alert,.success{padding:11px 13px;border-radius:8px;font-size:10px;margin:14px 0}
.alert{background:#fff0f0;border:1px solid #f4d5d7;color:#b2494d}
.success{background:#eaf8f1;border:1px solid #caeadb;color:#187d5a}
.install-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}
.install-form h2{grid-column:1/-1;font-size:11px;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid var(--line);padding:13px 0 9px;margin:5px 0}
.install-form label,.login-form label{display:flex;flex-direction:column;gap:6px;font-size:9px;font-weight:700;color:#5c6862}
.install-form .wide{grid-column:1/-1}
.install-form input,.login-form input{height:39px;border:1px solid #dfe5e1;border-radius:8px;padding:0 11px;outline:0;font-size:11px}
.install-form input:focus,.login-form input:focus{border-color:var(--green);box-shadow:0 0 0 3px #13996b18}
.login-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}
.login-copy{padding:55px;background:linear-gradient(145deg,#173c2d,#0d2119);color:#fff;display:flex;flex-direction:column;justify-content:space-between}
.inverse small{color:#91aa9f}
.login-copy em{font-size:9px;color:#5cdda5;letter-spacing:.15em;font-style:normal;font-weight:800}
.login-copy h1{font-size:42px;line-height:1.12;max-width:520px;margin:15px 0}
.login-copy p{font-size:13px;line-height:1.7;color:#afc1b9;max-width:490px}
.login-copy>small{color:#738d81;font-size:9px}
.login-form{display:grid;place-items:center;background:#fff}
.login-form form{width:min(360px,calc(100% - 35px));display:flex;flex-direction:column;gap:15px}
.login-form form>p{font-size:9px;color:var(--green);letter-spacing:.14em;font-weight:800;margin:0}
.login-form h2{font-size:27px;margin:0}
.login-form form>span{font-size:11px;color:var(--muted);margin-bottom:9px}
.login-form .btn{width:100%;margin-top:4px}
@media(max-width:900px){.stats{grid-template-columns:1fr 1fr}
.login-shell{grid-template-columns:1fr}
.login-copy{display:none}
}
@media(max-width:720px){.sidebar{display:none}
.workspace{margin:0;width:100%}
.workspace>header{padding:0 17px}
.workspace>header label{display:none}
.content{padding:24px 16px}
.stats{grid-template-columns:1fr}
.install-form{grid-template-columns:1fr}
.install-form .wide,.install-form h2{grid-column:auto}
.guest-card{padding:23px}
.welcome>span{display:none}
}
.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap}
.header-btn{height:35px}
.global-flash{margin:18px 35px 0}
.module-head{display:flex;align-items:end;justify-content:space-between;gap:18px}
.module-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(310px,.8fr);gap:15px;align-items:start}
.list-panel,.form-panel{overflow:hidden}
.toolbar{display:flex;align-items:center;gap:9px;padding:14px;border-bottom:1px solid var(--line)}
.toolbar label{height:39px;flex:1;display:flex;align-items:center;gap:7px;padding:0 12px;border:1px solid var(--line);border-radius:9px;color:var(--muted)}
.toolbar input{width:100%;border:0;outline:0;font-size:10px}
.toolbar>a,.panel-title>a{font-size:9px;color:var(--green);font-weight:700;text-decoration:none}
.btn-secondary{background:#edf2ef;color:#4e6057}
.table-wrap{overflow:auto}
.data-table{width:100%;border-collapse:collapse;min-width:620px}
.data-table th{text-align:left;background:#fafcfb;color:#89958f;font-size:8px;letter-spacing:.08em;text-transform:uppercase;padding:11px 14px;border-bottom:1px solid var(--line)}
.data-table td{padding:13px 14px;border-bottom:1px solid #edf1ee;font-size:10px;color:#4e5c55;vertical-align:middle}
.data-table td strong,.data-table td small{display:block}
.data-table td strong{color:var(--ink);font-size:10px}
.data-table td small{color:#97a09c;font-size:8px;margin-top:4px}
.data-table .empty-state{text-align:center;padding:42px 15px;color:var(--muted)}
.list-panel>footer{padding:12px 14px;color:var(--muted);font-size:8px}
.actions{display:flex;justify-content:flex-end;gap:5px}
.actions form{margin:0}
.icon-action{width:29px;height:29px;border:1px solid var(--line);border-radius:7px;background:#fff;color:#66736c;display:grid;place-items:center;text-decoration:none;cursor:pointer}
.icon-action.danger{color:#b6575b}
.stock{font-weight:800;color:var(--green)}
.stock.low{color:#bd5a5f;background:#fff0f0;border-radius:6px;padding:5px 7px}
.panel-title{display:flex;align-items:center;justify-content:space-between;padding:17px 18px;border-bottom:1px solid var(--line)}
.panel-title small{font-size:8px;letter-spacing:.1em;color:var(--green);font-weight:800}
.panel-title h2{font-size:15px;margin:4px 0 0}
.form-grid{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-grid label{display:flex;flex-direction:column;gap:6px;color:#617068;font-size:8px;font-weight:700}
.form-grid input,.form-grid select{width:100%;height:38px;border:1px solid #dfe5e1;border-radius:8px;padding:0 10px;background:#fff;outline:0;font-size:10px;color:var(--ink)}
.form-grid input:focus,.form-grid select:focus{border-color:var(--green);box-shadow:0 0 0 3px #13996b18}
.form-grid .wide{grid-column:1/-1}
.form-buttons{display:flex;justify-content:flex-end;gap:8px;padding-top:5px}
.update-card{padding:22px;display:flex;align-items:center;gap:17px}
.update-card>div:nth-child(2){flex:1}
.update-card h2{margin:0 0 7px;font-size:17px}
.update-card p{font-size:10px;color:var(--muted);margin:0}
.version-badge{width:58px;height:58px;border-radius:15px;background:#e6f7ef;color:var(--green);display:grid;place-items:center;font-size:16px;font-weight:800}
.status-ok{color:var(--green);font-size:10px;font-weight:800}
.update-card .success,.update-card .alert{margin-bottom:0}
@media(max-width:1150px){.module-grid{grid-template-columns:1fr}.form-panel{order:-1}}
@media(max-width:720px){.module-head{align-items:start}.module-head>.btn{height:36px}.global-flash{margin:15px 16px 0}.toolbar{flex-wrap:wrap}.toolbar label{flex-basis:100%}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.update-card{align-items:flex-start;flex-wrap:wrap}.update-card form{width:100%}.update-card form .btn{width:100%}}
