@font-face{font-family:"TT Norms";src:url("/fonts/TTNorms-Regular.otf");font-weight:400;font-display:swap;}
@font-face{font-family:"TT Norms";src:url("/fonts/TTNorms-Medium.otf");font-weight:500;font-display:swap;}

:root{
  --bg:#FFFFFF; --fill:#F5F5F5; --line:#EAEAEA; --strong:#BCBCBC; --muted:#787774;
  --text:#0A0A0A; --teal:#2D4347; --lime:#D4FF32; --green:#1B7F4B; --red:#C0392B;
  --font:"TT Norms",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --ls:.14em; --pad:36px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{background:var(--bg);color:var(--text);font-family:var(--font);font-weight:400;font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
button,input{font-family:inherit;}

.label{font-size:10.5px;letter-spacing:var(--ls);text-transform:uppercase;color:var(--muted);}
.muted{color:var(--muted);}
.tab{font-variant-numeric:tabular-nums;}

/* top bar */
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px var(--pad);border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:5;}
.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;}
.brand img{height:15px;display:block;transform:translateY(1px);}
.brand span{font-size:10.5px;letter-spacing:var(--ls);text-transform:uppercase;}
.top form button,.linkbtn{background:none;border:0;font-size:10.5px;letter-spacing:var(--ls);text-transform:uppercase;color:var(--muted);cursor:pointer;text-decoration:none;}
.top form button:hover,.linkbtn:hover{color:var(--text);}
.top .right{display:flex;gap:22px;align-items:center;}

.wrap{max-width:1080px;margin:0 auto;padding:48px var(--pad) 72px;}
.banner{background:var(--fill);border-bottom:1px solid var(--line);padding:10px var(--pad);font-size:12px;display:flex;justify-content:space-between;gap:12px;}

h1{font-size:28px;font-weight:400;letter-spacing:-.01em;margin:6px 0 0;}
h2{font-size:15px;font-weight:500;margin:0 0 16px;}
.hello{margin-bottom:40px;}

/* hero */
.hero{display:grid;grid-template-columns:1.3fr 1fr 1fr;border:1px solid var(--line);}
.hero > div{padding:26px 28px;border-right:1px solid var(--line);}
.hero > div:last-child{border-right:0;}
.big{font-size:40px;font-weight:400;letter-spacing:-.02em;margin-top:10px;line-height:1.05;}
.mid{font-size:22px;margin-top:10px;}
.sub{font-size:12px;color:var(--muted);margin-top:8px;}

/* stats row */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-top:0;}
.stats > div{padding:18px 28px;border-right:1px solid var(--line);}
.stats > div:last-child{border-right:0;}
.stats .v{font-size:18px;margin-top:6px;}

.grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;margin-top:28px;}
.grid2 > *{min-width:0;}
.card{border:1px solid var(--line);padding:26px 28px;}
.section{margin-top:28px;}

/* level */
.lvl-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;}
.lvl-name{font-size:22px;}
.bar{height:6px;background:var(--fill);margin:18px 0 10px;position:relative;}
.bar i{position:absolute;left:0;top:0;bottom:0;background:var(--teal);}
.bar i.lime{background:var(--lime);}
.steps{display:flex;justify-content:space-between;margin-top:16px;}
.steps span{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--strong);}
.steps span.on{color:var(--text);}

/* share */
.share-row{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:var(--fill);padding:10px 12px;margin-top:8px;}
.share-row code{font-family:var(--font);font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.copy{background:var(--teal);color:#fff;border:0;padding:8px 14px;font-size:10.5px;letter-spacing:var(--ls);text-transform:uppercase;cursor:pointer;flex:none;}
.copy.done{background:var(--green);}

/* chart */
.chart{display:flex;align-items:flex-end;gap:12px;height:150px;margin-top:8px;}
.col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px;min-width:0;}
.col .b{width:100%;background:var(--fill);border-top:2px solid var(--teal);min-height:2px;}
.col.now .b{background:var(--teal);}
.col .t{font-size:10.5px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;}
.col .n{font-size:11px;color:var(--muted);white-space:nowrap;}

/* product bars */
.prod{margin-top:14px;}
.prod .row{display:flex;justify-content:space-between;gap:12px;font-size:13px;}
.prod .bar{margin:6px 0 0;height:4px;}

/* tables */
table{width:100%;border-collapse:collapse;font-size:13px;}
th{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:400;text-align:left;padding:0 12px 10px;border-bottom:1px solid var(--line);white-space:nowrap;}
td{padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
th:first-child,td:first-child{padding-left:0;}
th:last-child,td:last-child{padding-right:0;}
td.r,th.r{text-align:right;}
.items{color:var(--muted);font-size:12px;margin-top:2px;}
.chip{display:inline-block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);padding:2px 7px;color:var(--muted);white-space:nowrap;}
.chip.ok{color:var(--green);border-color:#CFE5D8;}
.chip.warn{color:var(--red);border-color:#F0D3CF;}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.empty{color:var(--muted);font-size:13px;padding:8px 0;}

/* admin */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);}
.kpis > div{padding:22px 24px;border-right:1px solid var(--line);}
.kpis > div:nth-child(4n){border-right:0;}
.kpis > div:nth-child(n+5){border-top:1px solid var(--line);}
.kpis .v{font-size:24px;margin-top:8px;}
.toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:28px;flex-wrap:wrap;}
.btn{background:var(--text);color:#fff;border:0;padding:11px 18px;font-size:10.5px;letter-spacing:var(--ls);text-transform:uppercase;cursor:pointer;}
.btn.ghost{background:#fff;color:var(--text);border:1px solid var(--strong);}
.name a{text-decoration:none;border-bottom:1px solid var(--line);}
.name a:hover{border-color:var(--text);}

/* auth */
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:var(--fill);}
.auth .box{background:#fff;border:1px solid var(--line);padding:36px;width:100%;max-width:380px;}
.auth img{height:18px;display:block;}
.auth .label{margin:8px 0 26px;display:block;}
.auth p{font-size:13px;color:var(--muted);margin-bottom:18px;}
.auth h1{font-size:18px;font-weight:500;margin:0 0 10px;}
.auth input{width:100%;border:1px solid var(--strong);padding:12px;font-size:14px;background:#fff;}
.auth input:focus{outline:none;border-color:var(--teal);}
.auth .btn{width:100%;margin-top:14px;background:var(--teal);padding:13px;}
.auth .err{color:var(--red);font-size:12px;margin-bottom:14px;}

.foot{margin-top:48px;font-size:11px;color:var(--strong);}

@media (max-width:820px){
  :root{--pad:16px;}
  .wrap{padding-top:28px;}
  .hello{margin-bottom:24px;}
  h1{font-size:22px;}
  .hero{grid-template-columns:1fr 1fr;}
  .hero > div:first-child{grid-column:1 / -1;border-right:0;border-bottom:1px solid var(--line);}
  .hero > div{padding:20px;}
  .big{font-size:34px;}
  .mid{font-size:19px;}
  .stats{grid-template-columns:1fr 1fr;}
  .stats > div{padding:16px 20px;}
  .stats > div:nth-child(2){border-right:0;}
  .stats > div:nth-child(n+3){border-top:1px solid var(--line);}
  .grid2{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:16px;}
  .steps span{letter-spacing:.04em;font-size:10px;}
  .card{padding:20px;}
  .section{margin-top:16px;}
  .kpis{grid-template-columns:1fr 1fr;}
  .kpis > div{padding:18px 16px;border-right:1px solid var(--line) !important;border-top:0 !important;}
  .kpis > div:nth-child(2n){border-right:0 !important;}
  .kpis > div:nth-child(n+3){border-top:1px solid var(--line) !important;}
  .kpis .v{font-size:20px;}
  .chart{gap:8px;}
  .hide-m{display:none;}
}