:root{
  --bg:#fbfaf8; --soft:#f2f1ed; --soft2:#e9e7e1; --ink:#0f0f0f; --ink2:#2c2c2a; --mute:#75736d; --line:#e6e4de;
  --red:#e10600; --red2:#b30500; --ok:#16864a;
  --head:"Noto Kufi Arabic","Vazirmatn",sans-serif; --ui:"Vazirmatn",system-ui,sans-serif;
  --w:1180px; --g:20px; --gap:clamp(64px,9vw,112px); --r:10px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--ui);font-size:16px;line-height:1.9;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--g)}
.dia{display:inline-block;width:.46em;height:.46em;background:var(--red);transform:rotate(45deg);vertical-align:.14em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.progress{position:fixed;top:0;right:0;height:3px;background:var(--red);width:0;z-index:70;transition:width .1s linear}

/* ---------- header ---------- */
.hd{position:sticky;top:0;z-index:50;background:rgba(251,250,248,.92);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent;transition:border-color .2s}
.hd.stuck{border-bottom-color:var(--line)}
.hd__in{display:flex;align-items:center;gap:28px;height:72px}
.hd__logo img{height:38px;width:auto}
.hd__nav{display:flex;gap:4px;flex:1}
.hd__nav a{padding:8px 12px;border-radius:999px;font-size:15px;font-weight:600;color:var(--ink2);transition:background .15s,color .15s}
.hd__nav a:hover{background:var(--soft)}
.hd__nav a.on{background:var(--ink);color:#fff}
.hd__act{display:flex;gap:6px;margin-inline-start:auto}
.ib{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:0;background:transparent;cursor:pointer;color:var(--ink)}
.ib:hover{background:var(--soft)}
.ib svg{width:21px;height:21px}
.subnav{display:none}

/* drawer */
.drawer{position:fixed;inset:0;background:rgba(15,15,15,.4);z-index:90}
.drawer__panel{position:absolute;inset:0 0 0 auto;width:min(380px,90vw);background:var(--bg);overflow:auto;padding:22px 26px 48px;animation:slide .22s ease-out}
@keyframes slide{from{transform:translateX(100%)}to{transform:none}}
.drawer__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.drawer__top img{height:32px;width:auto}
.drawer h5{font-size:12.5px;color:var(--mute);margin:26px 0 6px;font-weight:600}
.drawer a{display:flex;justify-content:space-between;padding:9px 0;font-weight:600;font-size:15.5px}
.drawer a:hover{color:var(--red)}
.drawer a small{color:var(--mute);font-weight:400}

main{min-height:70vh;outline:none}

/* ---------- atoms ---------- */
.k{font-size:13px;font-weight:700;color:var(--red)}
a.k:hover{text-decoration:underline}
.meta{font-size:13px;color:var(--mute);display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.meta .by{color:var(--ink2);font-weight:600}
.t{font-family:var(--head);font-weight:700;line-height:1.7;margin:4px 0 8px;text-wrap:pretty;letter-spacing:0}
.t a{transition:color .15s}
.t a:hover{color:var(--red)}
.x{color:var(--ink2);margin:0 0 12px;font-size:15.5px;line-height:2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.ph{display:block;position:relative;overflow:hidden;background:var(--soft);border-radius:var(--r);aspect-ratio:3/2}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
a.ph:hover img{transform:scale(1.035)}
.ph.v::after{content:"";position:absolute;left:14px;bottom:14px;width:46px;height:46px;border-radius:50%;background:rgba(15,15,15,.78) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%23fff'/%3E%3C/svg%3E") center/20px no-repeat}
.sec{margin-top:var(--gap)}
.sh{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:26px}
.sh h2{font-family:var(--head);font-size:clamp(24px,2.6vw,32px);line-height:1.5;margin:0;font-weight:700}
.sh p{margin:4px 0 0;color:var(--mute);font-size:15px}
.more{font-size:14px;font-weight:700;white-space:nowrap;display:inline-flex;gap:6px;align-items:center;color:var(--ink2)}
.more:hover{color:var(--red)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 24px;border-radius:999px;background:var(--ink);color:#fff;font-weight:700;font-size:15px;border:0;cursor:pointer;transition:background .15s}
.btn:hover{background:var(--red)}
.btn--line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn--line:hover{background:var(--ink);color:#fff}
.fade{animation:fade .4s ease both}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.sk{background:linear-gradient(90deg,var(--soft),#f7f6f2,var(--soft));background-size:200% 100%;animation:sk 1.2s infinite;border-radius:6px}
@keyframes sk{to{background-position:-200% 0}}
.sk-line{height:14px;margin:12px 0}
.empty{padding:48px 0;color:var(--mute);text-align:center}

/* ---------- home: hero ---------- */
.today{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--mute);padding-top:34px}
.today b{color:var(--ink);font-weight:700}
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;margin-top:18px}
.hero .t{font-size:clamp(28px,3vw,40px);line-height:1.65;margin:10px 0 16px}
.hero .x{font-size:17.5px;-webkit-line-clamp:3}
.hero .ph{aspect-ratio:3/2;border-radius:16px}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:48px;padding-top:30px;border-top:1px solid var(--line)}
.trio .t{font-size:18.5px}

/* glance */
.glance{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tile{background:var(--soft);border-radius:16px;padding:22px 22px 20px;display:flex;flex-direction:column;gap:4px;min-height:150px;transition:background .15s}
a.tile:hover{background:var(--soft2)}
.tile .lb{font-size:13.5px;color:var(--mute);font-weight:600;display:flex;align-items:center;gap:8px}
.tile .v{font-family:var(--head);font-size:28px;font-weight:700;line-height:1.5;margin-top:auto}
.tile .v small{font-size:15px;font-weight:600;color:var(--ink2)}
.tile .s{font-size:13.5px;color:var(--ink2)}
.tile .s.up{color:var(--ok)}.tile .s.down{color:var(--red)}
.tile--alert{background:var(--ink);color:#fff}
.tile--alert .lb{color:#ff5a52}
.tile .v.vt{font-size:16.5px;line-height:1.85;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
a.tile--alert:hover{background:#262626}

/* tabs module */
.tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 0 26px;padding-bottom:2px}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;height:40px;padding:0 18px;border-radius:999px;border:0;background:var(--soft);font-weight:600;font-size:14.5px;cursor:pointer;transition:background .15s,color .15s}
.tabs button:hover{background:var(--soft2)}
.tabs button.on{background:var(--ink);color:#fff}
.news{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;min-height:420px}
.news .feat .t{font-size:24px}
.news .feat .ph{margin-bottom:16px}
.nlist{list-style:none;margin:0;padding:0;counter-reset:n}
.nlist li{counter-increment:n;display:grid;grid-template-columns:40px 1fr;gap:6px;padding:16px 0;border-bottom:1px solid var(--line)}
.nlist li:first-child{padding-top:0}
.nlist li::before{content:counter(n,persian);font-family:var(--head);font-size:24px;font-weight:700;color:#cfccc4;line-height:1.4}
.nlist .t{font-size:17px;margin:0 0 4px}
.news__more{margin-top:18px}

/* ads */
.ads{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ads a{display:block;border-radius:12px;overflow:hidden;background:var(--soft)}
.ads img{width:100%;height:auto;aspect-ratio:500/170;object-fit:cover}
.ads__lb{font-size:12px;color:var(--mute);margin-bottom:8px}

/* guide tiles */
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gt{border:1px solid var(--line);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:6px;transition:border-color .15s,background .15s;background:#fff}
.gt:hover{border-color:var(--ink)}
.gt .n{font-family:var(--head);color:var(--red);font-weight:700;font-size:14px}
.gt h3{font-family:var(--head);font-size:21px;margin:0;line-height:1.6}
.gt p{margin:0;color:var(--mute);font-size:14.5px;line-height:1.9}
.gt .lnk{margin-top:auto;padding-top:14px;font-size:14px;font-weight:600;color:var(--ink2);border-top:1px solid var(--line);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.gt .c{font-size:12.5px;color:var(--mute)}

/* culture band */
.band{background:var(--ink);color:#f3f1ec;padding:var(--gap) 0;margin-top:var(--gap)}
.band .sh h2{color:#fff}
.band .more{color:#bdb9b0}.band .more:hover{color:#fff}
.band .meta{color:#9c988f}.band .meta .by{color:#e2dfd8}
.band .x{color:#c9c5bc}
.band .k{color:#ff5148}
.band .ph{background:#222}
.band .t a:hover{color:#fff;opacity:.8}
.cult{display:grid;grid-template-columns:1.3fr 1fr;gap:56px;align-items:start}
.cult .feat .t{font-size:24px}
.cult .feat .ph{margin-bottom:18px;aspect-ratio:16/10}
.cult ul{list-style:none;margin:0;padding:0}
.cult li{padding:18px 0;border-bottom:1px solid #2c2c2c}
.cult li:first-child{padding-top:0}
.cult li .t{font-size:18px}

/* magazine strip */
.strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(190px,1fr);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:6px}
.strip::-webkit-scrollbar{display:none}
.cover{scroll-snap-align:start}
.cover .ph{aspect-ratio:3/4;margin-bottom:10px}
.cover .t{font-size:15px;line-height:1.75;margin:0}

/* classifieds band */
.clsb{background:var(--soft);border-radius:24px;padding:clamp(28px,5vw,56px);text-align:center}
.clsb h2{font-family:var(--head);font-size:clamp(24px,3vw,34px);margin:0 0 6px}
.clsb p{margin:0 auto 22px;color:var(--ink2);max-width:560px}
.sbox{position:relative;max-width:620px;margin:0 auto}
.sbox input{width:100%;height:58px;border-radius:999px;border:1.5px solid transparent;background:#fff;padding:0 56px 0 130px;font-size:16.5px;outline:none;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.sbox input:focus{border-color:var(--ink)}
.sbox svg{position:absolute;right:20px;top:18px;width:22px;height:22px;color:var(--mute)}
.sbox button{position:absolute;left:6px;top:6px;height:46px;padding:0 22px}
.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:20px}
.chips a,.chips button{height:38px;display:inline-flex;align-items:center;gap:6px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:14px;font-weight:600;cursor:pointer;transition:all .15s}
.chips a:hover,.chips button:hover{border-color:var(--ink)}
.chips .on{background:var(--ink);color:#fff;border-color:var(--ink)}
.chips--row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;justify-content:flex-start;margin-left:calc(-1*var(--g));margin-right:calc(-1*var(--g));padding:0 var(--g) 4px;-webkit-mask-image:linear-gradient(to left,#000 92%,transparent);mask-image:linear-gradient(to left,#000 92%,transparent)}
.chips--row::-webkit-scrollbar{display:none}
.chips--row>*{flex:none}
.chips small{color:var(--mute);font-weight:500}
.chips .on small{color:#bbb}

.cta{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cta h3{font-family:var(--head);font-size:22px;margin:0}
.cta p{margin:0;color:var(--mute)}

/* ---------- inner pages ---------- */
.ph-head{padding:56px 0 30px}
.ph-head .k{display:inline-block;margin-bottom:6px}
.ph-head h1{font-family:var(--head);font-size:clamp(30px,4.2vw,48px);line-height:1.5;margin:0 0 8px}
.ph-head p{margin:0;color:var(--ink2);max-width:720px;font-size:16.5px}
.ph-head .chips{justify-content:flex-start}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 36px}
.card .ph{margin-bottom:14px}
.card .t{font-size:18.5px}
.cat-hero{margin-bottom:56px;padding-bottom:56px;border-bottom:1px solid var(--line)}
.cat-hero .hero{margin-top:0}
.loadmore{display:flex;justify-content:center;margin:56px 0 0}

/* article */
.art{max-width:720px;margin:0 auto;padding-top:48px}
.art h1{font-family:var(--head);font-size:clamp(28px,4vw,44px);line-height:1.6;margin:10px 0 14px;text-wrap:balance}
.art__dek{font-size:19px;line-height:2;color:var(--ink2);margin:0 0 22px}
.art__bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:30px}
.tools{display:flex;gap:6px}
.tools button{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;font-weight:700;font-size:14px}
.tools button:hover{border-color:var(--ink)}
.art__hero{max-width:1040px;margin:0 auto 34px;padding:0 var(--g)}
.art__hero img{width:100%;max-height:620px;object-fit:cover;border-radius:16px;background:var(--soft)}
.art__hero figcaption{font-size:13px;color:var(--mute);padding-top:8px;text-align:center}
.body{font-size:calc(18.5px * var(--fs,1));line-height:2.15;color:var(--ink)}
.body p{margin:0 0 1.2em}
.body h2,.body h3,.body h4{font-family:var(--head);line-height:1.6;margin:1.8em 0 .6em}
.body h2{font-size:1.35em}.body h3{font-size:1.18em}
.body a{color:var(--red2);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.body img{height:auto;margin:1.6em auto;border-radius:12px;background:var(--soft)}
.body figure{margin:1.6em 0}
.body figcaption{font-size:.72em;color:var(--mute);text-align:center}
.body blockquote{margin:1.6em 0;padding:1em 1.4em;border-radius:12px;background:var(--soft);font-size:1em}
.body blockquote p:last-child{margin:0}
.body ul,.body ol{padding-right:1.3em}
.body iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;margin:1.4em 0;border-radius:12px;background:#000}
.body table{width:100%;border-collapse:collapse;font-size:.85em;margin:1.4em 0;display:block;overflow-x:auto}
.body td,.body th{border:1px solid var(--line);padding:6px 10px}
.art__end{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;margin-top:40px;padding-top:22px;border-top:1px solid var(--line)}
.share{display:flex;gap:8px;flex-wrap:wrap}
.share a,.share button{height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center}
.share a:hover,.share button:hover{border-color:var(--ink)}
.src{font-size:14px;color:var(--mute)}
.src:hover{color:var(--red)}

/* dollar */
.fxp{display:grid;grid-template-columns:1fr 2fr;gap:28px;align-items:start}
.fxtiles{display:grid;gap:14px}
.chart{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px}
.chart svg{width:100%;height:auto;display:block}
.legend{display:flex;gap:20px;font-size:13.5px;margin-bottom:10px;color:var(--ink2)}
.legend i{display:inline-block;width:16px;height:3px;border-radius:2px;vertical-align:middle;margin-inline-end:6px}
.tbl{width:100%;border-collapse:collapse;font-size:15px;margin-top:28px}
.tbl th{font-size:13px;color:var(--mute);text-align:right;font-weight:600;padding:10px 8px;border-bottom:1px solid var(--line)}
.tbl td{padding:12px 8px;border-bottom:1px solid var(--line)}
.note{font-size:13.5px;color:var(--mute);margin-top:16px}

/* classifieds page */
.cl-top{display:flex;flex-direction:column;gap:18px}
.cl-top .sbox{margin:0;max-width:none}
.cl-top .sbox input{padding-left:24px;background:#fff;border-color:var(--line)}
.cls-group{margin-top:48px}
.cls-group h2{font-family:var(--head);font-size:22px;margin:0 0 16px;display:flex;gap:10px;align-items:baseline}
.cls-group h2 span{font-family:var(--ui);font-size:13px;color:var(--mute);font-weight:600}
.adgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.ad{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;transition:border-color .15s}
.ad:hover{border-color:var(--ink)}
.ad h3{font-family:var(--head);font-size:16.5px;line-height:1.7;margin:0 0 6px}
.ad p{margin:0;font-size:14px;line-height:1.9;color:var(--ink2);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.ad .go{margin-top:auto;padding-top:10px;font-size:13px;font-weight:700;color:var(--red)}
.ad-cta{margin-top:64px;background:var(--soft);border-radius:20px;padding:30px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.ad-cta h3{font-family:var(--head);font-size:22px;margin:0}
.ad-cta p{margin:0;color:var(--ink2)}

/* search */
.rows .row{display:grid;grid-template-columns:1fr 150px;gap:22px;padding:22px 0;border-bottom:1px solid var(--line);align-items:start}
.rows .row .ph{aspect-ratio:4/3}
.rows .row .t{font-size:19px}
.srch{display:grid;grid-template-columns:2fr 1fr;gap:48px;margin-top:10px}
.srch aside h3{font-family:var(--head);font-size:18px;margin:0 0 14px}
.srch aside .ad{margin-bottom:12px}

/* contact */
.contact{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.contact .tile .v{font-size:20px}

/* before/after */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ba figure{margin:0}
.ba figcaption{font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.ba figcaption span{font-size:12.5px;font-weight:700;padding:2px 10px;border-radius:999px;background:var(--soft2)}
.ba figcaption span.new{background:var(--red);color:#fff}
.ba img{width:100%;height:auto;border-radius:14px;border:1px solid var(--line);box-shadow:0 20px 40px -28px rgba(0,0,0,.35)}
.ba--m{grid-template-columns:repeat(2,minmax(0,300px));justify-content:center}
.chg{width:100%;border-collapse:separate;border-spacing:0;font-size:15.5px}
.chg th{text-align:right;font-size:13px;color:var(--mute);font-weight:600;padding:10px 14px;border-bottom:1px solid var(--line)}
.chg td{padding:16px 14px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.9}
.chg td:first-child{font-weight:700;font-family:var(--head);font-size:15.5px;white-space:nowrap}
.chg td:nth-child(2){color:var(--mute)}
.chg td:nth-child(3){color:var(--ink)}
.chg td:nth-child(3)::before{content:"";display:inline-block;width:7px;height:7px;background:var(--red);transform:rotate(45deg);margin-inline-end:8px;vertical-align:.15em}

/* footer */
.ft{background:#0e0e0d;color:#c9c5bc;margin-top:var(--gap);padding:64px 0 28px;font-size:14.5px}
.ft__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px}
.ft__logo{height:44px;width:auto;margin-bottom:16px}
.ft p{line-height:2;margin:0 0 14px}
.ft h4{color:#fff;font-size:14.5px;margin:4px 0 14px}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin:0 0 8px}
.ft a:hover{color:#fff}
.ft__soc{display:flex;gap:16px;flex-wrap:wrap}
.ft__soc a{color:#fff;font-weight:600}
.ft__bar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid #2b2b2b;margin-top:48px;padding-top:20px;font-size:13px;color:#8d897f}
.credit b{color:#fff;letter-spacing:.1em}
.credit:hover b{color:var(--red)}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .hd__nav{display:none}
  .subnav{display:block;border-top:1px solid var(--line)}
  .subnav__in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:8px 0}
  .subnav__in::-webkit-scrollbar{display:none}
  .subnav a{flex:none;padding:6px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink2)}
  .subnav a.on{background:var(--ink);color:#fff}
  .glance{grid-template-columns:1fr 1fr}
  .guide{grid-template-columns:1fr 1fr}
  .ft__grid{grid-template-columns:1fr 1fr}
  .cards{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  :root{--g:18px}
  body{font-size:15.5px}
  .hd__in{height:62px;gap:10px}
  .hd__logo img{height:32px}
  .today{padding-top:22px;font-size:13px}
  .hero{grid-template-columns:1fr;gap:18px;margin-top:12px}
  .hero .ph{order:-1;aspect-ratio:3/2;border-radius:12px}
  .hero .t{font-size:27px;margin:6px 0 10px}
  .hero .x{font-size:16px}
  .trio{grid-template-columns:1fr;gap:0;margin-top:30px;padding-top:6px}
  .trio>*{padding:16px 0;border-bottom:1px solid var(--line)}
  .trio>*:last-child{border-bottom:0}
  .trio .t{font-size:17px}
  .tile{min-height:128px;padding:18px}
  .tile .v{font-size:23px}
  .tile .v.vt{font-size:14.5px}
  .news{grid-template-columns:1fr;gap:26px;min-height:0}
  .news .feat .t{font-size:21px}
  .ads{grid-template-columns:1fr}
  .guide{grid-template-columns:1fr}
  .gt{padding:20px}
  .cult{grid-template-columns:1fr;gap:30px}
  .cult .feat .t{font-size:23px}
  .strip{grid-auto-columns:62%}
  .sbox input{height:54px;padding-left:20px;font-size:16px}
  .sbox button{display:none}
  .cta{flex-direction:column;align-items:flex-start}
  .ph-head{padding:34px 0 22px}
  .cards{grid-template-columns:1fr;gap:0}
  .cards .card{display:grid;grid-template-columns:1fr 112px;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
  .cards .card .ph{order:2;aspect-ratio:1;margin:0;border-radius:8px}
  .cards .card .t{font-size:16.5px}
  .cat-hero{margin-bottom:10px;padding-bottom:26px}
  .art{padding-top:28px}
  .art__dek{font-size:17px}
  .art__hero{padding:0;margin-bottom:24px}
  .art__hero img{border-radius:0}
  .body{font-size:calc(17.5px * var(--fs,1))}
  .fxp,.srch,.contact,.ba{grid-template-columns:1fr}
  .ba--m{grid-template-columns:1fr 1fr}
  .rows .row{grid-template-columns:1fr 96px;gap:14px}
  .rows .row .t{font-size:16.5px}
  .rows .row .x{display:none}
  .chg td:first-child{white-space:normal}
  .chg thead{display:none}
  .chg tr{display:block;padding:14px 0;border-bottom:1px solid var(--line)}
  .chg td{display:block;border:0;padding:3px 0}
  .ft__grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ================= v3: dark mode ================= */
.lg-d{display:none}
:root[data-theme="dark"]{--bg:#111110;--soft:#1c1c1a;--soft2:#2a2a27;--ink:#f3f1ec;--ink2:#d6d3cc;--mute:#9a968d;--line:#2a2a27;--red:#ff3b30;--red2:#ff6a60;--ok:#3ccf7d;color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#111110;--soft:#1c1c1a;--soft2:#2a2a27;--ink:#f3f1ec;--ink2:#d6d3cc;--mute:#9a968d;--line:#2a2a27;--red:#ff3b30;--red2:#ff6a60;--ok:#3ccf7d;color-scheme:dark}
  :root:not([data-theme="light"]) .lg-l{display:none}:root:not([data-theme="light"]) .lg-d{display:block}
  :root:not([data-theme="light"]) .hd{background:rgba(17,17,16,.9)}
  :root:not([data-theme="light"]) .btn{background:#f3f1ec;color:#111}
  :root:not([data-theme="light"]) .btn:hover{background:var(--red);color:#fff}
  :root:not([data-theme="light"]) .gt,:root:not([data-theme="light"]) .ad,:root:not([data-theme="light"]) .chart,:root:not([data-theme="light"]) .tools button,:root:not([data-theme="light"]) .share a,:root:not([data-theme="light"]) .share button,:root:not([data-theme="light"]) .chips a,:root:not([data-theme="light"]) .chips button,:root:not([data-theme="light"]) .sbox input{background:var(--soft)}
  :root:not([data-theme="light"]) .band{background:#000}
  :root:not([data-theme="light"]) .tile--alert{background:#2a0d0b}
}
:root[data-theme="dark"] .lg-l{display:none}:root[data-theme="dark"] .lg-d{display:block}
:root[data-theme="dark"] .hd{background:rgba(17,17,16,.9)}
:root[data-theme="dark"] .btn{background:#f3f1ec;color:#111}
:root[data-theme="dark"] .btn:hover{background:var(--red);color:#fff}
:root[data-theme="dark"] .gt,:root[data-theme="dark"] .ad,:root[data-theme="dark"] .chart,:root[data-theme="dark"] .tools button,:root[data-theme="dark"] .share a,:root[data-theme="dark"] .share button,:root[data-theme="dark"] .chips a,:root[data-theme="dark"] .chips button,:root[data-theme="dark"] .sbox input{background:var(--soft)}
:root[data-theme="dark"] .band{background:#000}
:root[data-theme="dark"] .tile--alert{background:#2a0d0b}
.chips .on,.tabs button.on,.hd__nav a.on,.subnav a.on{background:var(--ink);color:var(--bg)}
.t a:visited{color:var(--mute)}
.band .t a:visited{color:#9c988f}

/* ================= story rings ================= */
.rings{direction:ltr;display:flex;gap:14px;overflow-x:auto;scrollbar-width:none;padding:22px var(--g) 4px;margin:0 calc(-1*var(--g))}
.rings::-webkit-scrollbar{display:none}
.ring{flex:none;display:flex;flex-direction:column;align-items:center;gap:6px;border:0;background:none;padding:0;cursor:pointer;width:74px}
.ring__o{width:70px;height:70px;border-radius:50%;padding:3px;background:conic-gradient(from 210deg,var(--red),#ff8a3d,var(--red));display:block;transition:transform .2s}
.ring:hover .ring__o{transform:scale(1.05)}
.ring__o img,.ring__fx{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--bg);display:block;background:var(--soft)}
.ring__fx{display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:26px;color:var(--ok);background:var(--soft)}
.ring.seen .ring__o{background:var(--soft2)}
.ring__n{direction:rtl;font-size:12.5px;font-weight:600;color:var(--ink2);white-space:nowrap}
.fresh{display:flex;align-items:center;gap:10px;width:100%;margin-top:14px;padding:12px 16px;border-radius:14px;border:0;background:var(--soft);font-weight:700;font-size:14.5px;cursor:pointer;text-align:right}
.fresh i{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px color-mix(in srgb,var(--red) 22%,transparent);flex:none;animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px transparent}}
.fresh span{margin-inline-start:auto;color:var(--red);font-size:13.5px}
.resume{display:flex;align-items:center;gap:14px;margin-top:12px;padding:12px;border-radius:14px;border:1px solid var(--line)}
.resume img{width:56px;height:56px;border-radius:10px;object-fit:cover;flex:none}
.resume>span{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.resume b{font-weight:700;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.resume__bar{height:3px;background:var(--soft2);border-radius:3px;overflow:hidden;margin-top:6px}
.resume__bar i{display:block;height:100%;background:var(--red)}
.nw{background:var(--red);color:#fff;font-size:11px;font-weight:700;padding:0 7px;border-radius:999px;line-height:1.8}

/* ================= story viewer ================= */
.sv{position:fixed;inset:0;z-index:200;background:#000;display:grid;place-items:center;animation:svin .22s ease-out;touch-action:none;user-select:none;-webkit-user-select:none}
@keyframes svin{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
.sv__card{position:relative;width:min(100vw,calc(100dvh * .5625));height:100dvh;overflow:hidden;background:#111;color:#fff}
@media (min-width:700px){.sv__card{height:min(92dvh,860px);border-radius:18px}}
.sv__bars{direction:ltr;position:absolute;top:calc(10px + env(safe-area-inset-top));left:12px;right:12px;display:flex;gap:4px;z-index:5}
.sv__bar{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}
.sv__bar i{display:block;height:100%;background:#fff;margin-inline-start:0}
.sv__top{position:absolute;top:calc(22px + env(safe-area-inset-top));left:8px;right:16px;display:flex;align-items:center;gap:10px;z-index:5;font-size:14px}
.sv__ring{font-weight:700}
.sv__time{opacity:.75;font-size:13px}
.sv__x{margin-inline-start:auto;width:40px;height:40px;border:0;background:none;color:#fff;display:grid;place-items:center;cursor:pointer}
.sv__x svg{width:24px;height:24px}
/* ambient: the same photo, blurred and darkened, fills the screen behind everything */
.sv__amb{position:absolute;inset:-40px;background-size:cover;background-position:center;filter:blur(38px) saturate(1.5) brightness(.55);transform:scale(1.15)}
.sv__amb::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.25),rgba(0,0,0,.15) 40%,rgba(0,0,0,.55))}
.sv__stage{position:absolute;inset:0;display:flex;flex-direction:column;padding:calc(74px + env(safe-area-inset-top)) 14px calc(14px + env(safe-area-inset-bottom));gap:14px;z-index:4;pointer-events:none}
/* the photo itself, whole and sharp, in its own frame: nothing is printed over it */
.sv__pic{margin:0;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center}
.sv__pic img{max-width:100%;max-height:100%;width:100%;height:auto;object-fit:contain;border-radius:20px;box-shadow:0 30px 60px -20px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.08);animation:kb 7s ease-out forwards}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.035)}}
/* frosted glass panel: text always sits on calm, dark glass */
.sv__txt{flex:none;position:relative;padding:20px 20px 18px;border-radius:24px;background:rgba(14,14,14,.55);-webkit-backdrop-filter:blur(26px) saturate(1.6);backdrop-filter:blur(26px) saturate(1.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 20px 40px -20px rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.09);animation:up .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.sv__txt::before{content:"";position:absolute;top:0;right:22px;width:34px;height:3px;border-radius:0 0 3px 3px;background:var(--red)}
.sv__txt .k{display:inline-block;color:#fff;background:rgba(255,255,255,.12);padding:1px 10px;border-radius:999px;font-size:12px}
.sv__txt h2{font-family:var(--head);font-size:clamp(20px,5.6vw,25px);line-height:1.7;margin:10px 0 8px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.sv__txt p{margin:0 0 16px;font-size:14.5px;line-height:2;color:rgba(255,255,255,.82);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.sv__txt a,.sv__txt button{pointer-events:auto}
.sv__acts{display:flex;gap:10px;align-items:center;position:relative;z-index:6}
.sv__read{background:#fff!important;color:#111!important;flex:1}
.sv__save{width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(255,255,255,.6);background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer}
.sv__save.on{background:#fff;color:#111}
.sv__tap{position:absolute;top:70px;bottom:0;border:0;background:transparent;z-index:3;cursor:pointer}
.sv__prev{left:0;width:34%}.sv__next{right:0;width:66%}
.sv__fx{position:absolute;inset:0;z-index:4;pointer-events:none;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:90px 26px 40px;background:radial-gradient(120% 80% at 50% 0,#1f2a22,#0b0b0b)}
.sv__fx .k{color:#7fe3a7}
.sv__big{font-family:var(--head);font-size:48px;font-weight:700;line-height:1.4}
.sv__big small{font-size:18px;opacity:.8}
.sv__tr{font-weight:700}.sv__tr.up{color:#3ccf7d}.sv__tr.down{color:#ff5a52}
.sv__sub{opacity:.8}
.sv__chart svg{width:100%;height:auto;margin:18px 0}
.sv__fx .btn{background:#fff;color:#111;position:relative;z-index:6;align-self:flex-start;pointer-events:auto}

/* ================= game ================= */
.game{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:20px 22px;border-radius:16px;border:1px dashed var(--soft2)}
.game:empty{display:none}
.game__q{display:flex;flex-direction:column;gap:2px}
.game__q b{font-family:var(--head);font-size:17px;line-height:1.7}
.game__q>span{font-size:13.5px;color:var(--mute)}
.game__res{font-weight:700;font-size:14px!important;color:var(--ink)!important}
.game__res.win{color:var(--ok)!important}.game__res.lose{color:var(--red)!important}
.game__score{font-size:13px!important;color:var(--ink2)!important}
.game__btns{display:flex;gap:8px}
.game__btns button{height:46px;padding:0 20px;border-radius:999px;border:1.5px solid var(--line);background:var(--bg);font-weight:700;font-size:15px;cursor:pointer;transition:all .15s}
.game__btns button.up:hover{border-color:var(--ok);color:var(--ok)}
.game__btns button.down:hover{border-color:var(--red);color:var(--red)}
.game__done{display:flex;flex-direction:column;align-items:flex-end;font-size:14px}
.game__done span{color:var(--mute);font-size:13px}

/* ================= up next, saved, install, toast ================= */
.upnext{display:flex;gap:16px;align-items:center;max-width:720px;margin:44px auto 0;padding:14px;border-radius:18px;background:var(--soft);transition:background .15s}
.upnext:hover{background:var(--soft2)}
.upnext .ph{width:120px;flex:none;aspect-ratio:1;border-radius:12px}
.upnext__b{display:flex;flex-direction:column;gap:2px;min-width:0}
.upnext .t{font-size:18px;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.tools button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tools #sv-btn{display:grid;place-items:center}
.empty-art{display:flex;flex-direction:column;align-items:center;gap:18px;padding:40px 0;color:var(--mute)}
.empty-art svg{width:44px;height:44px}
.install{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:18px;background:var(--soft);margin-top:40px}
.install img{border-radius:14px;flex:none}
.install>div{display:flex;flex-direction:column;gap:2px;flex:1}
.install b{font-family:var(--head);font-size:16px}
.install span{font-size:13.5px;color:var(--mute);line-height:1.9}
.toast{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:999px;font-weight:600;font-size:14px;opacity:0;pointer-events:none;transition:all .25s;z-index:300;white-space:nowrap}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ================= phone tab bar ================= */
.tb{display:none}
@media (max-width:760px){
  .tb{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .tb a{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;font-weight:600;color:var(--mute);position:relative;padding:4px 0}
  .tb a svg{width:24px;height:24px}
  .tb a.on{color:var(--ink)}
  .tb a.on::before{content:"";position:absolute;top:-7px;width:22px;height:3px;border-radius:3px;background:var(--red)}
  .tb a[data-h="#stories"] svg{color:var(--red)}
  .tb em{position:absolute;top:0;left:calc(50% - 20px);min-width:17px;height:17px;border-radius:9px;background:var(--red);color:#fff;font-style:normal;font-size:10.5px;display:grid;place-items:center;padding:0 4px}
  .tb em[hidden]{display:none}
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .subnav{display:none!important}
  #menu-btn,.hd__act a.ib{display:none}
  .hd__in{height:58px}
  .rings{padding-top:14px;gap:12px}
  .ring{width:66px}.ring__o{width:64px;height:64px}
  /* hero: Medad photos carry their own headline boxes, so text never sits on them */
  .hero{display:flex;flex-direction:column;align-items:stretch;gap:14px;margin-top:6px}
  .hero .ph{order:-1;aspect-ratio:3/2;border-radius:14px;margin:0}
  .hero .t{font-size:25px;margin:4px 0 8px}
  .hero .x{display:-webkit-box;-webkit-line-clamp:2;font-size:15.5px}
  .today{display:none}
  /* tiles become a swipe row */
  .glance{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1*var(--g));padding:0 var(--g)}
  .glance::-webkit-scrollbar{display:none}
  .glance .tile{flex:0 0 72%;scroll-snap-align:start;min-height:138px}
  .game{flex-direction:column;align-items:stretch}
  .game__btns button{flex:1}
  .game__done{align-items:flex-start}
  /* guide: compact two-up */
  .guide{grid-template-columns:1fr 1fr;gap:10px}
  .gt{padding:16px;border-radius:14px}
  .gt h3{font-size:16px}
  .gt p,.gt .lnk{display:none}
  .gt .c{margin-top:auto}
  .tabs{margin-left:calc(-1*var(--g));margin-right:calc(-1*var(--g));padding:0 var(--g) 2px}
  .upnext .ph{width:92px}
  .upnext .t{font-size:16px}
  .art__end{flex-direction:column;align-items:stretch}
  .share{justify-content:space-between}
  .share a,.share button{flex:1;justify-content:center}
  .install{flex-wrap:wrap}
}

/* ================= v7: fixes ================= */
/* footer keeps its own dark palette in both themes */
.ft .ft__soc{gap:10px}
.ft__soc a{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 12px;border-radius:999px;background:#1d1d1b;color:#f3f1ec;font-weight:600;font-size:14px;transition:background .15s}
.ft__soc a:hover{background:#2c2c29;color:#fff}
.ft__soc svg{width:18px;height:18px;flex:none}
.ft h4{color:#fff}
.ft a{color:#c9c5bc}
.ft a:hover{color:#fff}
.ft__bar{color:#9a968d}
:root[data-theme="dark"] .ft{background:#0a0a09;border-top:1px solid #232321}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ft{background:#0a0a09;border-top:1px solid #232321}}
/* selected chips and tabs stay readable in dark mode */
:root[data-theme="dark"] .chips .on,:root[data-theme="dark"] .tabs button.on{background:#f3f1ec;color:#111;border-color:#f3f1ec}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chips .on,:root:not([data-theme="light"]) .tabs button.on{background:#f3f1ec;color:#111;border-color:#f3f1ec}}
/* social tiles on the contact page */
.soc-ico{width:22px;height:22px;display:inline-block;vertical-align:-5px;margin-inline-end:8px}
.tile .lb .soc-ico{width:18px;height:18px;margin:0}
.share svg.soc-ico{width:17px;height:17px;vertical-align:-3px;margin-inline-end:6px}
.btn svg.soc-ico{width:19px;height:19px;margin:0}
.share a{gap:2px}

/* ================= v9: story bar, Telegram, article sidebar ================= */
.storybar{margin-top:20px}
.storybar__lbl{display:none}
.fresh-pill{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;border:0;background:var(--red);color:#fff;font-weight:700;font-size:13.5px;cursor:pointer;width:max-content}
.fresh-pill i{width:7px;height:7px;border-radius:50%;background:#fff;animation:pulse 2s infinite}
.ring__o{position:relative}
.ring__tg{position:absolute;right:-2px;bottom:-2px;width:26px;height:26px;border-radius:50%;background:#2AABEE;color:#fff;display:grid;place-items:center;border:3px solid var(--bg)}
.ring__tg svg{width:13px;height:13px}
@media (min-width:761px){
  .storybar{display:flex;align-items:center;gap:28px;padding:16px 22px 14px;border:1px solid var(--line);border-radius:24px;background:var(--card,#fff);margin-top:26px}
  :root[data-theme="dark"] .storybar{background:var(--soft)}
  .storybar__lbl{display:flex;flex-direction:column;gap:4px;flex:none;width:auto;min-width:190px;padding-inline-end:24px;border-inline-end:1px solid var(--line)}
  .storybar__lbl b{font-family:var(--head);font-size:18px;line-height:1.6;white-space:nowrap}
  .storybar__lbl>span{font-size:13px;color:var(--mute)}
  .storybar__hint{font-size:12.5px!important}
  .storybar .rings{flex:1;padding:0;margin:0;justify-content:space-between;gap:6px}
  .storybar .ring{width:78px}
  .storybar .ring__o{width:72px;height:72px}
  .fresh{display:none}
  .today{display:none}
}
@media (prefers-color-scheme:dark) and (min-width:761px){:root:not([data-theme="light"]) .storybar{background:var(--soft)}}

/* telegram cards */
.tgrow{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tgc{display:flex;flex-direction:column;gap:10px;border-radius:16px;transition:transform .2s}
.tgc:hover{transform:translateY(-2px)}
.tgc:hover .t{color:var(--red)}
.tgc__b{display:flex;flex-direction:column;gap:4px}
.tgc .k{display:inline-flex;align-items:center;gap:6px;color:#1f8fd0}
.tgc .k svg,.tgp .k svg,.side__blk h3 svg,.tg-head .k svg{width:15px;height:15px}
.tgc .t{font-family:var(--head);font-weight:700;font-size:16.5px;line-height:1.75;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;transition:color .15s}
.tgm{display:block;position:relative;overflow:hidden;border-radius:14px;background:var(--soft);aspect-ratio:3/2}
.tgm img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgm.big{aspect-ratio:auto;max-height:560px}
.tgm.big img{position:static;width:100%;height:auto;max-height:560px;object-fit:contain;background:#111}
.tgm.v::after{content:"";position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:rgba(15,15,15,.72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%23fff'/%3E%3C/svg%3E") center/26px no-repeat;backdrop-filter:blur(4px)}
.tgm em{position:absolute;left:10px;bottom:10px;background:rgba(0,0,0,.7);color:#fff;font-style:normal;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px}
/* telegram feed page */
.tgfeed{max-width:720px;margin:10px auto 0;display:flex;flex-direction:column;gap:22px}
.tgp{border:1px solid var(--line);border-radius:22px;padding:22px;background:var(--card,#fff);scroll-margin-top:90px}
:root[data-theme="dark"] .tgp{background:var(--soft)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tgp{background:var(--soft)}}
.tgp__h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.tgp__h img{width:40px;height:40px;border-radius:50%}
.tgp__h b{display:block;font-size:15px}
.tgp .t{font-size:20px;margin:0 0 4px}
.tgp__by{margin:0 0 12px;color:var(--mute);font-size:13.5px}
.tgp__m{display:block;margin:12px 0}
.tgp__play{display:inline-flex;margin-top:8px;font-size:13.5px;font-weight:700;color:#1f8fd0}
.tgp__t{font-size:16.5px;line-height:2.05;color:var(--ink2)}
.tgp__t p{margin:0 0 .8em}
.tgp__t a{color:#1f8fd0;word-break:break-all}
.tgp__t.clamp{max-height:calc(2.05em * 8);overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,#000 70%,transparent);mask-image:linear-gradient(to bottom,#000 70%,transparent)}
.tgp__f{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;padding-top:12px;border-top:1px solid var(--line)}
.tgp__more{border:0;background:none;cursor:pointer;padding:0}
/* telegram ads inside classifieds */
.tgads{margin-top:36px}
.tgads h2{font-family:var(--head);font-size:21px;margin:0 0 14px;display:flex;align-items:center;gap:10px}
.tgads h2 span,.adtag{font-family:var(--ui);font-size:11.5px;font-weight:700;color:#7a5c00;background:#FFE9A8;padding:1px 9px;border-radius:999px;align-self:flex-start}
.tgrow--ads{display:flex;overflow-x:auto;scrollbar-width:none;gap:14px;padding-bottom:4px}
.tgrow--ads::-webkit-scrollbar{display:none}
.tgc--ad{flex:0 0 240px;border:1px solid var(--line);padding:10px;background:var(--card,#fff)}
:root[data-theme="dark"] .tgc--ad{background:var(--soft)}
.tgc--ad .t{font-size:15px;-webkit-line-clamp:2}
.tgc--ad .x{font-size:13px;color:var(--mute);line-height:1.8;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
/* article layout with sidebar */
.crumbs{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--mute)}
.crumbs a:hover{color:var(--red)}
.crumbs a:last-child{color:var(--red)}
.crumbs i{font-style:normal;opacity:.5}
.artside{display:none}
.artmain .art__hero{max-width:none;padding:0;margin:0 0 30px}
.artmain .art__hero img{border-radius:16px}
@media (min-width:1100px){
  .artwrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
  .artmain .art{max-width:none;margin:0}
  .artside{display:flex;flex-direction:column;gap:18px;position:sticky;top:96px;padding-top:48px}
  .side__blk{border:1px solid var(--line);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px}
  .side__blk h3{font-family:var(--head);font-size:17px;margin:0;display:flex;align-items:center;gap:8px}
  .nlist--sm li{grid-template-columns:30px 1fr;padding:11px 0}
  .nlist--sm li::before{font-size:19px}
  .nlist--sm .t{font-family:var(--head);font-size:14.5px;font-weight:700;line-height:1.75;display:block;margin:0 0 2px}
  .nlist--sm .t:hover{color:var(--red)}
  .side__fx{min-height:auto}
  .side__blk .tgc{flex-direction:row;gap:12px}
  .side__blk .tgc .tgm{width:96px;flex:none;aspect-ratio:1}
  .side__blk .tgc .t{font-size:14px;-webkit-line-clamp:3}
  .side__blk .tgc .k{display:none}
}
@media (max-width:1020px){.tgrow{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  .tgrow{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1*var(--g));padding:0 var(--g);gap:14px}
  .tgrow::-webkit-scrollbar{display:none}
  .tgrow .tgc{flex:0 0 72%;scroll-snap-align:start}
  .tgp{padding:18px;border-radius:18px}
  .tgp .t{font-size:18px}
  .tgfeed{gap:16px}
  .tgm.big{margin:0 -18px;border-radius:0}
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tgc--ad{background:var(--soft)}}

/* ================= v10: data strip, live wire, briefing, daily rituals ================= */
.num{font-variant-numeric:tabular-nums}
.ds{background:#0f0f0f;color:#c9c5bc;font-size:12.5px;line-height:1}
:root[data-theme="dark"] .ds{background:#000;border-bottom:1px solid #1d1d1b}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ds{background:#000;border-bottom:1px solid #1d1d1b}}
.ds:empty{height:36px}
.ds__in{display:flex;align-items:center;height:36px;gap:0;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.ds__in::-webkit-scrollbar{display:none}
.ds__i{display:inline-flex;align-items:center;gap:6px;padding:0 14px;border-inline-start:1px solid #2c2c29;flex:none}
.ds__i:first-child{border:0;padding-inline-start:0}
.ds b{color:#fff;font-weight:600}
.ds__g{color:#8d897f}
.ds__w svg{width:16px;height:16px;color:#ffd27a}
.ds__fx{margin-inline-start:auto;border:0;padding-inline-end:0}
.ds__fx:hover b{color:#ff8a80}
.ds__fx i{font-style:normal;font-size:10px}
.ds__fx i.up{color:#3ccf7d}.ds__fx i.down{color:#ff5a52}.ds__fx i.flat{color:#8d897f}

/* breaking */
.brk{display:flex;align-items:center;gap:14px;margin-top:16px;padding:12px 14px 12px 12px;border-radius:14px;background:var(--red);color:#fff}
.brk__k{flex:none;display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:13px;background:rgba(0,0,0,.2);padding:3px 11px;border-radius:999px}
.brk__k i{width:7px;height:7px;border-radius:50%;background:#fff;animation:pulse 2s infinite}
.brk__t{flex:1;font-family:var(--head);font-weight:700;font-size:15.5px;line-height:1.75;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.brk__t:hover{text-decoration:underline}
.brk__w{flex:none;font-size:12.5px;opacity:.85}
.brk__x{flex:none;width:32px;height:32px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;cursor:pointer}
.brk__x svg{width:16px;height:16px}

/* lead + live wire */
.top{margin-top:26px}
.pulse{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px color-mix(in srgb,var(--red) 22%,transparent);animation:pulse 2s infinite;flex:none}
.wire__h{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.wire__h h2{font-family:var(--head);font-size:20px;line-height:1.5;margin:0;display:flex;align-items:center;gap:10px}
.wire__h span{font-size:12.5px;color:var(--mute)}
.wire__new{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:40px;margin:6px 0 8px;border:0;border-radius:999px;background:var(--red);color:#fff;font-weight:700;font-size:14px;cursor:pointer;animation:drop .25s ease-out}
.wire__new[hidden]{display:none}
.wire__new i{width:7px;height:7px;border-radius:50%;background:#fff;animation:pulse 2s infinite}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}}
.wire__l{list-style:none;margin:0;padding:0}
.wire__l li{display:grid;grid-template-columns:56px 1fr;gap:10px;padding:12px 0;border-top:1px solid var(--line);position:relative}
.wire__l time{font-size:12.5px;font-weight:700;color:var(--mute);font-variant-numeric:tabular-nums;line-height:2.1}
.wire__l li.live time{color:var(--red)}
.wire__l li.live time::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--red);margin-inline-end:5px;vertical-align:2px;animation:pulse 2s infinite}
.wire__k{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:var(--mute);line-height:1.6}
.wire__k svg{width:13px;height:13px;color:#2AABEE}
.wire__l a{font-family:var(--head);font-weight:700;font-size:15px;line-height:1.8;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;transition:color .15s}
.wire__l a:hover{color:var(--red)}
.wire__l li:nth-child(n+11){display:none}
.wire.open .wire__l li{display:grid}
.wire__all{display:block;width:100%;height:42px;margin-top:6px;border:1px solid var(--line);border-radius:999px;background:transparent;font-weight:700;font-size:14px;cursor:pointer;color:var(--ink2)}
.wire__all:hover{border-color:var(--ink)}
.wire__l.flash li:first-child{animation:flash 1.2s ease-out}
@keyframes flash{from{background:color-mix(in srgb,var(--red) 14%,transparent)}}
@media (min-width:1021px){
  .top{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;align-items:start}
  .top .hero{display:flex;flex-direction:column;align-items:stretch;gap:20px;margin:0}
  .top .hero .t{font-size:clamp(27px,2.35vw,34px);line-height:1.6;margin:6px 0 10px}
  .top .hero .x{-webkit-line-clamp:2;font-size:16.5px;margin-bottom:8px}
  .top .hero .ph{border-radius:16px}
  .wire{border-inline-start:1px solid var(--line);padding-inline-start:28px;position:sticky;top:92px}
}

/* briefing + glance */
.brief{background:#0f0f0f;color:#f3f1ec;border-radius:22px;padding:26px 28px 22px;display:flex;flex-direction:column}
:root[data-theme="dark"] .brief{background:#000;border:1px solid #2a2a27}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .brief{background:#000;border:1px solid #2a2a27}}
.brief__ed{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#ff6a60}
.brief__ed .dia{background:#ff3b30}
.brief h2{font-family:var(--head);font-size:26px;line-height:1.5;margin:6px 0 2px;color:#fff}
.brief__h p{margin:0 0 12px;font-size:14px;color:#b5b1a8}
.brief__l{list-style:none;margin:0;padding:0}
.brief__l a{display:grid;grid-template-columns:62px 1fr 22px;gap:10px;align-items:center;padding:12px 0;border-top:1px solid #2a2a27}
.brief__n{font-size:12.5px;font-weight:700;color:#ff6a60}
.brief__t{font-family:var(--head);font-weight:700;font-size:15.5px;line-height:1.8;color:#fff;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.brief__l a:hover .brief__t{text-decoration:underline;text-underline-offset:6px}
.brief__c{width:22px;height:22px;border-radius:50%;border:1.5px solid #55524c}
.brief__l li.done .brief__t{color:#8d897f}
.brief__l li.done .brief__c{background:#f3f1ec url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='3'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/13px no-repeat;border-color:#f3f1ec}
.brief__f{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:14px;font-size:13px;color:#b5b1a8}
.brief__bar{flex:1;height:4px;border-radius:4px;background:#2a2a27;overflow:hidden}
.brief__bar i{display:block;height:100%;background:#ff3b30;border-radius:4px;transition:width .4s}
.brief__f.all{flex-direction:column;align-items:flex-start;gap:2px}
.brief__f.all b{font-family:var(--head);font-size:17px;color:#fff}
.tile--feast{background:#f7e6e2}
:root[data-theme="dark"] .tile--feast{background:#2a1715}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tile--feast{background:#2a1715}}
.tile--feast .v{color:var(--red)}
@media (min-width:1021px){
  .brow{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;align-items:stretch}
  .brow .glance{grid-template-columns:1fr 1fr}
  .brow .tile{min-height:0}
}

/* daily rituals */
.daily{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dly{display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:20px;padding:22px;background:var(--card,#fff);min-height:250px;transition:border-color .15s}
:root[data-theme="dark"] .dly{background:var(--soft)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .dly{background:var(--soft)}}
a.dly:hover{border-color:var(--ink)}
.dly__k{font-size:12.5px;font-weight:700;color:var(--red)}
.dly h3{font-family:var(--head);font-size:21px;line-height:1.6;margin:0}
.dly p{margin:0;font-size:14px;color:var(--ink2);line-height:1.9}
.dly__verse{font-weight:600;font-size:15.5px!important;color:var(--ink)!important;line-height:2.1!important}
.dly__go{margin-top:auto;display:inline-flex;align-items:center;gap:6px;width:max-content;font-weight:700;font-size:14.5px;border:0;background:none;padding:6px 0 0;cursor:pointer;color:var(--ink)}
.dly__go:hover,a.dly:hover .dly__go{color:var(--red)}
.mini{display:flex;flex-direction:column;gap:3px;margin:4px 0}
.mini span{display:flex;gap:3px}
.mini i{width:14px;height:14px;border-radius:3px;background:#b9b5ac}
.mini i.s0{background:#c9c5bc}
.mini i.s1{background:#e8b021}.mini i.s2{background:var(--ink)}
.daily .game{margin:0;border:1px solid var(--line);border-radius:20px;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:12px;flex-wrap:nowrap}
.daily .game__q b{font-size:17px}
.daily .game__btns{margin-top:auto}
.daily .game__btns button{flex:1}
.daily .game__done{align-items:flex-start;margin-top:auto}

/* word game */
.wd{max-width:540px}
.wd__h{text-align:center;padding:34px 0 8px}
.wd__h h1{font-family:var(--head);font-size:clamp(30px,4vw,40px);margin:4px 0 6px;line-height:1.5}
.wd__h p{margin:0 0 10px;color:var(--ink2);font-size:14.5px}
.wd__legend{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:var(--ink2)}
.wd__legend span{display:inline-flex;align-items:center;gap:7px}
.wd__legend i{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;font-style:normal;font-family:var(--head);font-weight:700;font-size:14px}
.wd-row--demo,.wd__board .wd-row{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.wd-row--demo{width:220px;margin:6px 0}
.wd-row--demo span{aspect-ratio:1;border:2px solid var(--line);border-radius:8px;display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:18px}
.wd__board{display:grid;gap:6px;width:min(330px,100%);margin:20px auto 18px}
.wd__board span{aspect-ratio:1;border:2px solid var(--line);border-radius:8px;display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:28px;line-height:1;user-select:none}
.wd__board span.fill{border-color:var(--mute);animation:pop .12s ease-out}
@keyframes pop{50%{transform:scale(1.08)}}
.s2,.wd__board span.s2,.wd-row--demo span.s2,.wd__legend i.s2{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.s1,.wd__board span.s1,.wd-row--demo span.s1,.wd__legend i.s1{background:#e8b021;border-color:#e8b021;color:#111}
.s0,.wd__board span.s0,.wd__legend i.s0{background:#77736b;border-color:#77736b;color:#fff}
:root[data-theme="dark"] .wd__board span.s0,:root[data-theme="dark"] .wd__legend i.s0,:root[data-theme="dark"] .wd__kb button.s0{background:#3a3a37;border-color:#3a3a37;color:#cfccc4}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .wd__board span.s0,:root:not([data-theme="light"]) .wd__legend i.s0,:root:not([data-theme="light"]) .wd__kb button.s0{background:#3a3a37;border-color:#3a3a37;color:#cfccc4}}
.wd-row.flip span{animation:flip .45s ease both;animation-delay:calc(var(--i) * .2s)}
@keyframes flip{from{transform:rotateX(90deg)}to{transform:none}}
.wd-row.shake{animation:shake .4s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.wd__kb{margin:6px auto 30px;max-width:520px}
.wd-kr{display:flex;gap:5px;justify-content:center;margin-bottom:6px;direction:rtl}
.wd-kr button{flex:1;min-width:0;height:56px;border:0;border-radius:7px;background:var(--soft2);font-family:var(--head);font-weight:700;font-size:17px;cursor:pointer;display:grid;place-items:center;padding:0;transition:background .2s}
.wd-kr button:active{transform:scale(.96)}
.wd-kr button.wide{flex:1.55;font-family:var(--ui);font-size:14px}
.wd-kr button.s2{background:var(--ink);color:var(--bg)}
.wd-kr button.s1{background:#e8b021;color:#111}
.wd-kr button.s0{background:#77736b;color:#fff}
.wd__end{border:1px solid var(--line);border-radius:22px;padding:22px;margin:0 auto 18px;display:flex;flex-direction:column;gap:16px;animation:drop .3s ease-out}
.wd__end[hidden]{display:none}
.wd__res{text-align:center;display:flex;flex-direction:column}
.wd__res b{font-family:var(--head);font-size:26px;line-height:1.5}
.wd__res span{color:var(--ink2)}
.wd__stats{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;font-size:12.5px;color:var(--mute)}
.wd__stats b{display:block;font-family:var(--head);font-size:22px;color:var(--ink);line-height:1.6}
.wd__dist{display:flex;flex-direction:column;gap:5px}
.wd__dist div{display:grid;grid-template-columns:16px 1fr;gap:8px;align-items:center;font-size:13px}
.wd__dist i{display:block;background:var(--soft2);color:var(--ink);font-style:normal;font-size:12px;font-weight:700;padding:1px 8px;border-radius:4px;text-align:left}
.wd__dist i.me{background:var(--ink);color:var(--bg)}
.wd__acts{display:flex;gap:10px}
.wd__acts .btn{flex:1}

/* bottom sheet / dialog */
.sheet{position:fixed;inset:0;background:rgba(15,15,15,.55);z-index:120;display:grid;place-items:center;padding:16px;animation:fadein .2s}
@keyframes fadein{from{opacity:0}}
.sheet__p{position:relative;width:min(640px,100%);max-height:88dvh;overflow:auto;background:var(--bg);border-radius:24px;padding:34px 34px 26px;animation:up .25s ease-out}
@keyframes up{from{transform:translateY(24px);opacity:0}}
.sheet__x{position:absolute;top:14px;left:14px}
.fal__wait{display:flex;align-items:center;justify-content:center;gap:10px;padding:60px 0;color:var(--mute);font-weight:600}
.fal__wait .dia{animation:spin 1.2s linear infinite}
@keyframes spin{to{transform:rotate(405deg)}}
.fal h2{font-family:var(--head);font-size:24px;line-height:1.6;margin:4px 0 18px}
.fal__poem{display:flex;flex-direction:column;gap:14px;margin-bottom:8px}
.fal__poem .bt{display:grid;grid-template-columns:1fr 1fr;gap:4px 28px;font-size:17.5px;font-weight:600;line-height:2.1;text-align:center}
.fal__poem .bt.more{display:none}
.fal__poem.open .bt.more{display:grid}
.fal__all{border:0;background:none;cursor:pointer;padding:0;margin-bottom:6px}
.fal__sum{background:var(--soft);border-radius:14px;padding:14px 16px;margin-top:14px}
.fal__sum b{font-size:12.5px;color:var(--mute)}
.fal__sum p{margin:2px 0 0;font-size:15px;line-height:2}
.fal__f{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;color:var(--mute)}
.fal__f .src{color:var(--red);font-weight:700}

@media (max-width:1020px){
  .daily{grid-template-columns:1fr 1fr}
  .daily .game{grid-column:1/-1}
  .brow .glance{margin-top:14px}
  .wire{margin-top:34px}
}
@media (max-width:760px){
  .ds{font-size:12px}
  .ds__in{height:32px}
  .ds__g{display:none}
  .ds__fx{margin-inline-start:0;border-inline-start:1px solid #2c2c29;padding-inline-end:14px}
  .brk{gap:10px;padding:10px 12px;border-radius:12px;flex-wrap:wrap}
  .brk__t{flex:1 1 60%;font-size:15px}
  .brk__w{display:none}
  .wire__l li:nth-child(n+6){display:none}
  .wire.open .wire__l li{display:grid}
  .brief{padding:22px 18px 18px;border-radius:18px;margin:0 calc(-1*var(--g)/2)}
  .brief h2{font-size:23px}
  .brief__l a{grid-template-columns:56px 1fr 22px}
  .daily{display:flex;flex-direction:column;gap:12px}
  .dly{min-height:0;padding:18px}
  .wd__h{padding:20px 0 0}
  .wd__h p{display:none}
  .wd__legend{font-size:12px;gap:6px 12px}
  .wd__legend i{width:22px;height:22px;font-size:12px}
  .wd__board{width:min(300px,82vw);gap:5px;margin:14px auto 12px}
  .wd__board .wd-row{gap:5px}
  .wd__board span{font-size:24px}
  .wd__kb{position:sticky;bottom:calc(66px + env(safe-area-inset-bottom));background:var(--bg);padding:8px 0 4px;margin:0 calc(-1*var(--g) + 4px) 10px}
  .wd-kr{gap:4px;margin-bottom:5px}
  .wd-kr button{height:50px;font-size:15.5px;border-radius:6px}
  .wd-kr button.wide{font-size:12.5px}
  .sheet{place-items:end stretch;padding:0}
  .sheet__p{width:100%;border-radius:22px 22px 0 0;padding:28px 20px calc(24px + env(safe-area-inset-bottom));max-height:90dvh}
  .fal__poem .bt{grid-template-columns:1fr;gap:0;font-size:16.5px}
  .fal__poem .bt span:first-child{text-align:right}
  .fal__poem .bt span:last-child{text-align:left}
}

.spark{display:block;margin-top:4px}
.spark svg{width:100%;height:54px;display:block}
.spark svg polyline:first-of-type{stroke:var(--mute);stroke-width:1.2}
.tile .v.num small{font-size:13px}
@media (min-width:761px){.wd__board{width:300px}.wd-kr button{height:52px}}
@media (max-width:760px){
  .wd__h{padding-top:8px}
  .wd__h h1{font-size:24px;margin:0 0 4px}
  .wd__h .k{display:none}
  .wd__board{width:min(250px,66vw);margin:10px auto}
  .wd__board span{font-size:21px;border-radius:6px}
  .wd-kr button{height:46px}
}

/* ================= v10b: مداد من, follow, up to date ================= */
.ph-head__row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ph-head__row h1{margin:0}
.flw{height:42px;padding:0 18px;border-radius:999px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font-weight:700;font-size:14.5px;cursor:pointer;transition:all .15s;flex:none}
.flw:hover{background:var(--ink);color:var(--bg)}
.flw.on{background:var(--ink);color:var(--bg)}
.chips--pick{justify-content:flex-start;margin-top:0}
.chips--pick .add{border-style:dashed}
.mine__bar{margin-bottom:22px}
.mine__more{margin:-8px 0 22px}
.cards--4{grid-template-columns:repeat(4,1fr)!important;gap:24px}
.cards--4 .t{font-size:16px}
.uptodate{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:44px 0 0;padding:24px;border-radius:20px;background:#0f0f0f;color:#d6d3cc}
.uptodate b{font-family:var(--head);font-size:21px;color:#fff}
.uptodate .btn{margin-top:8px;background:#fff;color:#111;box-shadow:none}
@media (min-width:1021px){.wire__l li:nth-child(n+8){display:none}.wire.open .wire__l li{display:grid}}
@media (max-width:1020px){.cards--4{grid-template-columns:1fr 1fr!important}}
@media (max-width:760px){
  .cards--4{grid-template-columns:1fr!important;gap:0}
  .brief__l a{grid-template-columns:1fr 22px;gap:2px 12px}
  .brief__n{grid-column:1;grid-row:1;font-size:12px}
  .brief__t{grid-column:1;grid-row:2}
  .brief__c{grid-column:2;grid-row:1/3}
  .flw{height:38px;font-size:13.5px;padding:0 14px}
}
.uptodate{border:1px solid #2a2a27}

/* ================= v11: never crop a photo (Medad images carry their own headlines) ================= */
.ph::before,.tgm::before{content:"";position:absolute;inset:-30px;background:var(--bg,none) center/cover no-repeat;filter:blur(22px) saturate(1.15);opacity:.6;transform:scale(1.1)}
.ph img,.tgm img{object-fit:contain;z-index:1}
.ph.v::after,.tgm.v::after,.tgm em{z-index:2}
.tgrow .tgm,.tgc--ad .tgm{aspect-ratio:1}
.cover .ph{aspect-ratio:3/4}
/* phone: the lead photo shows whole, at its own shape */
@media (max-width:760px){
  .hero .ph{aspect-ratio:auto}
  .hero .ph::before{display:none}
  .hero .ph img{position:relative;inset:auto;height:auto;max-height:none}
  .tgrow .tgc{flex:0 0 78%}
}

/* ================= v12: today-in-Montreal widgets ================= */
.wgs{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.wg{--wg:var(--soft);position:relative;overflow:hidden;display:flex;flex-direction:column;gap:10px;padding:18px 20px;border-radius:20px;background:var(--wg);min-height:216px;transition:transform .2s,box-shadow .2s}
a.wg:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.08)}
.wg__h{display:flex;align-items:center;gap:9px;font-size:14px;min-height:34px}
.wg__h b{font-weight:700}
.wg__i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--bg);flex:none;color:var(--ink)}
.wg__i svg{width:19px;height:19px}
.wg__i--t{font-family:var(--head);font-weight:700;font-size:17px;color:var(--ok)}
.wg__i--sun{color:#e8a317}
.wg__m{margin-inline-start:auto;font-size:12.5px;color:var(--mute);white-space:nowrap}
.wg__pill{margin-inline-start:auto;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--bg);color:var(--mute);white-space:nowrap}
.wg__pill.up{color:var(--ok)}.wg__pill.down{color:var(--red)}
.wg__v{font-family:var(--head);font-weight:700;font-size:32px;line-height:1.3;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.wg__v small{font-family:var(--ui);font-size:13px;font-weight:600;color:var(--mute)}
.wg__chart{margin:0 -20px;height:74px}
.wg__chart svg{width:100%;height:100%;display:block}
.wg__f{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:auto;font-size:12.5px;color:var(--mute)}
.wg__f b{color:var(--ink);font-weight:700}
.wg__hrs{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.wg__hrs span{display:flex;flex-direction:column;align-items:center;gap:3px}
.wg__hrs em{font-style:normal;font-size:11.5px;color:var(--mute)}
.wg__hrs svg{width:20px;height:20px;color:var(--ink2)}
.wg__hrs b{font-size:13.5px}
.wg--al .wg__i{color:#b77900}
.wg--al.on{--wg:#fff4d6}
.wg--al.on .wg__i{background:#ffd666;color:#5c3d00}
.wg__t{margin:0;font-family:var(--head);font-weight:700;font-size:16.5px;line-height:1.85;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.wg__go{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--ink)}
a.wg--al:hover .wg__go{color:var(--red)}
.wg--feast{--wg:linear-gradient(150deg,#8a1220,#4a0a12);background:linear-gradient(150deg,#8a1220,#4a0a12);color:#fff}
.wg--feast .wg__v small,.wg--feast .wg__f{color:#f2c9c9}
.wg--feast .wg__v{font-size:44px}
.wg__art{position:absolute;left:-12px;top:-14px;width:118px;height:118px;color:#ff6b6f;opacity:.2;pointer-events:none}
.wg__bar{height:5px;border-radius:5px;background:rgba(255,255,255,.18);overflow:hidden;margin-top:auto}
.wg__bar i{display:block;height:100%;background:#ffb3b3;border-radius:5px}
.wg--feast .wg__f{margin-top:0}
:root[data-theme="dark"] .wg--al.on{--wg:#2e2510}
:root[data-theme="dark"] .wg--al.on .wg__t{color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .wg--al.on{--wg:#2e2510}}
/* briefing beside the daily rituals */
.dstack{display:flex;flex-direction:column;gap:14px}
.dstack__h h2{font-family:var(--head);font-size:clamp(22px,2.2vw,28px);line-height:1.5;margin:0}
.dstack__h span{font-size:14px;color:var(--mute)}
.dstack .dly{min-height:0;flex:1}
.brow+.game{margin-top:16px}
@media (min-width:1021px){.brow{grid-template-columns:1.25fr 1fr}}
@media (max-width:1020px){.wgs{grid-template-columns:1fr 1fr}.dstack{margin-top:24px}}
@media (max-width:760px){
  .wgs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1*var(--g));padding:2px var(--g) 6px;gap:12px}
  .wgs::-webkit-scrollbar{display:none}
  .wg{flex:0 0 80%;scroll-snap-align:start;min-height:206px;padding:16px 18px}
  .wg__chart{margin:0 -18px}
  .dstack .dly{flex:none}
}

/* ================= v13: more visual widgets, same amount of content ================= */
.wg>*{position:relative;z-index:1}
.wg__sky,.wg__warnart,.wg__art{z-index:0}
/* weather: the card is the sky */
.wg--wx{--wg:linear-gradient(160deg,#e6ebf2,#cdd6e2);background:var(--wg)}
.wg--wx.sky-sun{background:linear-gradient(160deg,#fff1cf,#fbcf86)}
.wg--wx.sky-cloud{background:linear-gradient(160deg,#eef1f6,#cfd8e4)}
.wg--wx.sky-rain{background:linear-gradient(160deg,#dde6f2,#a9bcd6)}
.wg--wx.sky-snow{background:linear-gradient(160deg,#f6f9fc,#dce6f0)}
.wg--wx.sky-night{background:linear-gradient(160deg,#22325a,#0e1631);color:#eef2ff}
.wg--wx .wg__i{background:rgba(255,255,255,.55);color:#1a1a1a}
.wg--wx.sky-night .wg__i{background:rgba(255,255,255,.12);color:#ffe9a8}
.wg--wx .wg__v small,.wg--wx .wg__hl,.wg--wx .wg__hrs em{color:#4c4a45}
.wg--wx.sky-night .wg__v small,.wg--wx.sky-night .wg__hl,.wg--wx.sky-night .wg__hrs em{color:#b9c3e0}
.wg--wx .wg__hrs{border-top-color:rgba(0,0,0,.1)}
.wg--wx.sky-night .wg__hrs{border-top-color:rgba(255,255,255,.14)}
.wg--wx .wg__hrs svg{color:inherit}
.wg__hl{font-size:12.5px;margin-top:-6px}
.wg__sky{position:absolute;left:-18px;top:-18px;width:130px;height:130px;pointer-events:none}
.wg__sky svg{width:100%;height:100%}
.sky-sun .wg__sky{color:#f59e0b;opacity:.5}
.sky-cloud .wg__sky,.sky-rain .wg__sky,.sky-snow .wg__sky{color:#fff;opacity:.85}
.sky-night .wg__sky{color:#ffe9a8;opacity:.25}
:root[data-theme="dark"] .wg--wx.sky-sun{background:linear-gradient(160deg,#4a3410,#2a1f0d);color:#fff4dc}
:root[data-theme="dark"] .wg--wx.sky-cloud,:root[data-theme="dark"] .wg--wx.sky-snow{background:linear-gradient(160deg,#2b313b,#1c2028);color:#eef1f6}
:root[data-theme="dark"] .wg--wx.sky-rain{background:linear-gradient(160deg,#1f2c40,#141b27);color:#e6eefb}
:root[data-theme="dark"] .wg--wx:not(.sky-night) .wg__v small,:root[data-theme="dark"] .wg--wx:not(.sky-night) .wg__hl,:root[data-theme="dark"] .wg--wx:not(.sky-night) .wg__hrs em{color:#b8bfca}
:root[data-theme="dark"] .wg--wx:not(.sky-night) .wg__i{background:rgba(255,255,255,.1);color:#ffd27a}
:root[data-theme="dark"] .wg--wx .wg__hrs{border-top-color:rgba(255,255,255,.12)}
:root[data-theme="dark"] .sky-cloud .wg__sky,:root[data-theme="dark"] .sky-rain .wg__sky,:root[data-theme="dark"] .sky-snow .wg__sky{opacity:.08}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .wg--wx.sky-sun{background:linear-gradient(160deg,#4a3410,#2a1f0d);color:#fff4dc}
  :root:not([data-theme="light"]) .wg--wx.sky-cloud,:root:not([data-theme="light"]) .wg--wx.sky-snow{background:linear-gradient(160deg,#2b313b,#1c2028);color:#eef1f6}
  :root:not([data-theme="light"]) .wg--wx.sky-rain{background:linear-gradient(160deg,#1f2c40,#141b27);color:#e6eefb}
  :root:not([data-theme="light"]) .wg--wx:not(.sky-night) .wg__v small,:root:not([data-theme="light"]) .wg--wx:not(.sky-night) .wg__hl,:root:not([data-theme="light"]) .wg--wx:not(.sky-night) .wg__hrs em{color:#b8bfca}
  :root:not([data-theme="light"]) .wg--wx:not(.sky-night) .wg__i{background:rgba(255,255,255,.1);color:#ffd27a}
  :root:not([data-theme="light"]) .wg--wx .wg__hrs{border-top-color:rgba(255,255,255,.12)}
  :root:not([data-theme="light"]) .sky-cloud .wg__sky,:root:not([data-theme="light"]) .sky-rain .wg__sky,:root:not([data-theme="light"]) .sky-snow .wg__sky{opacity:.08}
}
/* dollar: chart reaches the card edges, soft glow */
.wg--fx .wg__chart{height:84px;margin-bottom:-4px}
/* warning: amber stripe and a large faint sign */
.wg__stripe{position:absolute!important;top:0;right:0;left:0;height:4px;background:#f2b01e;z-index:2}
.wg__warnart{position:absolute;left:-16px;bottom:-22px;width:120px;height:120px;color:#f2b01e;opacity:.16;pointer-events:none}
.wg__warnart svg{width:100%;height:100%}
.wg--al .wg__i{background:#fff1c7;color:#9a6500}
:root[data-theme="dark"] .wg--al .wg__i{background:#3a2d0c;color:#ffcf55}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .wg--al .wg__i{background:#3a2d0c;color:#ffcf55}}
.wg>.wg__art{position:absolute}

/* ================= v14: holiday photo card ================= */
.wg--feast{background:#2a0b0e;color:#fff}
.wg>.wg__photo,.wg>.wg__shade{position:absolute;inset:0;z-index:0}
.wg__photo{width:100%;height:100%;object-fit:cover;object-position:left center;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.wg--feast:hover .wg__photo{transform:scale(1.04)}
.wg__shade{background:linear-gradient(to left,rgba(10,6,6,.82) 0%,rgba(10,6,6,.55) 45%,rgba(10,6,6,.05) 85%),linear-gradient(to top,rgba(10,6,6,.55),transparent 45%)}
.wg--feast .wg__v{font-size:44px;text-shadow:0 2px 18px rgba(0,0,0,.4)}
.wg--feast .wg__v small{color:#f1e3dc}
.wg__sub{margin:-6px 0 0;font-size:13.5px;color:#f1e3dc;font-weight:600}
.wg--feast .wg__f{margin-top:auto;color:#eadbd4}

/* ================= v15: word game colours, game screen, calendar ================= */
/* right = calm green, not in the word = soft muted red (easy on the eye) */
.s2,.wd__board span.s2,.wd-row--demo span.s2,.wd__legend i.s2,.wd-kr button.s2{background:#3f9a62;border-color:#3f9a62;color:#fff}
.s0,.wd__board span.s0,.wd__legend i.s0,.wd-kr button.s0{background:#b9817c;border-color:#b9817c;color:#fff}
.mini i.s2{background:#3f9a62}.mini i.s0{background:#dcc0bd}
.wd__dist i.me{background:#3f9a62;color:#fff}
:root[data-theme="dark"] .wd__board span.s2,:root[data-theme="dark"] .wd__legend i.s2,:root[data-theme="dark"] .wd-kr button.s2,:root[data-theme="dark"] .wd-row--demo span.s2{background:#3a8a5a;border-color:#3a8a5a;color:#fff}
:root[data-theme="dark"] .wd__board span.s0,:root[data-theme="dark"] .wd__legend i.s0,:root[data-theme="dark"] .wd-kr button.s0{background:#6b4744;border-color:#6b4744;color:#f1dedb}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .wd__board span.s2,:root:not([data-theme="light"]) .wd__legend i.s2,:root:not([data-theme="light"]) .wd-kr button.s2,:root:not([data-theme="light"]) .wd-row--demo span.s2{background:#3a8a5a;border-color:#3a8a5a;color:#fff}
  :root:not([data-theme="light"]) .wd__board span.s0,:root:not([data-theme="light"]) .wd__legend i.s0,:root:not([data-theme="light"]) .wd-kr button.s0{background:#6b4744;border-color:#6b4744;color:#f1dedb}
}
/* phone: the game takes the whole screen, so all six rows fit above the keyboard */
@media (max-width:760px){
  body.is-game .ds,body.is-game .tb{display:none}
  body.is-game{padding-bottom:0}
  body.is-game .ft{display:none}
  body.is-game .wd__h{padding-top:4px}
  body.is-game .wd__h h1{font-size:22px;margin:0 0 2px}
  body.is-game .wd__board{width:min(290px,76vw,calc((100dvh - 330px) * .83));margin:10px auto 8px}
  body.is-game .wd__kb{bottom:0;padding:8px 0 calc(8px + env(safe-area-inset-bottom));margin-bottom:0}
  body.is-game .wd__end{margin-bottom:12px}
}
/* data strip date opens the calendar */
.ds__d{color:inherit}
.ds__d svg{color:#8d897f;flex:none}
.ds__d:hover b{color:#ff8a80}
/* calendar page */
.cal__today{display:flex;flex-direction:column;gap:2px;padding:22px 24px;border-radius:20px;background:#0f0f0f;color:#d6d3cc;margin-bottom:22px}
.cal__today .lb{font-size:12.5px;font-weight:700;color:#ff6a60}
.cal__today b{font-family:var(--head);font-size:clamp(22px,2.6vw,30px);color:#fff;line-height:1.6}
:root[data-theme="dark"] .cal__today{border:1px solid #2a2a27;background:#000}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cal__today{border:1px solid #2a2a27;background:#000}}
.cal__cols{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px;align-items:start}
.cal__month,.cal__conv{border:1px solid var(--line);border-radius:22px;padding:20px;background:var(--card,#fff)}
:root[data-theme="dark"] .cal__month,:root[data-theme="dark"] .cal__conv{background:var(--soft)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cal__month,:root:not([data-theme="light"]) .cal__conv{background:var(--soft)}}
.cal__bar{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cal__ttl{text-align:center}
.cal__ttl h2{font-family:var(--head);font-size:24px;margin:0;line-height:1.5}
.cal__ttl span{font-size:13.5px;color:var(--mute)}
.cal__mode{justify-content:center;margin:12px 0 14px}
.cal__mode button{height:34px;font-size:13px;padding:0 14px}
.cal__wk,.cal__days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal__wk span{text-align:center;font-size:12.5px;font-weight:700;color:var(--mute);padding-bottom:4px}
.cd{position:relative;aspect-ratio:1/.92;border:0;border-radius:12px;background:var(--soft);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;cursor:pointer;padding:2px;transition:background .15s}
:root[data-theme="dark"] .cd{background:#262623}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cd{background:#262623}}
.cd:hover{background:var(--soft2)}
.cd b{font-family:var(--head);font-size:18px;line-height:1.4}
.cd small{font-size:10.5px;color:var(--mute);line-height:1.3;white-space:nowrap}
.cd i{position:absolute;top:6px;left:6px;width:7px;height:7px;border-radius:50%}
.cd.h-ir i{background:var(--red)}
.cd.h-qc i{background:#2f6fd6}
.cd.now{background:var(--ink);color:var(--bg)}
.cd.now small{color:inherit;opacity:.75}
.cd.sel{box-shadow:inset 0 0 0 2px var(--red)}
.cal__legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:14px;font-size:12.5px;color:var(--mute)}
.cal__legend span{display:inline-flex;align-items:center;gap:6px}
.cal__legend i{width:9px;height:9px;border-radius:50%}
.cal__legend .ir{background:var(--red)}.cal__legend .qc{background:#2f6fd6}.cal__legend .nw{background:var(--ink);border-radius:3px}
.cal__conv h2{font-family:var(--head);font-size:21px;margin:0 0 12px}
.seg{display:grid;grid-template-columns:1fr 1fr;background:var(--soft);border-radius:999px;padding:4px;gap:4px}
:root[data-theme="dark"] .seg{background:#262623}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .seg{background:#262623}}
.seg button{height:38px;border:0;border-radius:999px;background:transparent;font-weight:700;font-size:13.5px;cursor:pointer;color:var(--ink2)}
.seg button.on{background:var(--ink);color:var(--bg)}
.cal__in{display:grid;grid-template-columns:.8fr 1.4fr 1fr;gap:8px;margin:16px 0}
.cal__in label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--mute);font-weight:600}
.cal__in select,.cal__in input{height:46px;border:1px solid var(--line);border-radius:12px;background:var(--bg);padding:0 10px;font-size:15.5px;font-weight:600;width:100%;color:var(--ink)}
.cal__out{display:flex;flex-direction:column;gap:2px;padding:16px;border-radius:16px;background:var(--soft);min-height:92px}
:root[data-theme="dark"] .cal__out{background:#262623}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cal__out{background:#262623}}
.cal__out span{font-size:13px;color:var(--mute)}
.cal__out b{font-family:var(--head);font-size:21px;line-height:1.7}
.cal__out em{font-style:normal;font-size:13.5px;font-weight:700;color:var(--red)}
.cal__out .bad{color:var(--red);font-size:14.5px}
.cal__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cal__list li{display:grid;grid-template-columns:12px 1fr;gap:2px 12px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:16px}
.cal__list i{grid-row:1/4;width:10px;height:10px;border-radius:50%;align-self:start;margin-top:8px}
.cal__list li.ir i{background:var(--red)}.cal__list li.qc i{background:#2f6fd6}
.cal__list b{font-family:var(--head);font-size:16.5px}
.cal__list span{font-size:14px}
.cal__list small{font-size:12.5px;color:var(--mute)}
@media (max-width:900px){.cal__cols{grid-template-columns:1fr}.cal__list{grid-template-columns:1fr}}
@media (max-width:760px){.cal__month,.cal__conv{padding:14px;border-radius:18px}.cal__wk,.cal__days{gap:4px}.cd{border-radius:10px}.cd b{font-size:16px}.cd small{font-size:9.5px}}

/* ================= v16: word game, NYT-grade polish ================= */
.wd{position:relative}
.wd__h{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;text-align:center;padding:22px 0 4px}
.wd__h h1{font-family:var(--head);font-size:clamp(26px,3.4vw,34px);margin:0;line-height:1.4}
.wd__no{font-size:12.5px;color:var(--mute);font-weight:600}
.wd__board span{transition:transform .22s ease-in;backface-visibility:hidden}
.wd__board span.fill{animation:none;border-color:var(--mute)}
.wd__board span.pop{animation:pop .12s ease-out}
.wd__board span.turn{transform:rotateX(90deg)}
.wd__board span.turn2{animation:unturn .22s ease-out both}
@keyframes unturn{from{transform:rotateX(90deg)}to{transform:none}}
.wd__board span.jump{animation:jump .55s cubic-bezier(.3,.6,.4,1) both;animation-delay:calc(var(--i) * .09s)}
@keyframes jump{0%{transform:none}35%{transform:translateY(-22px)}65%{transform:translateY(5px)}100%{transform:none}}
.wd__praise{position:absolute;top:86px;left:50%;transform:translate(-50%,-8px);opacity:0;pointer-events:none;z-index:5;background:var(--ink);color:var(--bg);padding:8px 20px;border-radius:999px;font-family:var(--head);font-weight:700;font-size:17px;white-space:nowrap;transition:opacity .2s,transform .2s;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.wd__praise.on{opacity:1;transform:translate(-50%,0)}
.wd__praise.win{background:#3f9a62;color:#fff}
.wd__praise.lose{background:#6b4744;color:#fff}
/* finished: the keyboard turns into a "come back tomorrow" panel */
.wd__done{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:16px 18px;border-radius:20px;background:var(--soft);animation:drop .3s ease-out}
:root[data-theme="dark"] .wd__done{background:#1d1d1b}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .wd__done{background:#1d1d1b}}
.wd__done>div:first-child{display:flex;flex-direction:column}
.wd__done span,.wd__done small{font-size:12.5px;color:var(--mute)}
.wd__done b{font-family:var(--head);font-size:28px;line-height:1.3;letter-spacing:.02em}
.wd__done-b{display:flex;gap:8px}
.wd__done-b .btn{height:44px;padding:0 18px;font-size:14px}
/* tiles used in help and result */
.wd-word{display:flex;gap:6px;justify-content:center;direction:rtl}
.wd-word span{width:46px;height:46px;border:2px solid var(--line);border-radius:8px;display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:22px}
.wd-word--ex{justify-content:flex-start;margin:6px 0 4px}
.wd-word--ex span{width:40px;height:40px;font-size:19px}
.wd-word--big span{width:52px;height:52px;font-size:25px}
.wd-word.pop span{animation:unturn .35s ease-out both;animation-delay:calc(.25s + var(--i) * .12s)}
/* how to play */
.wdh .k{font-size:12.5px}
.wdh h2{font-family:var(--head);font-size:28px;margin:2px 0 4px;line-height:1.5}
.wdh__lead{font-size:17px;margin:0 0 8px}
.wdh ul{margin:0 0 14px;padding-inline-start:20px;font-size:15px;line-height:2}
.wdh h3{font-size:15px;margin:8px 0 2px}
.wdh p{margin:0 0 10px;font-size:14.5px;color:var(--ink2)}
.wdh__note{margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--soft);font-size:14px;line-height:1.9}
.wdh__go{width:100%;margin-top:16px}
/* result */
.wdr{text-align:center;display:flex;flex-direction:column;gap:16px}
.wdr__top{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 0 4px}
.wdr__badge{font-size:44px;line-height:1;animation:jump .7s .1s both}
.wdr__top h2{font-family:var(--head);font-size:30px;margin:0;line-height:1.5}
.wdr__top.win h2{color:#3f9a62}
.wdr__top p{margin:0 0 6px;color:var(--ink2)}
.wdr__h{font-size:14px;margin:0;color:var(--mute);font-weight:700}
.wdr .wd__dist{text-align:start}
.wdr__next{display:flex;flex-direction:column;align-items:center;padding:16px;border-radius:18px;background:#0f0f0f;color:#d6d3cc}
.wdr__next b{font-family:var(--head);font-size:34px;color:#fff;line-height:1.3;letter-spacing:.03em}
.wdr__next span,.wdr__next small{font-size:13px}
:root[data-theme="dark"] .wdr__next{background:#000;border:1px solid #2a2a27}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .wdr__next{background:#000;border:1px solid #2a2a27}}
.confetti{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:400}
@media (max-width:760px){
  body.is-game .wd__h{padding-top:6px}
  body.is-game .wd__h h1{font-size:23px}
  body.is-game .wd__board{width:min(300px,78vw,calc((100dvh - 300px) * .83))}
  .wd__praise{top:64px;font-size:15.5px}
  .wd__done{flex-direction:column;align-items:stretch;text-align:center}
  .wd__done>div:first-child{align-items:center}
  .wd__done-b .btn{flex:1}
  .wd-word span{width:42px;height:42px;font-size:20px}
  .wd-word--big span{width:48px;height:48px}
  .wd-word--ex span{width:36px;height:36px;font-size:17px}
}

/* v17: phone strip fits the screen (no half-cut items), story row has no box */
.ds__short{display:none}
@media (max-width:760px){
  .ds__in{justify-content:space-between;overflow:hidden}
  .ds__i{padding:0 9px}
  .ds__i:last-child{padding-inline-end:0}
  .ds__long,.ds__fx,.ds__w .ds__g{display:none}
  .ds__short{display:inline}
  .ds__d svg{display:none}
  .storybar{background:none!important;border:0;padding:0}
}
.wire__at{display:block;font-size:11.5px;color:var(--mute);margin:-4px 0 8px}