:root{
  --bg:#f4f6f4;
  --card:#ffffff;
  --soft:#e9eeeb;
  --ink:#111315;
  --muted:#657078;
  --line:#d9e0dc;
  --emerald:#0f5c4b;
  --emerald-2:#1d7a63;
  --emerald-soft:#dcebe6;
  --danger:#cf4b4b;
  --danger-soft:#f8e7e7;
  --warning:#d99432;
  --warning-soft:#fbf0dc;
  --shadow:0 18px 55px rgba(24,36,31,.10);
  --radius:26px;
  --radius-sm:18px;
  --nav-h:82px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
body{overscroll-behavior-y:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.app-shell{min-height:100vh;max-width:860px;margin:0 auto;padding:18px 18px calc(var(--nav-h) + 34px)}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.logo{width:44px;height:44px;border-radius:16px;background:var(--ink);display:grid;place-items:center;color:#fff;font-weight:900;letter-spacing:-1px;box-shadow:var(--shadow)}
.brand h1{font-size:18px;margin:0;letter-spacing:.02em}
.brand p{margin:2px 0 0;color:var(--muted);font-size:13px}
.role-switch{display:flex;background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px;gap:4px}
.role-switch button{border:0;background:transparent;padding:9px 12px;border-radius:999px;color:var(--muted);font-weight:800;font-size:12px}
.role-switch button.active{background:var(--ink);color:#fff}
.kicker{font-size:12px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.hero-title{font-size:36px;line-height:1.03;letter-spacing:-.04em;margin:0 0 10px;font-weight:900}
.sub{color:var(--muted);font-size:15px;line-height:1.5}
.grid{display:grid;gap:14px}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:0 10px 34px rgba(24,36,31,.05)}
.card.dark{background:var(--ink);color:white;border-color:#2b3033;box-shadow:var(--shadow)}
.card.emerald{background:linear-gradient(145deg,#0f5c4b,#154b41);color:#fff;border-color:transparent;box-shadow:0 18px 50px rgba(15,92,75,.24)}
.card.soft{background:linear-gradient(145deg,#f8faf9,#eaf0ed)}
.card.warn{background:var(--warning-soft);border-color:#f0d7ae}
.card.danger{background:var(--danger-soft);border-color:#efc7c7}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.row.start{justify-content:flex-start}.row.wrap{flex-wrap:wrap}
.value{font-size:34px;line-height:1;font-weight:950;letter-spacing:-.045em}
.value.sm{font-size:26px}.value.xs{font-size:21px}
.metric-label{font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.dark .metric-label,.emerald .metric-label{color:#aeb8bd}
.money{font-variant-numeric:tabular-nums}
.progress{height:10px;background:#e3e8e5;border-radius:999px;overflow:hidden;margin:14px 0 7px}
.progress>span{height:100%;display:block;background:var(--emerald);border-radius:999px}
.dark .progress{background:#32383b}.dark .progress>span{background:#dfe9e6}
.badge{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border-radius:999px;font-size:12px;font-weight:850;background:var(--soft);color:#455158}
.badge.green{background:var(--emerald-soft);color:var(--emerald)}
.badge.red{background:var(--danger-soft);color:#9f3737}
.badge.yellow{background:var(--warning-soft);color:#8d5a12}
.btn{border:0;border-radius:16px;padding:14px 16px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px}
.btn.primary{background:var(--emerald);color:#fff}.btn.dark{background:var(--ink);color:#fff}.btn.light{background:#fff;color:var(--ink);border:1px solid var(--line)}.btn.ghost{background:var(--soft);color:var(--ink)}.btn.danger{background:var(--danger);color:#fff}
.btn.wide{width:100%}
.section{margin-top:20px}.section-title{font-weight:950;font-size:22px;letter-spacing:-.03em;margin:0 0 12px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.small-link{background:none;border:0;color:var(--emerald);font-weight:900;padding:4px}
.list{display:grid;gap:10px}.list-item{background:#fff;border:1px solid var(--line);border-radius:20px;padding:15px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.list-item .main{min-width:0}.list-item h3{font-size:15px;margin:0 0 4px}.list-item p{font-size:13px;color:var(--muted);margin:0;white-space:normal}.iconbox{width:44px;height:44px;border-radius:14px;background:var(--soft);display:grid;place-items:center;font-size:20px;flex:0 0 auto}.iconbox.dark{background:#202427;color:white}.iconbox.green{background:var(--emerald-soft);color:var(--emerald)}
.bottom-nav{position:fixed;z-index:40;left:50%;bottom:max(12px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 28px),820px);background:#111315;border:1px solid #2a3033;border-radius:30px;padding:8px;display:grid;grid-template-columns:repeat(5,1fr);box-shadow:0 18px 55px rgba(0,0,0,.28)}
.nav-btn{border:0;background:transparent;color:#aeb7bc;border-radius:22px;padding:10px 4px 8px;display:grid;place-items:center;gap:4px;font-size:11px;font-weight:850}.nav-btn .ico{font-size:22px;line-height:1}.nav-btn.active{background:#e5eef2;color:#111315}.nav-btn span{white-space:nowrap}
.form-section{margin-top:16px}.form-title{font-size:13px;font-weight:950;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}.field{display:grid;gap:7px;margin-bottom:12px}.field label{font-size:13px;font-weight:850;color:#4e5960}.input{width:100%;border:1px solid var(--line);background:#fff;border-radius:16px;padding:14px 15px;outline:none;transition:.15s}.input:focus{border-color:var(--emerald);box-shadow:0 0 0 3px rgba(15,92,75,.10)}
textarea.input{min-height:94px;resize:vertical}
.segmented{display:flex;gap:8px;flex-wrap:wrap}.chip{border:1px solid var(--line);background:#fff;padding:10px 12px;border-radius:999px;font-weight:850;color:#526067}.chip.active{background:var(--emerald);color:#fff;border-color:var(--emerald)}
.stepper{display:flex;gap:6px;margin:10px 0 18px}.stepper span{height:5px;flex:1;border-radius:999px;background:#dce2df}.stepper span.active{background:var(--emerald)}
.modal-backdrop{position:fixed;z-index:80;inset:0;background:rgba(17,19,21,.46);display:flex;align-items:flex-end;justify-content:center;padding:12px}.modal{width:min(100%,820px);max-height:88vh;overflow:auto;background:var(--bg);border-radius:30px;padding:18px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.modal-head h2{margin:0;font-size:24px}.x{width:42px;height:42px;border-radius:14px;border:1px solid var(--line);background:#fff;font-size:20px}
.divider{height:1px;background:var(--line);margin:16px 0}
.alert{border-radius:20px;padding:14px 15px;display:flex;gap:12px;align-items:flex-start}.alert.warn{background:var(--warning-soft)}.alert.danger{background:var(--danger-soft)}.alert.green{background:var(--emerald-soft)}.alert strong{display:block;margin-bottom:3px}.alert p{margin:0;color:#566168;font-size:13px;line-height:1.45}
.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:12px}.dow{font-size:11px;color:var(--muted);font-weight:900;text-align:center;padding:6px}.day{min-height:54px;border-radius:16px;background:#fff;border:1px solid transparent;display:grid;place-items:center;font-weight:850;position:relative}.day.has{border-color:var(--line);background:#eef3f0}.day.active{border:2px solid var(--emerald)}.day .dot{position:absolute;width:5px;height:5px;background:var(--emerald);border-radius:50%;bottom:7px}
.statline{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.statline:last-child{border-bottom:0}.statline span{color:var(--muted)}.statline strong{font-variant-numeric:tabular-nums}
.table-card{overflow:hidden;padding:0}.table-row{display:grid;grid-template-columns:1.3fr .8fr .8fr;gap:10px;padding:14px 16px;border-top:1px solid var(--line);align-items:center}.table-row:first-child{border-top:0}.table-row.head{background:#f0f3f1;font-size:11px;font-weight:950;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.toast{position:fixed;z-index:120;left:50%;bottom:112px;transform:translateX(-50%);background:#111315;color:#fff;padding:12px 16px;border-radius:16px;box-shadow:var(--shadow);font-weight:800;max-width:calc(100% - 32px);animation:toastin .18s ease}
@keyframes toastin{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
.empty{padding:34px 18px;text-align:center;color:var(--muted)}
@media (max-width:650px){.app-shell{padding:14px 14px calc(var(--nav-h) + 30px)}.hero-title{font-size:31px}.grid.two,.grid.three{grid-template-columns:1fr}.role-switch{display:none}.card{padding:17px}.value{font-size:31px}.bottom-nav{width:calc(100% - 20px)}.nav-btn{font-size:10px}.nav-btn .ico{font-size:20px}.table-row{grid-template-columns:1.2fr .8fr}.table-row>div:nth-child(3){display:none}}