/* PATCH NOT FOUND — DOM type layer (owner: typography · spec TYPOGRAPHY.md · tokens js/type.js)
   Only typographic properties live here (family, size, weight, tracking, line-height, case, text colour/shadow) plus the
   "skew the plate, not the text" fix for title plates. Layout/plates stay in each module's CSS. Selectors are prefixed with :root
   so this layer wins over module CSS that is injected later at runtime.
   Faces: --f-display (Anton + Noto Sans Thai condensed 800)  big titles, numbers that are the hero of a block
          --f-ui      (Barlow SC + Plex Sans Thai) everything else: labels, body, buttons, tabs
          --f-num / --f-uinum  tabular digits for values that change (HP, prices, stats, cooldowns)
   Sizes: --t-xs 9L · sm 10 · md 12 · lg 14 · xl 17 · x2 22 · x3 28 · x4 36 · x5 48   (L = viewport height / 270, clamped 1.33–1.55 px) */

:root body{font-family:var(--f-ui);font-weight:500;font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:var(--t-sm);line-height:1.55}
:root button,:root select,:root input{font-family:var(--f-ui);font-synthesis:none}
:root button{font-weight:600;font-size:var(--t-sm);letter-spacing:.01em;line-height:1.25}
:root kbd{font-family:var(--f-ui);font-weight:700;letter-spacing:.04em}
/* Thai copy needs room for stacked vowels + tone marks */
:root p,:root li,:root dd,:root .desc{line-height:1.6}

/* ---- display: titles ---- */
:root h1{font-family:var(--f-display);font-weight:400;letter-spacing:.02em;line-height:1.05}
:root .ov h2{font-family:var(--f-display);font-weight:400;font-size:var(--t-x2);line-height:1.18;letter-spacing:.01em}
:root .eyebrow{font-family:var(--f-ui);font-weight:700;font-size:max(12px,var(--t-xs));letter-spacing:.14em;text-transform:uppercase}
:root .count{font-family:var(--f-ui);font-weight:600;font-size:max(12px,var(--t-xs))}
:root .box h3{font-family:var(--f-display);font-weight:400;font-size:var(--t-md);letter-spacing:.06em}
:root .box h3 small{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:500;letter-spacing:0}
:root .pill{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.04em}
:root .pill b{font-family:var(--f-uinum);font-weight:700}
:root ol.log li time{font-family:var(--f-uinum);font-weight:600;font-size:var(--t-xs)}
:root ul.load b{font-family:var(--f-ui);font-weight:700;font-size:var(--t-sm)}
:root ul.load kbd,:root .keys dt{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs)}
:root .armory h4{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.12em}
:root .statsum dd,:root .cardlist b{font-family:var(--f-uinum);font-weight:700}
:root .detail .sub,:root .detail .msg{font-family:var(--f-ui);font-weight:600;font-size:var(--t-xs)}
:root .zinfo h2{font-family:var(--f-ui);font-weight:700}

/* ---- RPG windows (js/progression.js) ---- */
:root .rpgm-ttl{font-family:var(--f-display);font-weight:400;font-size:var(--t-lg);letter-spacing:.06em}
:root .rpgm-seg button{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.06em;text-transform:uppercase}
:root .rpgm-seg button kbd{font-size:var(--t-xs);opacity:.8}
:root .rpgm-pts .pill b{font-size:var(--t-sm)}
:root .rp-stat b{font-family:var(--f-display);font-weight:400;font-size:var(--t-lg);letter-spacing:.04em}
:root .rp-stat .v{font-family:var(--f-num);font-weight:400;font-size:var(--t-lg)}
:root .rp-stat .d,:root .rp-skc span,:root .rp-side{font-size:var(--t-xs);line-height:1.5}
:root .rp-der{font-size:var(--t-xs)}
:root .rp-der dd{font-family:var(--f-uinum);font-weight:700;font-size:var(--t-sm)}
:root .rp-load>b,:root .rp-br,:root .rp-side .tag{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase}
:root .rp-slot kbd{font-size:var(--t-xs)}
:root .rp-skc b,:root .rp-side .card h4{font-family:var(--f-ui);font-weight:700;font-size:var(--t-sm)}
:root .rp-skc .lv{font-family:var(--f-uinum);font-weight:700;font-size:var(--t-xs)}
:root .rp-mid .nm{font-family:var(--f-display);font-weight:400;font-size:var(--t-lg)}
:root .rp-msg{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs)}
:root .rp-qrow b{font-family:var(--f-uinum);font-weight:700}
:root .tile{font-family:var(--f-ui);font-weight:700}
:root .tile .pr{font-family:var(--f-uinum)}
:root .eqs i{font-family:var(--f-ui);font-weight:600;font-size:var(--t-xs)}

/* ---- market / refine (js/market.js, js/loot.js) ---- */
:root .sh-card b{font-weight:700;font-size:var(--t-sm)}
:root .sh-card small,:root .sh-note{font-size:var(--t-xs);line-height:1.5}
:root .sh-card .pr{font-family:var(--f-num);font-weight:400;font-size:var(--t-md);letter-spacing:.02em}
:root .sh-card .ic{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs)}
:root .sh-wal .pill.ot{font-size:var(--t-xs)}
:root .sh-msg{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs)}
:root .rfbox h3{font-family:var(--f-display);font-weight:400;font-size:var(--t-lg);letter-spacing:.06em}
:root .rfnm{font-weight:700;font-size:var(--t-sm)}
:root .rfsub{font-family:var(--f-ui);font-weight:600;font-size:var(--t-xs)}
:root .rfbig{font-family:var(--f-num);font-weight:400;font-size:var(--t-x2);letter-spacing:.04em}
:root .rfres{font-family:var(--f-display);font-weight:400;font-size:var(--t-xl)}

/* ---- run card draft (js/run.js) ---- */
:root .runov h3{font-family:var(--f-display);font-weight:400;font-size:var(--t-lg);letter-spacing:.05em}
:root .runov .sub{font-family:var(--f-ui);font-weight:600;font-size:var(--t-xs)}
:root .runcard i{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.08em}
:root .runcard b{font-family:var(--f-ui);font-weight:700;font-size:var(--t-md);line-height:1.3}
:root .runcard span{font-size:var(--t-xs);line-height:1.5}
:root .runcard kbd{font-family:var(--f-num);font-weight:400;font-size:var(--t-sm)}
:root .runbuild{font-size:var(--t-xs)}

/* ---- lift directory + quick menu (js/menu_ui.js) ---- */
:root .l2-ttl{font-family:var(--f-display);font-weight:400;letter-spacing:.03em}
:root .l2-ttl small{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.16em}
:root .l2-lv{font-family:var(--f-num);font-weight:400}
:root .l2-lv span{font-family:var(--f-ui);font-weight:600;font-size:var(--t-xs)}
:root .l2-nm b{font-family:var(--f-ui);font-weight:700;font-size:var(--t-sm);line-height:1.12}
:root .l2-nm small{font-family:var(--f-ui);font-weight:600;font-size:var(--t-xs);letter-spacing:.06em;line-height:1.05}
:root .l2-st{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.06em}
:root .l2-no{font-family:var(--f-display)}
:root #ov-map.lift2 .zinfo{font-size:var(--t-xs)}
:root #ov-map.lift2 .zinfo .eyebrow{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);letter-spacing:.06em}
:root #ov-map.lift2 .zinfo h2{font-family:var(--f-ui);font-weight:700;font-size:var(--t-lg);line-height:1.25}
:root #ov-map.lift2 .zinfo .zlv{font-family:var(--f-ui);font-weight:700;font-size:var(--t-sm);letter-spacing:.02em}
:root #ov-map.lift2 .zinfo .chip,:root #ov-map.lift2 .zinfo .count{font-family:var(--f-ui);font-size:var(--t-xs)}
:root #ov-map.lift2 .zinfo .btns button{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs);line-height:1.2}
:root #ov-map.lift2 .zinfo #b-enter{font-family:var(--f-display);font-weight:400;font-size:var(--t-md);letter-spacing:.03em;line-height:1.15}
:root .qmb kbd{font-family:var(--f-num);font-weight:400}
:root .qmb .tip,:root #qm-toast{font-family:var(--f-ui);font-weight:700;font-size:var(--t-xs)}

/* ---- pause / touch (js/mobile_ui.js) ---- */
:root .mp-ttl{font-family:var(--f-display);font-weight:400;font-size:var(--t-lg);letter-spacing:.06em}
:root #touch .tb.sk .cdt{font-family:var(--f-num);font-weight:400;font-size:var(--t-md);text-shadow:var(--ts-outline)}
:root #m-rotate{font-family:var(--f-ui);font-weight:700;font-size:var(--t-md)}

/* ---- skew the plate, not the text (ART_BIBLE §8.1): title plates keep their slant on a ::before, the letters stand upright ---- */
:root .rpgm-ttl,:root .rp-br,:root .mp-ttl,:root .rfbox h3,:root .runov h3,:root .colttl{transform:none;position:relative;isolation:isolate;background:none}
:root .rpgm-ttl::before,:root .rp-br::before,:root .mp-ttl::before,:root .rfbox h3::before,:root .colttl::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--blood,#d0101e);transform:skewX(-12deg)}
:root .runov h3::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--blood,#d0101e) url(../art/ui/run_header.webp) center/100% 100% no-repeat;transform:skewX(-12deg)}
:root .l2-ttl,:root .l2-lv,:root .rp-mid .nm,:root .rfres{transform:none}

/* ---- lettering art (GPT, art/ui/logo_*): the logo is an image, not a font ---- */
:root h1.ob-logo{margin:0;line-height:0}
:root h1.ob-logo img{display:block;height:calc(var(--L) * 26);width:auto;max-width:min(46vw,520px);object-fit:contain}
:root .ob-logo-title{display:block;width:min(260px,48%);height:auto;margin:0 0 8px -4px;filter:drop-shadow(4px 4px 0 rgba(0,0,0,.6))}
@media (max-height:420px){:root .ob-logo-title{width:min(180px,34%);margin-bottom:4px}}

/* ---- sweep r6 (TYPOGRAPHY.md §12): sizes the audit found below the 9 L floor, truncation on 667-wide phones ---- */
:root small{font-size:inherit}                         /* UA `smaller` dropped every <small> under the floor: size comes from the role */
:root #ob-opts .lab small,:root .pill small,:root .rpgm small{font-size:var(--t-xs)}
:root .qmb .bd,:root .qmb .bd i{font-family:var(--f-uinum);font-weight:700;font-size:max(13px,calc(12px / var(--hud-s,1)));line-height:1}
:root #ov-map.lift2 .zinfo .eyebrow{white-space:normal;line-height:1.2}
:root #ov-map.lift2 .zstats dd{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
:root .l2-ttl small{display:block;margin-top:.25em}
@media (max-width:760px){
  :root .l2-nm b{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:var(--t-xs);line-height:1.15}
  :root .l2-nm small{display:none}                    /* English department name: shown in the info card's eyebrow instead */
  :root #ov-map.lift2 .zinfo #b-enter{font-size:var(--t-sm)}
  :root #ov-map.lift2 .zinfo .btns button{letter-spacing:0;line-height:1.1}
}
@media (max-height:440px){ /* phones in landscape: the info card has no room to wrap (its buttons would drop off) */
  :root #ov-map.lift2 .zinfo .eyebrow,:root #ov-map.lift2 .zstats dd{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ---- touch devices: no keyboard hints (tester PT-043) — key caps, the Autopilot T/Y line, mouse-only help ---- */
:root.ob-touch kbd,:root.ob-touch #h-auto small,:root.ob-touch .only-mouse{display:none!important}
:root:not(.ob-touch) .only-touch{display:none!important}

/* chat tokens (online/chat-ui, 2026-10-29): channel colours measured on #0f0d15 (all >= 8:1) — always pair with the 3-letter tag + icon, never colour alone; player text uses --f-chat (never --f-display, never uppercase) */
:root{--ch-all:#8fd1ff;--ch-party:#6fdc8c;--ch-whisper:#ff7ad9;--ch-sys:#ffb347;--f-chat:var(--f-ui),"Noto Color Emoji","Segoe UI Emoji","Apple Color Emoji",sans-serif}
