/* Xira rasm faqat Bosh sahifa (body.has-bg). Qolgan sahifalar och kulrang. */
.home-bg img{width:100%;height:100%;object-fit:cover;object-position:center;filter:blur(8px) saturate(1.1);transform:scale(1.08)}
.home-bg .ombor-bg{position:absolute;inset:0;object-position:22% 40%;opacity:0;pointer-events:none}
.home-bg::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.16)}
body.has-bg:not(.is-home) .home-bg::after{background:rgba(255,255,255,.26)}
body.has-bg,body.has-bg .shell{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
/* Bosh sahifa — 4 katta kvadrat plitka */
.home-hello{font-size:15px;font-weight:600;margin:2px 4px 14px}
.home-hello span{color:var(--muted);font-weight:400}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tile{border-radius:22px;padding:18px 14px;min-height:164px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;text-decoration:none;border:1px solid transparent;overflow:hidden;opacity:1}
.tile svg{width:40px;height:40px}
.tile b{font-size:15px;letter-spacing:.02em}
.tile small{font-size:11px;line-height:1.4}
.tile-dark{background:var(--ink);color:#fff;box-shadow:0 12px 30px rgba(17,24,39,.18)}
.tile-dark small{color:rgba(255,255,255,.9);font-weight:500}
.tile-light{background:rgba(255,255,255,.62);color:var(--ink);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.tile-light small{color:#334155;font-weight:500}
.tile:active{transform:scale(.98)}
/* Plitkalar birin-ketin (sahifaga birinchi kirganda — home.js .tiles-rise) */
@keyframes tileRise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.tiles-rise .tile.rise{animation:tileRise .48s cubic-bezier(.22,.8,.22,1) both}
.tiles-rise .rise-1{animation-delay:.04s}
.tiles-rise .rise-2{animation-delay:.1s}
.tiles-rise .rise-3{animation-delay:.16s}
.tiles-rise .rise-4{animation-delay:.22s}
.tiles-rise .rise-5{animation-delay:.28s}
.tiles-rise .rise-6{animation-delay:.34s}
@media (prefers-reduced-motion:reduce){.tiles-rise .tile.rise{animation:none;opacity:1;transform:none}}
.tile:active{transition-duration:.12s}
.tile-locked{opacity:.6;cursor:default}
.home-note{margin:14px 4px 0;font-size:12px;color:var(--muted)}

/* Mobil: wrapper layoutga aralashmasin — plitkalar avvalgidek 2 ustun, vertikal markazda. */
.tiles-wrap{display:contents}
body.is-home #view{display:flex;flex-direction:column;padding-top:0}
body.is-home .tiles{margin-block:auto}
@media (min-width: 768px) {
  /* Hub: max-w-5xl mx-auto grid-cols-2 md:grid-cols-3 gap-6, ekran markazida */
  .tiles-wrap,.tiles-wrap.max-w-5xl{
    display:block;max-width:64rem;width:100%;margin-left:auto;margin-right:auto}
  .tiles,.tiles.md\:grid-cols-3{
    grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-block:0;width:100%}
  body.is-home .tiles{margin-block:0}
  body.is-home #view{
    display:flex!important;flex-direction:column;align-items:center;justify-content:center;
    max-width:none;width:100%;margin:0;
    min-height:0!important;height:auto!important;max-height:none!important;flex:1 1 auto!important;
    padding-top:24px;padding-bottom:40px}
}