/* =============================================================
   DOKOON (دوکون / 2koon.com) — IRAN · «روزنامه» (The Daily)

   The flagship board as a 1350s Tehran newspaper front page:
   aged newsprint on a dark desk, a nastaliq nameplate between
   ruled ears, thick-and-thin head rules, one letterpress red,
   and the exchange tables set like metal type under REGION
   headers. Functional rules ported unchanged from the old sheet:
   ads collapse when unfilled, held/stale tags, bidi isolation,
   consent bar, legal/methodology pages, TEST banner.
   ============================================================= */

/* ---- FONTS (all vendored, OFL) ------------------------------- */
@font-face { font-family: "Vazirmatn"; font-style: normal; font-weight: 100 900;
  font-display: swap; src: url("vazirmatn.woff2") format("woff2"); }
@font-face { font-family: "Lalezar"; font-style: normal; font-weight: 400;
  font-display: swap; src: url("lalezar-arabic.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "Lalezar"; font-style: normal; font-weight: 400;
  font-display: swap; src: url("lalezar-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+2212; }
@font-face { font-family: "Markazi Text"; font-style: normal; font-weight: 400 700;
  font-display: swap; src: url("markazi-arabic.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "Markazi Text"; font-style: normal; font-weight: 400 700;
  font-display: swap; src: url("markazi-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+2212; }
@font-face { font-family: "Noto Nastaliq Urdu"; font-style: normal; font-weight: 400 700;
  font-display: swap; src: url("nastaliq-arabic.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }

/* ---- RESET --------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, div, span, a { margin: 0; }
a { color: inherit; }
svg, img { display: inline-block; }
.tnum { font-family: var(--font-num); font-variant-numeric: tabular-nums;
        direction: ltr; unicode-bidi: isolate; }

/* ---- THE DESK + THE SHEET ------------------------------------ */
html { background: var(--desk); }
body { font: 15px/1.45 var(--font); color: var(--ink);
       background: var(--desk); padding: 16px 10px; }
.paper { max-inline-size: var(--page-max); margin-inline: auto;
  background:
    radial-gradient(120% 90% at 50% 6%, var(--paper-hi) 0%, var(--paper) 55%,
                    #e4d5ab 88%, var(--paper-lo) 100%), var(--paper);
  box-shadow: 0 2px 14px rgba(50, 38, 12, .45),
              inset 0 0 90px rgba(122, 96, 45, .18);
  position: relative; padding: 14px 24px 16px; }
.paper::before { /* print grain */
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(#00000012 1px, transparent 1.1px),
                    radial-gradient(#5b451f0d 1.4px, transparent 1.5px);
  background-size: 3px 3px, 9px 9px; background-position: 0 0, 4px 6px; }
.paper::after { /* foxing */
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(90px 60px at 8% 12%, #8a6a2e14, #0000 70%),
    radial-gradient(140px 80px at 93% 30%, #8a6a2e11, #0000 70%),
    radial-gradient(120px 90px at 15% 85%, #8a6a2e12, #0000 70%),
    radial-gradient(70px 50px at 70% 96%, #8a6a2e14, #0000 70%); }
.page { position: relative; z-index: 1;
        border: 1.2px solid var(--ink); outline: 3px double var(--ink);
        outline-offset: 3px; padding: 10px 18px 12px; }

/* ---- TEST banner (engine flag; absent in production) --------- */
.notice { background: var(--ink); color: var(--paper-hi); font-size: 12.5px;
          font-weight: 700; text-align: center; padding: 5px 10px;
          margin-block-end: 8px; }

/* ---- MASTHEAD PLATE ------------------------------------------ */
.plate { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch;
         gap: 16px; }
.ear { border: 1.2px solid var(--ink); padding: 6px 10px; font-size: 13px;
       line-height: 1.55; align-self: center; }
.ear a { text-decoration: none; font-weight: 600; }
.ear__rule { border-block-start: 1px solid var(--ink); margin-block: 3px; }
.ear--links { text-align: start; }
.earcol { display: flex; flex-direction: column; gap: 6px; align-self: center; }
.enbtn { display: block; background: var(--ink); color: var(--paper);
         text-align: center; text-decoration: none; font-family: var(--font-num);
         font-weight: 800; font-size: 14px; letter-spacing: 2px;
         padding: 7px 12px; box-shadow: 2px 2px 0 var(--accent); }
.name { text-align: center; padding-inline: 8px; }
.brand { font: 700 56px/1.9 var(--font-name); color: var(--ink); display: block;
         text-shadow: .4px .4px 0 currentColor, -.4px -.2px 0 currentColor; }
html[lang="en"] .brand { font: 400 62px/1.35 var(--font-titr); text-shadow: none;
                         letter-spacing: 1px; }
.brand__mark { display: none; }
.flr { color: var(--ink); font-size: 14px; letter-spacing: 6px;
       margin-block-start: -12px; }
html[lang="en"] .flr { margin-block-start: 0; }
.slogan, .brand__note { font-size: 14.5px; color: var(--muted); display: block;
                        text-align: center; }

.issue { display: flex; justify-content: center; gap: 22px; font-size: 13px;
         border-block: 1px solid var(--ink); padding: 2px 0;
         margin-block-start: 8px; color: var(--muted); }
.drule { border-block-start: 4.5px solid var(--ink);
         border-block-end: 1.2px solid var(--ink); block-size: 8px;
         margin-block-start: 6px; }
.band { display: flex; justify-content: space-between; align-items: baseline;
        background: var(--accent); color: var(--paper-hi); padding: 3px 14px;
        font-size: 13.5px; margin-block-start: 7px;
        box-shadow: inset 0 0 14px #00000022; }

/* ---- تیتر یک ------------------------------------------------- */
.titr { text-align: center; padding: 14px 0 2px; position: relative; }
.kicker { font-size: 15px; color: var(--muted); letter-spacing: 1px;
          font-weight: 600; }
.unit-code { font-size: 11px; font-weight: 700; color: var(--faint);
             border: 1px solid var(--hairline); border-radius: 99px;
             padding: 0 8px; vertical-align: 2px; font-family: var(--font-num); }
.titr__h { font: 400 76px/1.08 var(--font-titr); color: var(--ink);
           text-shadow: .5px .5px 0 #241d1088; }
/* headline figures are display type, not table type: proportional digits,
   or the tabular advance scatters them across the measure at 76px */
.titr__h .tnum { font-weight: 800; font-variant-numeric: normal;
                 letter-spacing: -1px; }
.deck2 .v .tnum { font-variant-numeric: normal; }
/* The stamp sits on a PHYSICAL side on purpose: it carries a fixed rotation,
   and a logical inset would flip its position in the other language while
   the artwork cannot flip with it (the fleet's RTL ornament rule). */
.stamp { position: absolute; top: 6px; right: 4%;
         border: 2.4px solid var(--accent); border-radius: 50%;
         color: var(--accent); inline-size: 92px; block-size: 92px;
         display: flex; flex-direction: column; justify-content: center;
         align-items: center; gap: 1px; transform: rotate(-8deg);
         font-size: 12px; font-weight: 700; opacity: .85;
         background: radial-gradient(#a8341f0a, #0000 70%); }
.stamp b { font-size: 14px; }
.deckline { font-size: 15px; color: var(--muted); margin-block-start: 2px;
            display: flex; justify-content: center; align-items: baseline;
            gap: 10px; flex-wrap: wrap; }
.deckline .sentence { display: inline; }
.sentence { color: var(--muted); }
.legs { display: flex; justify-content: center; gap: 26px; font-size: 14px;
        color: var(--muted); margin-block-start: 2px; }
.legs b { color: var(--ink); }
.lede { max-inline-size: 640px; margin: 6px auto 0; font-size: 14.5px;
        color: var(--ink-soft); text-align: justify; text-align-last: center;
        line-height: 1.5; }

/* ---- CHANGE CHIPS + HONESTY TAGS ----------------------------- */
.chg { font-size: 12px; font-weight: 700; display: inline-block;
       direction: ltr; unicode-bidi: isolate; }
.chg.up { color: var(--up); } .chg.down { color: var(--down); }
.chg.flat { color: var(--flat); }
.tag-stale { font-size: 10px; font-weight: 700; color: var(--hold-fg);
             background: var(--hold-bg); border: 1px solid var(--hold-line);
             border-radius: 99px; padding: 1px 7px; margin-inline-start: 6px;
             white-space: nowrap; }

/* ---- SECOND DECK --------------------------------------------- */
.decks { display: grid; grid-template-columns: 1fr 1fr 1fr;
         border-block: 1.2px solid var(--ink); margin-block-start: 10px; }
.deck2 { text-align: center; padding: 7px 10px 5px;
         border-inline-start: 1px solid var(--ink); }
.deck2:last-child { border-inline-start: 0; }
.deck2 .k { font-size: 13.5px; color: var(--muted); }
.deck2 .v { font: 400 25px/1.25 var(--font-titr); }
.deck2 .v .tnum { font-weight: 800; font-size: 22px; }

/* ---- EXCHANGE TABLES: regions are the headers ---------------- */
.cols { display: grid; grid-template-columns: 1.05fr 1.05fr 1fr 1fr;
        margin-block-start: 10px; }
.ncol { padding-inline: 13px; border-inline-start: 1px solid var(--line-soft);
        min-inline-size: 0; }
.cols .ncol:first-child { padding-inline-start: 0; border-inline-start: 0; }
.cols .ncol:last-child { padding-inline-end: 0; }
.thead { display: flex; font-size: 11px; color: var(--faint);
         border-block-end: 1px solid var(--ink); padding: 1px 0; }
.thead .a { flex: 1; }
.thead .b { inline-size: 76px; text-align: end; }
.thead .c2 { inline-size: 26px; text-align: end; }
h2.reg { font-size: 15px; font-weight: 700; color: var(--accent);
         margin: 7px 0 1px; display: flex; align-items: center; gap: 8px; }
h2.reg small { color: var(--flat); font-weight: 400; font-size: 12px; }
h2.reg::after { content: ""; flex: 1; border-block-start: 1px solid #a8987266; }
.r { display: flex; align-items: baseline; gap: 6px; padding: 2.6px 0;
     border-block-end: 1px dotted var(--hairline); font-size: 14.5px; }
.r:last-child { border-block-end: 0; }
.r .n { flex: 1; min-inline-size: 0; }
.flag { font-size: 12px; }
.r .iso { color: var(--faint); font-size: 10px; font-family: var(--font-num); }
.r .v { font-weight: 800; font-size: 13.5px; inline-size: 76px; text-align: end; }
.r .sub { color: var(--faint); font-size: 10.5px; }
.r .c { font-size: 11px; inline-size: 26px; text-align: end; }

/* boxed tables with fleuron hangers */
.box { border: 1.2px solid var(--ink); padding: 7px 11px 5px;
       margin-block-start: 10px; position: relative; background: #f3e9cd66; }
.box--first { margin-block-start: 0; }
.box::before, .box::after { content: "❦"; position: absolute; top: -9px;
       color: var(--ink); background: var(--paper); padding: 0 4px;
       font-size: 11px; }
.box::before { right: 12px; } .box::after { left: 12px; }
.box h3 { font: 400 19px/1.4 var(--font-titr); text-align: center;
          border-block-end: 1.1px solid var(--ink); margin-block-end: 3px; }
.box__note { font-size: 11.5px; color: var(--faint); text-align: center;
             margin-block-start: 4px; }

.note { font-size: 12.5px; color: var(--muted); text-align: center;
        margin-block-start: 8px; }

/* ---- ADS: framed as era classifieds -------------------------- */
/* Outer band is spacing only; the frame belongs to the preview placeholder
   so an unfilled production slot collapses to nothing (fleet posture). */
.adband { margin-block: 10px 2px; }
.ad { overflow: hidden; text-align: center; display: flex;
      flex-direction: column; align-items: center; justify-content: center;
      gap: 3px; }
.ad--ph { border: 1.2px solid var(--ink); outline: 1px solid var(--ink);
          outline-offset: 3px; background: #f3e9cd66; min-block-size: 100px; }
.ad--ph.ad--rail { min-block-size: 250px; }
.ad__label { font-size: 9px; letter-spacing: .12em; color: var(--faint); }
.ad__hint { font-size: 11px; color: var(--faint); font-weight: 600; }
.ad-pair { display: grid; grid-template-columns: 1fr; gap: 14px; }
.only-desktop { display: none; }
.ad .adsbygoogle { inline-size: 100%; }
.ad .adsbygoogle[data-ad-status="unfilled"] { display: none !important; }

/* ---- FOLIO FOOTER -------------------------------------------- */
.frule { border-block-start: 1.1px solid var(--ink);
         border-block-end: 3px solid var(--ink); block-size: 6px;
         margin-block-start: 12px; }
.foot { font-size: 13px; color: var(--muted); padding-block-start: 6px; }
.foot__row { display: flex; justify-content: space-between; gap: 12px;
             flex-wrap: wrap; align-items: baseline; }
.foot__wordmark { font-family: var(--font-titr); color: var(--ink);
                  font-size: 16px; }
.foot__links { display: flex; gap: 14px; flex-wrap: wrap; }
.foot__links a { color: var(--ink); text-decoration: none; font-weight: 700; }
.foot__lang { border: 1px solid var(--ink); padding: 0 10px; }
.foot__disc { margin-block-start: 6px; color: var(--faint); font-size: 11.5px;
              text-align: center; }

/* ---- CONSENT ------------------------------------------------- */
.consent { position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 60;
           background: var(--ink); color: var(--paper);
           padding: 10px var(--pad); display: flex; flex-wrap: wrap;
           justify-content: space-between; align-items: center; gap: 12px;
           font-size: 12.5px; }
.consent[hidden] { display: none; }
.consent__link { color: #e8c46a; font-weight: 700; }
.consent__btns { display: flex; gap: 8px; }
.consent__btn { font: inherit; border-radius: 99px; padding: 5px 18px;
                cursor: pointer; border: 1px solid var(--faint);
                background: transparent; color: var(--paper-lo); }
.consent__btn--go { background: var(--paper-hi); color: var(--ink);
                    border-color: var(--paper-hi); font-weight: 800; }

/* ---- LEGAL / METHODOLOGY / CONTACT PAGES --------------------- */
/* Secondary pages reuse the old chrome (mast/tabs/rules); the sheet under
   them ages the same way, the running text stays sober. */
.mast { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
        justify-content: center; padding-block-start: 4px; }
.mast .brand { font-size: 40px; line-height: 1.8; }
.lang { font-weight: 800; color: var(--accent); text-decoration: none;
        border: 1.2px solid var(--accent); padding: 0 12px; }
.tabs { display: flex; justify-content: center; gap: 4px;
        margin-block-start: 6px; border-block: 1.2px solid var(--ink);
        padding: 2px 0; }
.tab { text-decoration: none; font-weight: 700; padding: 1px 14px; }
.tab.is-active { background: var(--ink); color: var(--paper); }
.rule { border-block-start: 3px solid var(--ink); margin-block-start: 6px; }
.rule--hair { border-block-start: 1.1px solid var(--ink);
              margin-block-start: 2px; }
.sec__dash { display: none; }
.legal, .meth { max-inline-size: 82ch; margin-inline: auto;
                padding-block: 14px 8px; }
.legal__title, .meth__title { font: 400 30px/1.3 var(--font-titr);
                              color: var(--ink); margin-block: 10px 2px; }
.legal__lead, .meth__intro, .meth__date, .legal__updated { color: var(--muted); }
.meth__h { font: 400 21px/1.4 var(--font-titr); color: var(--accent);
           margin-block: 16px 6px; }
.meth__sec { margin-block: 12px; }
.meth__grid { display: grid; gap: 8px; }
.legal__p, .meth__p { margin-block: 6px; }
.legal__muted { color: var(--faint); font-size: 12.5px; }
.contact-card { border: 1.2px solid var(--ink); padding: 12px 16px;
                margin-block: 10px; background: #f3e9cd66; }
.contact-card__label { color: var(--muted); font-size: 13px; }
.contact-card__mail { color: var(--accent-deep); font-weight: 800; }

/* ---- RESPONSIVE ---------------------------------------------- */
@media (max-width: 980px) {
  .cols { grid-template-columns: 1fr 1fr; }
  .cols .ncol { border-inline-start: 0; padding-inline: 4px; }
  .plate { grid-template-columns: 1fr; }
  .earcol { order: 3; }
  .titr__h { font-size: 52px; }
  .stamp { inline-size: 74px; block-size: 74px; font-size: 10.5px; right: 2%; }
  .decks { grid-template-columns: 1fr; }
  .deck2 { border-inline-start: 0; border-block-start: 1px solid var(--ink); }
  .deck2:first-child { border-block-start: 0; }
}
@media (max-width: 560px) {
  .cols { grid-template-columns: 1fr; }
  .titr__h { font-size: 40px; }
  .brand { font-size: 42px; }
  .band { flex-direction: column; gap: 2px; text-align: center; }
  .issue { flex-wrap: wrap; gap: 8px; }
}
