:root{
  --bg:#F3F4F1; --card:#fff; --ink:#16211D; --ink2:#45524C; --mute:#5E6B65; --line:#DDE1DA;
  --acc:#0E7C66; --acc-d:#0A5C4C; --acc-l:#DCEFE9; --amb:#B06A0B; --amb-l:#FFF1DA; --amb-t:#8A5A10;
  --red:#D1495B; --red-l:#FBE1E4; --red-t:#9E2436; --side:#16211D; --side2:#24322D;
  --hero:#16211D; --field:#fff; --line2:#E4E8E2; --bline:#C9CFC6; --gray:#E9ECE7; --feat-amb:#FFF7EA; --ph:#E6D6BE;
  color-scheme:light;
}
html[data-theme=dark]{
  --bg:#0E1412; --card:#17201C; --ink:#E6ECE9; --ink2:#B5C1BB; --mute:#8F9C96; --line:#2A3531;
  --acc:#11876F; --acc-d:#7ADBC1; --acc-l:#15342C; --amb:#C47A12; --amb-l:#3A2B13; --amb-t:#F3C47E;
  --red:#E0667A; --red-l:#3E1D23; --red-t:#F5A9B4; --side:#0A0F0D; --side2:#1B2622;
  --hero:#0A0F0D; --field:#111916; --line2:#26312C; --bline:#35423C; --gray:#26312C; --feat-amb:#2B2415; --ph:#2A2620;
  color-scheme:dark;
}
html[data-theme=dark] .btn.pri:hover{background:#0C6B58;color:#fff}
html[data-theme=dark] .btn.dark{background:#E6ECE9;border-color:#E6ECE9;color:#0E1412}
html[data-theme=dark] img:not([src$=".svg"]){filter:brightness(.95)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Onest,system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.5}
a{color:var(--acc)}a:hover{color:var(--acc-d)}
h1,h2,h3,.disp{font-family:Unbounded,sans-serif;font-weight:700;letter-spacing:-.01em;margin:0}
h1{font-size:28px;line-height:1.2}h2{font-size:20px}h3{font-size:17px}
img{max-width:100%}
.muted{color:var(--mute)}.small{font-size:14px}.tiny{font-size:12px}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.stack{display:flex;flex-direction:column;gap:16px}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.g-score{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.g-post{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start}
.card{background:var(--card);border-radius:16px;padding:22px}
.soft{background:var(--bg);border-radius:12px;padding:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:10px;
  border:1px solid var(--bline);background:var(--field);color:var(--ink);font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn:hover{border-color:var(--ink2);color:var(--ink)}
.btn.pri{background:var(--acc);border-color:var(--acc);color:#fff}.btn.pri:hover{background:var(--acc-d)}
.btn.amb{background:var(--amb);border-color:var(--amb);color:#fff}
.btn.dark{background:var(--hero);border-color:var(--hero);color:#fff}
.btn.big{min-height:56px;padding:0 28px;font-size:17px;border-radius:12px}
.btn.sm{min-height:40px;padding:0 14px;font-size:14px}
.btn[disabled]{opacity:.6;cursor:wait}
.pill{display:inline-block;padding:4px 12px;border-radius:999px;font-size:13px;font-weight:600;background:var(--acc-l);color:var(--acc-d)}
.pill.amb{background:var(--amb-l);color:var(--amb-t)}.pill.red{background:var(--red-l);color:var(--red-t)}
.pill.gray{background:var(--gray);color:var(--ink2)}
.tag{padding:3px 8px;border-radius:6px;font-size:12px;font-weight:700;flex-shrink:0}
.tag.muhim{background:var(--red-l);color:var(--red-t)}.tag.orta{background:var(--amb-l);color:var(--amb-t)}.tag.yaxshi{background:var(--acc-l);color:var(--acc-d)}
.flash{background:var(--acc-l);color:var(--acc-d);padding:14px 18px;border-radius:12px;font-weight:600}
.error{background:var(--red-l);color:var(--red-t);padding:14px 18px;border-radius:12px;font-weight:600}
label{font-weight:600;font-size:15px;display:block;margin-bottom:6px}
.hint{font-size:13px;color:var(--mute);font-weight:400;margin-top:4px}
input[type=text],input[type=tel],input[type=password],textarea,select{width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--line);
  border-radius:10px;font:inherit;background:var(--field);color:var(--ink)}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus,select:focus{outline:2px solid var(--acc);outline-offset:1px;border-color:var(--acc)}
input[type=file]{width:100%;padding:16px;border:1px dashed var(--bline);border-radius:12px;background:var(--bg);font:inherit}
.bar{height:6px;border-radius:3px;background:var(--line2)}.bar>i{display:block;height:6px;border-radius:3px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.logo b{font-family:Unbounded,sans-serif;font-size:19px}
.logo b span{color:var(--acc)}

/* --- ilova joylashuvi --- */
.shell{display:flex;min-height:100vh}
.side{width:250px;flex-shrink:0;background:var(--side);color:#D5DDD8;padding:22px 14px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh}
.side .logo{padding:0 10px 18px;color:#fff}.side .logo b span{color:#7FD1B9}
.side nav a{display:block;padding:13px 12px;border-radius:10px;color:#D5DDD8;text-decoration:none;font-size:17px}
.side nav a.on,.side nav a:hover{background:var(--side2);color:#fff}
.side .who{margin-top:auto;padding:14px;border-radius:12px;background:var(--side2);font-size:14px}
.side .who strong{color:#fff;display:block}
.main{flex:1;min-width:0;padding:32px 40px 48px;display:flex;flex-direction:column;gap:20px;max-width:1180px}
.top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.mtop,.mnav{display:none}

.post-row{display:flex;gap:14px;align-items:center;padding:14px;border:1px solid var(--line2);border-radius:12px;background:var(--card);text-decoration:none;color:inherit}
.post-row:hover{border-color:var(--acc)}
.thumb{width:72px;height:72px;border-radius:10px;background:var(--ph);flex-shrink:0;object-fit:cover}
.thumb.video{background:#CFE3DC}.thumb.story{background:#E9E3FA}.thumb.karusel{background:#F7D9A6}
.kind{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--acc)}
.done .kind{color:var(--mute)}
.spinner{width:22px;height:22px;border-radius:50%;border:3px solid var(--acc-l);border-top-color:var(--acc);animation:sp 1s linear infinite;flex-shrink:0}
@keyframes sp{to{transform:rotate(360deg)}}
.score{width:110px;height:110px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:Unbounded,sans-serif;font-size:30px;color:#fff;flex-shrink:0}
.preview{border:8px solid var(--hero);border-radius:28px;background:var(--card);overflow:hidden;max-width:340px}
.preview .ph{aspect-ratio:3/4;background:var(--ph);display:flex;align-items:center;justify-content:center;color:var(--ink2);font-size:14px;text-align:center;padding:20px}
.preview img{display:block;width:100%}
.cap{white-space:pre-wrap;font-size:14px;line-height:1.5;padding:12px}
table.t{width:100%;border-collapse:collapse;font-size:15px}
table.t th{text-align:left;font-size:13px;color:var(--mute);font-weight:600;padding:8px}
table.t td{border-top:1px solid var(--line2);padding:12px 8px;vertical-align:middle}

/* --- ochiq sahifalar --- */
.wrap{max-width:1280px;margin:0 auto;padding:0 32px}
.head{height:80px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.head nav{display:flex;gap:32px;font-weight:500}.head nav a{color:var(--ink);text-decoration:none}
.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center;padding:72px 0 56px}
.hero h1{font-size:54px;line-height:1.08;letter-spacing:-.02em}
.lead{font-size:20px;line-height:1.55;color:var(--ink2)}
.sec{padding:48px 0}.sec h2{font-size:34px;margin-bottom:24px}
.eyebrow{font-size:14px;font-weight:700;letter-spacing:.08em}
.feat{background:var(--card);border-radius:14px;padding:22px}.feat strong{display:block;font-size:17px;margin-bottom:6px}.feat span{color:var(--ink2);font-size:15px}
.feat.amb{background:var(--feat-amb)}
.soon{font-size:12px;font-weight:700;color:var(--amb);margin-left:6px}
.foot{padding:32px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--mute);font-size:14px;margin-top:32px}
.auth{max-width:440px;margin:48px auto;padding:0 16px}

@media (max-width:900px){
  .side{display:none}
  .shell{flex-direction:column}
  .mtop{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--bg);position:sticky;top:0;z-index:5;border-bottom:1px solid var(--line)}
  .mnav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;bottom:0;left:0;right:0;height:66px;background:var(--card);border-top:1px solid var(--line);z-index:5}
  .mnav a{display:flex;align-items:center;justify-content:center;text-align:center;font-size:13px;font-weight:600;color:var(--ink2);text-decoration:none}
  .mnav a.on{color:var(--acc)}
  .main{padding:18px 16px 96px;gap:16px}
  h1{font-size:22px}
  .g3,.g4,.g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g2,.g-score,.g-post{grid-template-columns:1fr}
  .card{padding:16px}
  .hero{grid-template-columns:1fr;padding:36px 0;gap:32px}
  .hero h1{font-size:34px}
  .lead{font-size:17px}
  .head nav{display:none}
  .wrap{padding:0 16px}
  .sec h2{font-size:26px}
  .post-row{align-items:flex-start}
  .hide-m{display:none}
  table.t .hide-m{display:none}
}
@media (max-width:520px){.g3.keep,.g4,.g5{grid-template-columns:1fr 1fr}.g3{grid-template-columns:1fr}}

/* --- tungi rejim tugmasi --- */
.theme-sw{display:inline-flex;border:1px solid var(--bline);border-radius:10px;overflow:hidden}
.theme-sw button{border:0;background:transparent;color:inherit;font:inherit;font-size:14px;padding:8px 12px;cursor:pointer;min-height:40px}
.theme-sw button.on{background:var(--acc);color:#fff}
.side .theme-sw{border-color:#35423C}
.side .mini{display:flex;gap:6px;flex-wrap:wrap;padding:10px 12px 0}
.side .mini a,.side .mini button{background:var(--side2);border:0;color:#D5DDD8;border-radius:8px;padding:6px 10px;font:inherit;font-size:13px;cursor:pointer;text-decoration:none}
.side .mini a.on{background:var(--acc);color:#fff}
.theme-sw a.on{background:var(--acc);color:#fff!important}

/* --- telefon ilovasi (PWA) --- */
@media (max-width:900px){
  .mnav{height:calc(66px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
  .main{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  .mtop{padding-top:calc(14px + env(safe-area-inset-top))}
}
html.standalone body{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
html.standalone input,html.standalone textarea,html.standalone .cap{-webkit-user-select:text;user-select:text}
.head>.row{flex-wrap:nowrap;gap:8px}
@media (max-width:520px){
  .head{height:64px}
  .head .btn{min-height:40px;padding:0 14px;font-size:14px}
  .head .theme-sw a,.head .theme-sw button{padding:6px 8px!important;min-height:36px}
}
