/* 3Kingdoms Online SV.Yaksa site (htdocs/yaksa/): loaded AFTER ../css/site.css (+ dbx.css) on every page.
   Look: black lacquer + deep red + temple gold, Thai kranok ornaments (img/orn/*.svg), slow rising embers (js/embers.js).
   Part 1 = dark coverage of every Classic component (cream/parchment of site.css, dbx.css, explorer, market, top-up ...);
   it started as the PVP skin (same component list) with a new palette + fonts.  Part 2 = the Yaksa layer (ornaments,
   header/banner/panels/buttons redesign).  Part 3 = the home page (body.yk-home).  No inline styles needed anywhere. */
:root {
  --ink: #070303; --ink-2: #120505; --ink-3: #1f0807;
  --lacquer: #5a0606; --lacquer-2: #9b0f0b; --lacquer-3: #d81f12;
  --gold: #f2b544; --gold-2: #ffd98a; --gold-3: #a8641a;
  --blood: #b30d0d; --ember: #ff5a1f; --molten: #ffb22e;
  --text: #f6e7d2; --muted: #c9a68f; --line: rgba(230, 70, 40, .32);
}
body.theme-yaksa {
  --paper: #f6e7d2; --paper-2: #ead2b4; --paper-ink: #f3e3cc; --paper-muted: #c9a68f;
  --muted: #c9a68f; --text: #f6e7d2; --line: rgba(230, 90, 45, .3);
  --font-head: 'Pridi', 'Sarabun', serif;
  --yk-cut: 12px;
  --yk-panel: linear-gradient(170deg, #2a0807 0%, #180504 45%, #0e0303 100%);
  --yk-card: linear-gradient(#230807, #130404);
  --yk-card-hi: linear-gradient(#3a0c09, #1c0605);
  --yk-goldline: #c98a2c;
  --yk-blood: linear-gradient(#e0301c, #9b0f0b 55%, #5a0606);
  --yk-head: linear-gradient(#7d0a0c, #3c0407 70%, #2a0305);
  --yk-in: #0c0404;
  color: var(--text);
  background-color: var(--ink);
  background-image:
    radial-gradient(ellipse at 50% -12%, rgba(200, 20, 10, .42), transparent 60%),
    radial-gradient(circle at 85% 105%, rgba(255, 140, 30, .12), transparent 45%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .05 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E"),
    repeating-linear-gradient(135deg, rgba(255, 60, 30, .015) 0 2px, transparent 2px 9px);
  background-attachment: fixed;
}
body.theme-yaksa { overflow-x: hidden; }
body.theme-yaksa a { color: var(--gold-2); }
body.theme-yaksa a:hover { color: #fff; }
/* embers canvas (js/fx.js): z-index -1 = above the body background (it paints on the root), below all page content */
#embers { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
body.theme-yaksa #embers { z-index: -1; opacity: .85; }

/* ---------- header + glow */
body.theme-yaksa .site-head { background: linear-gradient(rgba(42, 3, 3, .97), rgba(18, 2, 2, .96) 70%, rgba(8, 1, 1, .95)); border-bottom: 1px solid rgba(255, 60, 30, .45); box-shadow: 0 6px 26px rgba(160, 10, 5, .35), 0 1px 0 rgba(255, 140, 60, .15) inset; }
body.theme-yaksa .site-head::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: linear-gradient(90deg, transparent, var(--ember), var(--molten), var(--ember), transparent); opacity: .9; animation: yk-glow 3.4s ease-in-out infinite; }
@keyframes yk-glow { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { body.theme-yaksa .site-head::after { animation: none; } }
.yk-logo { height: 46px !important; width: auto; max-width: 100%; filter: drop-shadow(0 0 10px rgba(255, 40, 20, .6)) drop-shadow(0 2px 3px #000) !important; }
.yk-logo-foot { height: 56px; width: auto; filter: drop-shadow(0 0 8px rgba(255, 40, 20, .45)); }
body.theme-yaksa .nav a, body.theme-yaksa .nav .drop > span { color: #f3dcc0; font-family: 'Pridi', 'Sarabun', serif; font-weight: 500; }
body.theme-yaksa .nav a:hover, body.theme-yaksa .nav a.on, body.theme-yaksa .nav .drop:hover > span, body.theme-yaksa .nav .drop.on > span { color: #fff; background: linear-gradient(rgba(220, 40, 20, .32), rgba(220, 40, 20, .06)); box-shadow: inset 0 -2px 0 var(--ember); }
body.theme-yaksa .nav .menu { background: linear-gradient(#1c0505, #0c0202); border: 1px solid var(--yk-goldline); box-shadow: 0 12px 30px rgba(0, 0, 0, .8), 0 0 18px rgba(200, 20, 10, .3); }
body.theme-yaksa .nav .menu a:hover { background: rgba(220, 40, 20, .3); }
body.theme-yaksa .burger { color: var(--gold-2); background: rgba(0, 0, 0, .45); border: 1px solid var(--gold-3); border-radius: 4px; }
@media (max-width: 1140px) {
  body.theme-yaksa .nav { background: linear-gradient(#170303, #0a0101); border-top: 1px solid rgba(255, 60, 30, .35); box-shadow: 0 14px 30px rgba(0, 0, 0, .8); }
  body.theme-yaksa .nav .menu { background: none; border: 0; box-shadow: none; }
}
/* db tab bar */
body.theme-yaksa .dbtabs { background: linear-gradient(#1a0404, #0b0202); border-bottom: 1px solid rgba(255, 60, 30, .35); }
body.theme-yaksa .dbtabs a { color: #ecd3b2; font-family: 'Pridi', 'Sarabun', serif; }
body.theme-yaksa .dbtabs a:hover { background: rgba(220, 40, 20, .18); color: #fff; }
body.theme-yaksa .dbtabs a.on { color: #fff; background: linear-gradient(rgba(220, 40, 20, .38), rgba(220, 40, 20, .08)); box-shadow: inset 0 -3px 0 var(--ember); }

/* ---------- banner + titles */
body.theme-yaksa .banner { border-bottom: 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), 62% 100%, 58% calc(100% - 12px), 0 calc(100% - 26px)); }
body.theme-yaksa .banner::before { filter: brightness(.36) saturate(.6) sepia(.4) hue-rotate(-20deg); }
body.theme-yaksa .banner::after { background: linear-gradient(transparent 35%, var(--ink)), radial-gradient(ellipse at 50% 30%, rgba(200, 20, 10, .4), transparent 65%); }
body.theme-yaksa .banner h1, body.theme-yaksa .hub h1 { font-family: 'Pridi', 'Sarabun', serif; font-weight: 800; letter-spacing: .3px; color: #fff1d8; text-shadow: 0 0 2px #fff, 0 0 18px rgba(255, 90, 30, .9), 0 0 44px rgba(255, 30, 10, .55), 0 4px 0 #3a0202; }
body.theme-yaksa .banner p { color: #f0d3b4; text-shadow: 0 2px 6px #000; }
body.theme-yaksa .title h2, body.theme-yaksa .dbx h2.sec, body.theme-yaksa h2.sec, body.theme-yaksa .hub h2 { font-family: 'Pridi', 'Sarabun', serif; font-weight: 700; color: var(--gold-2); text-shadow: 0 0 16px rgba(255, 70, 20, .6), 0 3px 0 #2a0101; }
body.theme-yaksa .title::after { background: linear-gradient(90deg, transparent, var(--ember) 30%, var(--molten) 50%, var(--ember) 70%, transparent) center / 100% 2px no-repeat; height: 6px; filter: drop-shadow(0 0 6px rgba(255, 80, 20, .8)); }
body.theme-yaksa .title .sub, body.theme-yaksa .dbx .note { color: var(--muted); }
body.theme-yaksa h1, body.theme-yaksa h2, body.theme-yaksa h3 { font-family: 'Pridi', 'Sarabun', serif; font-weight: 600; }

/* ---------- panels: dark blood red, gold rim, cut corners (tl + br) with gold diagonals */
body.theme-yaksa .panel, body.theme-yaksa .panel.paper, body.theme-yaksa .modal .box, body.theme-yaksa .dbx .card,
body.theme-yaksa .fbox, body.theme-yaksa .wp .box, body.theme-yaksa .rc-box, body.theme-yaksa .s-shopcard, body.theme-yaksa .tu-scroll, body.theme-yaksa .tu-rates, body.theme-yaksa .mb-sellbox, body.theme-yaksa .stats {
  color: var(--text);
  border: 1px solid var(--yk-goldline);
  border-radius: 0;
  background:
    linear-gradient(to bottom right, transparent calc(50% - 1px), var(--gold) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)) top left / var(--yk-cut) var(--yk-cut) no-repeat border-box,
    linear-gradient(to top left, transparent calc(50% - 1px), var(--gold) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)) bottom right / var(--yk-cut) var(--yk-cut) no-repeat border-box,
    radial-gradient(ellipse at 50% 0%, rgba(200, 30, 15, .22), transparent 60%) border-box,
    var(--yk-panel) border-box;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .7), inset 0 0 36px rgba(120, 10, 5, .35), 0 10px 30px rgba(0, 0, 0, .6);
  clip-path: polygon(var(--yk-cut) 0, 100% 0, 100% calc(100% - var(--yk-cut)), calc(100% - var(--yk-cut)) 100%, 0 100%, 0 var(--yk-cut));
}
body.theme-yaksa .panel .corner { display: none; }
body.theme-yaksa .panel h3, body.theme-yaksa .panel.paper h3, body.theme-yaksa .feat h3 { color: var(--gold-2); text-shadow: 0 0 10px rgba(255, 70, 20, .45); }
body.theme-yaksa .panel a, body.theme-yaksa .panel.paper a { color: var(--gold-2); }
body.theme-yaksa .panel a:hover { color: #fff; }
body.theme-yaksa .panel a.btn, body.theme-yaksa .panel .btn { color: #fff3dc; }
body.theme-yaksa .panel p, body.theme-yaksa .panel .steps .step p, body.theme-yaksa .step p { color: #ead8c4; }
body.theme-yaksa .panel .muted, body.theme-yaksa .panel .meta, body.theme-yaksa .panel .sub, body.theme-yaksa .panel .hint, body.theme-yaksa .panel p[style*="muted"], body.theme-yaksa .muted { color: var(--muted); }
body.theme-yaksa .panel [style*="color:var(--muted)"], body.theme-yaksa .panel [style*="color:var(--paper-2)"] { color: var(--muted) !important; }
body.theme-yaksa .panel-head, body.theme-yaksa .panel.paper .panel-head { background: var(--yk-head); border-bottom: 1px solid var(--gold); box-shadow: 0 1px 0 rgba(255, 120, 40, .25), 0 6px 16px rgba(0, 0, 0, .4); }
body.theme-yaksa .panel-head h3, body.theme-yaksa .panel .panel-head a, body.theme-yaksa .panel-head .more { color: var(--gold-2); text-shadow: 0 0 12px rgba(255, 70, 20, .7), 0 2px 0 #2a0101; }
body.theme-yaksa .step::before, body.theme-yaksa .panel .step::before { background: radial-gradient(circle at 35% 30%, #ff5a32, #9b0f0b 60%, #4a0404); border: 2px solid var(--gold); box-shadow: 0 0 14px rgba(255, 60, 20, .6); color: #fff3dc; }
body.theme-yaksa .step h3 { color: var(--gold-2); }
body.theme-yaksa .news li, body.theme-yaksa .panel:not(.paper) .news li { border-bottom-color: rgba(230, 90, 45, .25); }
body.theme-yaksa .news .d, body.theme-yaksa .panel:not(.paper) .news .d { color: var(--muted); }
body.theme-yaksa .feat b { color: #fff1dc; }
body.theme-yaksa .feat p { color: #ead8c4; }
body.theme-yaksa .feat:hover { box-shadow: 0 0 0 1px var(--gold), 0 0 26px rgba(255, 60, 20, .45); }
body.theme-yaksa .cls-card { background: var(--yk-card); border-color: var(--yk-goldline); color: var(--text); }
body.theme-yaksa .cls-card h3 { color: var(--gold-2); }
body.theme-yaksa .cls-card p, body.theme-yaksa .cls-row p, body.theme-yaksa .cls-row h2 small { color: #ead8c4; }
body.theme-yaksa .stat b { color: var(--gold-2); text-shadow: 0 0 12px rgba(255, 80, 20, .55); }
body.theme-yaksa .empty, body.theme-yaksa .panel .empty { color: var(--muted); }
body.theme-yaksa .dl dt { color: var(--muted); }
body.theme-yaksa .dl dd { color: var(--text); }
body.theme-yaksa .desc, body.theme-yaksa .dbx .desc { background: rgba(0, 0, 0, .35); border-left: 3px solid var(--ember); color: #ead8c4; }
body.theme-yaksa .dbx .desc.in { color: var(--gold); }

/* ---------- tables */
body.theme-yaksa .tbl th, body.theme-yaksa .panel.paper .tbl th, body.theme-yaksa .solgrid th.t, body.theme-yaksa .soltbl th, body.theme-yaksa .rc-tbl th, body.theme-yaksa .s-tbl th, body.theme-yaksa .tu-rates th {
  color: var(--gold-2); background: linear-gradient(#6e080b, #33030a); font-family: 'Pridi', 'Sarabun', serif; font-weight: 500; border-bottom: 1px solid var(--gold-3); }
body.theme-yaksa .tbl td, body.theme-yaksa .panel.paper .tbl td { color: var(--text); border-bottom-color: rgba(230, 90, 45, .2); }
body.theme-yaksa .tbl tr:nth-child(even) td { background: rgba(255, 60, 30, .035); }
body.theme-yaksa .tbl tr:hover td { background: rgba(255, 70, 30, .1); }
body.theme-yaksa .tbl.mon td:first-child { color: #fff1dc; }
body.theme-yaksa .tbl.mon td[style*="muted"], body.theme-yaksa .tbl.mon td[style*="font-size:13px"] { color: var(--muted) !important; }
body.theme-yaksa .solgrid td { border-left-color: rgba(230, 90, 45, .2); }
body.theme-yaksa .mthumb { background: rgba(0, 0, 0, .6); border-color: var(--gold-3); }
/* dbx (shops / craft / npcs / mall / skills / boxes / maps) */
body.theme-yaksa .dbx .tblp .tbl td, body.theme-yaksa .dbx .tblp .desc, body.theme-yaksa .dbx .tblp .talk, body.theme-yaksa .dbx .talk { color: var(--text); }
body.theme-yaksa .dbx .tblp .tbl td.nm, body.theme-yaksa .dbx .tblp .tbl .nm, body.theme-yaksa .dbx .tbl td.nm, body.theme-yaksa .dbx .tbl .nm { color: var(--gold-2); }
body.theme-yaksa .dbx .tblp .muted, body.theme-yaksa .dbx .tblp .where, body.theme-yaksa .dbx .where, body.theme-yaksa .dbx .meta { color: var(--muted); }
body.theme-yaksa .dbx .tblp .desc.in { color: var(--gold); }
body.theme-yaksa .dbx .tblp b { color: #ffcf8a; }
body.theme-yaksa .dbx .pill, body.theme-yaksa .dbx .tblp .pill { background: rgba(255, 90, 40, .12); border-color: rgba(240, 160, 70, .45); color: #f3dcc0; }
body.theme-yaksa .dbx .pill.red, body.theme-yaksa .dbx .tblp .pill.red { background: #a3121a; border-color: #ff7a50; color: #fff; }
body.theme-yaksa .dbx .tblp tr.open td, body.theme-yaksa .dbx tr.open td { background: rgba(255, 70, 30, .14); }
body.theme-yaksa .dbx .tblp tr.detail td, body.theme-yaksa .dbx tr.detail td { background: rgba(0, 0, 0, .4); }
body.theme-yaksa .dbx ul.list > li { border-bottom-color: rgba(230, 90, 45, .22); }
body.theme-yaksa .mvlists h4 { color: var(--gold-2); }
body.theme-yaksa .mapcard .mapfacts, body.theme-yaksa .mapcard .copies, body.theme-yaksa .plotkey, body.theme-yaksa .ptlist .xy { color: var(--muted); }
body.theme-yaksa .ptlist li { border-bottom-color: rgba(230, 90, 45, .22); }
body.theme-yaksa .mapview .mvlayers .chip { background: rgba(30, 6, 5, .9); color: #f3dcc0; border-color: var(--gold-3); }
body.theme-yaksa .mapview .mvlayers .chip.on { background: var(--yk-blood); color: #fff; border-color: var(--gold); }

/* ---------- toolbar, chips, inputs */
body.theme-yaksa input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=submit]):not([type=button]),
body.theme-yaksa select, body.theme-yaksa textarea,
body.theme-yaksa .toolbar input, body.theme-yaksa .toolbar select, body.theme-yaksa .form input {
  background: var(--yk-in) !important; color: #fff1dc !important; border: 1px solid var(--gold-3) !important; box-shadow: inset 0 2px 6px rgba(0, 0, 0, .7); }
body.theme-yaksa input:focus, body.theme-yaksa select:focus, body.theme-yaksa textarea:focus { outline: none; border-color: var(--gold) !important; box-shadow: inset 0 2px 6px rgba(0, 0, 0, .7), 0 0 0 3px rgba(255, 90, 30, .28) !important; }
body.theme-yaksa input::placeholder, body.theme-yaksa textarea::placeholder { color: #9c7d6a !important; }
body.theme-yaksa select option { background: #140505; color: #fff1dc; }
body.theme-yaksa .form label { color: #f3dcc0; }
body.theme-yaksa .form .hint { color: var(--muted); }
body.theme-yaksa .cap img { border-color: var(--gold-3); }
body.theme-yaksa .toolbar .count { color: var(--muted); }
body.theme-yaksa .chip, body.theme-yaksa .panel .chip { background: rgba(40, 8, 6, .9); color: #f3dcc0; border-color: rgba(240, 170, 70, .45); }
body.theme-yaksa .chip.red, body.theme-yaksa button.chip.on, body.theme-yaksa .chip.on { background: var(--yk-blood); color: #fff3dc; border-color: var(--gold); box-shadow: 0 0 10px rgba(255, 60, 20, .4); }
body.theme-yaksa .tier-legend .chip b { color: var(--gold-2); }

/* ---------- item / soldier / boss / map cards */
body.theme-yaksa .item, body.theme-yaksa .sol, body.theme-yaksa .sol2, body.theme-yaksa .sol3, body.theme-yaksa .drop-list .item, body.theme-yaksa .chain .sol3.royal {
  background: var(--yk-card); border-color: rgba(240, 170, 70, .4); color: var(--text); }
body.theme-yaksa .item:hover, body.theme-yaksa .item:focus-visible, body.theme-yaksa .sol:hover, body.theme-yaksa .sol2:hover, body.theme-yaksa .sol3:hover {
  background: var(--yk-card-hi); border-color: var(--ember); box-shadow: 0 0 0 1px var(--ember), 0 0 18px rgba(255, 60, 20, .45); }
body.theme-yaksa .chain .sol3.royal { border-color: var(--gold); box-shadow: 0 0 12px rgba(255, 180, 60, .25); }
body.theme-yaksa .item .nm, body.theme-yaksa .sol .nm, body.theme-yaksa .sol2 .nm, body.theme-yaksa .sol3 .nm, body.theme-yaksa .drop-list .item .nm { color: #fff1dc; }
body.theme-yaksa .item .sub, body.theme-yaksa .sol .sub, body.theme-yaksa .sol2 .sub, body.theme-yaksa .sol3 .sub, body.theme-yaksa .drop-list .item .sub { color: var(--muted); }
body.theme-yaksa .sol3 .need, body.theme-yaksa .sol2 .need { color: #ff9a7a; border-top-color: rgba(230, 90, 45, .3); }
body.theme-yaksa .sol3 .need a, body.theme-yaksa .sol2 .need a, body.theme-yaksa .promo { color: var(--gold-2); }
body.theme-yaksa .icon { border-color: var(--gold-3); background-color: #0b0303; }
body.theme-yaksa .chain { background: rgba(0, 0, 0, .3); border-color: rgba(230, 90, 45, .3); }
body.theme-yaksa .chain .arr { color: var(--ember); }
body.theme-yaksa .sol .tier, body.theme-yaksa .boss-card .lv, body.theme-yaksa .mapcard .lv { background: var(--yk-blood); border-color: var(--gold); color: #fff3dc; }
body.theme-yaksa .boss-card .top .nm, body.theme-yaksa .mapcard .top .nm { color: var(--gold-2); text-shadow: 0 0 10px rgba(255, 70, 20, .5); }
body.theme-yaksa .boss-card .meta, body.theme-yaksa .mapcard .meta, body.theme-yaksa .boss-card .maps, body.theme-yaksa .mapcard .maps { color: #e2c8ab; }
body.theme-yaksa .boss-card .maps b { color: #ff9a7a; }
body.theme-yaksa .bosspic { background: radial-gradient(circle at 50% 70%, rgba(220, 40, 20, .45), rgba(20, 4, 3, .8) 70%); border-color: var(--gold-3); }
body.theme-yaksa .boss { color: #ff7a5a; border-color: #ff7a5a; }
body.theme-yaksa .solaura-pic figcaption { color: #f3dcc0; }

/* ---------- buttons: red-gold blades */
body.theme-yaksa .btn, body.theme-yaksa .btn.big, body.theme-yaksa .btn-reg, body.theme-yaksa .panel .btn {
  color: #fff3dc; background: var(--yk-blood); border: 1px solid #ff9a5a; border-radius: 3px; text-shadow: 0 1px 0 #3a0202;
  box-shadow: inset 0 1px 0 rgba(255, 210, 150, .45), 0 4px 14px rgba(0, 0, 0, .6);
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); font-family: 'Pridi', 'Sarabun', serif; font-weight: 600; }
body.theme-yaksa .btn:hover { color: #fff; filter: brightness(1.15); box-shadow: inset 0 1px 0 rgba(255, 220, 160, .6), 0 0 22px rgba(255, 60, 20, .75); }
body.theme-yaksa .btn.ghost { background: rgba(14, 3, 3, .75); border-color: var(--gold-3); color: var(--gold-2); }
body.theme-yaksa .btn.gold { color: #2c1003; background: linear-gradient(#fff3b8, #f2b544 50%, #9c5a12); border-color: #fff0b0; text-shadow: 0 1px 0 rgba(255, 255, 255, .45); }
body.theme-yaksa .nav .btn-reg { clip-path: none; }

/* ---------- alerts, modal, pager */
body.theme-yaksa .alert.err, body.theme-yaksa .tu-res.err, body.theme-yaksa .hub-err { background: rgba(120, 8, 8, .55) !important; color: #ffc0b0 !important; border: 1px solid #e0301c !important; }
body.theme-yaksa .alert.ok, body.theme-yaksa .tu-res.ok { background: rgba(16, 70, 34, .55) !important; color: #b4f3c4 !important; border: 1px solid #3fa064 !important; box-shadow: none; }
body.theme-yaksa .modal { background: rgba(0, 0, 0, .78); }
body.theme-yaksa .modal .x { color: var(--gold-2); background: rgba(0, 0, 0, .5); border: 1px solid var(--gold-3); }
body.theme-yaksa .pager a, body.theme-yaksa .pager button, body.theme-yaksa .pagination a, body.theme-yaksa .pagination button { background: rgba(30, 6, 5, .9); color: #f3dcc0; border: 1px solid var(--gold-3); }
body.theme-yaksa .pager .on, body.theme-yaksa .pagination .on, body.theme-yaksa .pager .active { background: var(--yk-blood); color: #fff; border-color: var(--gold); }

/* ---------- footer */
body.theme-yaksa .site-foot { background: linear-gradient(#140303, #060101); border-top: 1px solid var(--blood); box-shadow: 0 -1px 0 rgba(255, 120, 40, .2), 0 -10px 30px rgba(120, 10, 5, .25); color: var(--muted); }
body.theme-yaksa .site-foot a { color: #f0d3b4; }
body.theme-yaksa .site-foot a:hover { color: #fff; }

/* ---------- page styles: festival, city war, red cliff */
body.theme-yaksa .gifts .it, body.theme-yaksa .cal div, body.theme-yaksa .rw .it { background: rgba(30, 6, 5, .85); border-color: rgba(240, 170, 70, .4); color: var(--text); }
body.theme-yaksa .rw .it:hover { background: rgba(80, 12, 8, .9); }
body.theme-yaksa .rw .tip, body.theme-yaksa .fbox .desc { color: var(--muted); background: none; border: 0; }
body.theme-yaksa .tabs2 button { background: rgba(30, 6, 5, .9); color: #f3dcc0; border-color: var(--gold-3); }
body.theme-yaksa .tabs2 button.on { background: var(--yk-blood); color: #fff; }
body.theme-yaksa .ok, body.theme-yaksa .hs-plus, body.theme-yaksa .mb-st-done, body.theme-yaksa .x-up, body.theme-yaksa .x-stat.ok b { color: #7fe39a !important; }
body.theme-yaksa .rc-box h2, body.theme-yaksa .rc-next { color: var(--gold-2); }

/* ---------- member (web buying) */
body.theme-yaksa .mb-tabs button { background: rgba(30, 6, 5, .9); color: #f3dcc0; border-color: var(--gold-3); }
body.theme-yaksa .mb-tabs button.on { background: var(--yk-blood); color: #fff3dc; }
body.theme-yaksa .mb-chips button { background: rgba(30, 6, 5, .9); color: #f3dcc0; border-color: var(--gold-3); }
body.theme-yaksa .mb-chips button.on { background: var(--yk-blood); color: #fff; border-color: var(--gold); }
body.theme-yaksa .mb-shop-h { color: var(--gold-2); }
body.theme-yaksa .mb-shop, body.theme-yaksa .mb-c { background: var(--yk-card); border-color: rgba(240, 170, 70, .4); color: var(--text); }
body.theme-yaksa .mb-shop.on { background: var(--yk-blood); border-color: var(--gold); color: #fff; }
body.theme-yaksa .mb-tag { background: rgba(255, 140, 60, .18); color: #f3dcc0; }
body.theme-yaksa .mb-tag.s { background: rgba(60, 160, 90, .25); color: #b4f3c4; }
body.theme-yaksa .mb-tag.own { background: #7a0a10; color: #fff; }

/* ---------- top-up (QR codes keep their white backing so they scan) */
body.theme-yaksa .tu-scroll::before, body.theme-yaksa .tu-scroll::after { display: none; }
body.theme-yaksa .tu-scroll h2, body.theme-yaksa .tu-rates h3, body.theme-yaksa .tu-drop b, body.theme-yaksa .tu-kb-no { color: var(--gold-2); }
body.theme-yaksa .tu-packs small, body.theme-yaksa .tu-tabs button small, body.theme-yaksa .tu-ch small, body.theme-yaksa .tu-drop small, body.theme-yaksa .tu-rates th { color: var(--muted); }
body.theme-yaksa .tu-pts { color: #7fe39a; }
body.theme-yaksa .tu-tabs button, body.theme-yaksa .tu-ch, body.theme-yaksa .tu-acct, body.theme-yaksa .tu-drop, body.theme-yaksa .tu-res, body.theme-yaksa .tu-packs button {
  background: var(--yk-card) !important; color: var(--text) !important; border-color: rgba(240, 170, 70, .45) !important; box-shadow: none; }
body.theme-yaksa .tu-drop { border-style: dashed !important; border-color: var(--ember) !important; }
body.theme-yaksa .tu-tabs button.on, body.theme-yaksa .tu-ch.on, body.theme-yaksa .tu-packs button.on { background: linear-gradient(#8a0c10, #3f0408) !important; border-color: var(--gold) !important; color: #fff3dc !important; box-shadow: 0 0 0 1px var(--gold), 0 0 16px rgba(255, 60, 20, .45) !important; }
body.theme-yaksa .tu-acct .v, body.theme-yaksa .tu-kb-name, body.theme-yaksa .tu-rates table, body.theme-yaksa .tu-rates p { color: var(--text); }
body.theme-yaksa .tu-copy { background: linear-gradient(#fff3c4, #e3b358) !important; color: #3a0c04 !important; border: 1px solid #9c6a12 !important; }
body.theme-yaksa .tu-rates td { border-bottom-color: rgba(230, 90, 45, .22); }

/* ---------- history, explorer, player market, AI chat */
body.theme-yaksa .hs-chips a.on { background: var(--yk-blood); color: #fff; }
body.theme-yaksa .x-stat b, body.theme-yaksa .x-head h2, body.theme-yaksa .s-shopcard-h b, body.theme-yaksa .s-pop-h, body.theme-yaksa .s-shopname, body.theme-yaksa .s-buy-pop h4, body.theme-yaksa .s-pickbtn.on b { color: var(--gold-2); }
body.theme-yaksa .x-stat span, body.theme-yaksa .x-holders, body.theme-yaksa .x-head .kv, body.theme-yaksa .s-shop, body.theme-yaksa .s-price small, body.theme-yaksa .s-shopcard-h span, body.theme-yaksa .s-line small,
body.theme-yaksa .s-offer small, body.theme-yaksa .s-kv, body.theme-yaksa .s-shopcard-h .lab, body.theme-yaksa .s-cat-t, body.theme-yaksa .s-note, body.theme-yaksa .s-buy-item span { color: var(--muted); }
body.theme-yaksa .x-head .kv b, body.theme-yaksa .s-kv b { color: #fff1dc; }
body.theme-yaksa .s-who, body.theme-yaksa .s-buy { color: #9cc8ff; }
body.theme-yaksa .s-shops-n { color: #7fe39a; }
body.theme-yaksa .s-how { background: rgba(255, 120, 40, .12); color: #ead8c4; }
body.theme-yaksa .s-tabs button.on, body.theme-yaksa .s-cat.on, body.theme-yaksa .s-pickbtn.on { background: var(--yk-blood); color: #fff3dc; border-color: var(--gold); }
body.theme-yaksa .s-row, body.theme-yaksa .s-buy-item { background: var(--yk-card); border-color: rgba(240, 170, 70, .4); color: var(--text); }
body.theme-yaksa .s-row:hover { border-color: var(--ember); box-shadow: 0 0 14px rgba(255, 60, 20, .4); }
body.theme-yaksa .s-tbl td { background: var(--yk-card); color: var(--text); border-color: rgba(240, 170, 70, .35); }
body.theme-yaksa .s-tbl tr:hover td, body.theme-yaksa .s-tbl tbody tr:hover td { background: var(--yk-card-hi); border-color: var(--ember); }
@media (max-width: 760px) { body.theme-yaksa .s-tbl td::before { color: var(--muted); } }
body.theme-yaksa .msg.model { background: var(--yk-card); color: var(--text); border-color: var(--gold-3); }
body.theme-yaksa .msg.user { background: linear-gradient(#8a0c10, #4a0408); color: #fff3dc; }

.yk-topup-note { width: min(1180px, 100% - 32px); margin: 14px auto 0; padding: 10px 14px; border: 1px solid var(--blood); border-radius: 6px; background: rgba(120, 6, 6, .35); color: var(--gold-2); font-weight: 600; }
@media (max-width: 600px) { body.theme-yaksa { --yk-cut: 9px; } .yk-logo { height: 38px !important; } }


/* ================================================================ Part 2: the Yaksa layer (wins over Part 1: same or higher specificity, later) */
:root {
  --ink: #050202; --ink-2: #0d0404; --ink-3: #170606;
  --lacquer: #3d0606; --lacquer-2: #7a0b0f; --lacquer-3: #b3121a;
  --ruby: #c4161c; --fire: #ff6a1a; --ember: #ff5a1f; --molten: #ffb23a;
  --gold: #e2a83f; --gold-2: #f7d98b; --gold-hi: #fff1c1; --gold-3: #8f5a1c;
  --text: #f3e4cc; --muted: #bfa088;
}
body.theme-yaksa {
  --muted: #bfa088; --text: #f3e4cc; --line: rgba(226, 168, 63, .22);
  --font-head: 'Pridi', 'Sarabun', serif; --font-latin: 'Cinzel Decorative', 'Cinzel', serif;
  --yk-panel: linear-gradient(180deg, #1a0606 0%, #0f0404 55%, #090202 100%);
  --yk-card: linear-gradient(180deg, #170606, #0b0303);
  --yk-card-hi: linear-gradient(180deg, #2a0a08, #120404);
  --yk-goldline: rgba(226, 168, 63, .55);
  --yk-blood: linear-gradient(180deg, #c4161c 0%, #7a0b0f 60%, #4a0508 100%);
  --yk-head: linear-gradient(180deg, #5a0a0c, #2a0406);
  --yk-in: #080202;
  background-color: var(--ink);
  background-image:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(179, 18, 26, .38), transparent 70%),
    radial-gradient(ellipse 60% 40% at 50% 115%, rgba(255, 106, 26, .12), transparent 70%),
    linear-gradient(180deg, #070202, #050202);
  background-attachment: fixed;
}
body.theme-yaksa h1, body.theme-yaksa h2, body.theme-yaksa h3 { font-family: var(--font-head); font-weight: 700; }
body.theme-yaksa #embers { z-index: -1; opacity: 1; }

/* header: black lacquer bar, krajang band hanging under it, logo with fire glow */
body.theme-yaksa .site-head { background: linear-gradient(180deg, #0c0303 0%, #060101 100%); border-bottom: 1px solid var(--gold); box-shadow: 0 1px 0 #000, 0 10px 30px rgba(0, 0, 0, .7); }
body.theme-yaksa .site-head::after { content: ''; position: absolute; left: 0; right: 0; bottom: -19px; height: 18px; background: url(../img/orn/band.svg) center top / 36px 18px repeat-x; opacity: .95; animation: none; pointer-events: none; filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .8)); }
body.theme-yaksa .head-in { height: 76px; }
.yk-logo { height: 62px !important; width: auto; max-width: 100%; filter: drop-shadow(0 0 10px rgba(255, 70, 20, .45)) !important; }
.yk-logo-foot { height: 96px; width: auto; filter: drop-shadow(0 0 14px rgba(255, 70, 20, .4)); }
body.theme-yaksa .nav a, body.theme-yaksa .nav .drop > span { color: #ecd6b0; font-family: var(--font-head); font-weight: 600; font-size: 15px; border-radius: 0; }
body.theme-yaksa .nav a:hover, body.theme-yaksa .nav a.on, body.theme-yaksa .nav .drop:hover > span, body.theme-yaksa .nav .drop.on > span {
  color: var(--gold-hi); background: radial-gradient(ellipse 60% 90% at 50% 100%, rgba(226, 168, 63, .22), transparent 70%); box-shadow: inset 0 -2px 0 var(--gold); }
body.theme-yaksa .nav .menu { background: linear-gradient(#120404, #070202); border: 1px solid var(--gold); border-top: 3px solid var(--ruby); box-shadow: 0 16px 34px rgba(0, 0, 0, .85); }
body.theme-yaksa .nav .menu a { font-weight: 400; }
body.theme-yaksa .nav .menu a:hover { background: rgba(196, 22, 28, .28); box-shadow: inset 3px 0 0 var(--gold); }
body.theme-yaksa .burger { color: var(--gold-2); background: #0a0202; border: 1px solid var(--gold); border-radius: 0; }
@media (max-width: 1140px) {
  body.theme-yaksa .nav { top: 76px; background: linear-gradient(#0e0303, #050101); border-top: 1px solid var(--gold); border-bottom: 2px solid var(--gold); box-shadow: 0 20px 40px rgba(0, 0, 0, .85); }
  .yk-logo { height: 52px !important; }
}
body.theme-yaksa .dbtabs { background: #070202; border-bottom: 1px solid rgba(226, 168, 63, .35); }
body.theme-yaksa .dbtabs a { color: #dcc3a0; font-family: var(--font-head); }
body.theme-yaksa .dbtabs a.on { color: var(--gold-hi); background: linear-gradient(rgba(196, 22, 28, .4), rgba(196, 22, 28, .05)); box-shadow: inset 0 -3px 0 var(--gold); }

/* page banner: dark picture tinted red, gold title, kranok divider */
body.theme-yaksa .banner { clip-path: none; padding: 78px 0 56px; border-bottom: 1px solid rgba(226, 168, 63, .45); }
body.theme-yaksa .banner::before { filter: brightness(.3) saturate(.5) sepia(.6) hue-rotate(-25deg) contrast(1.1); }
body.theme-yaksa .banner::after { background: linear-gradient(180deg, rgba(5, 2, 2, .2) 0%, transparent 35%, var(--ink) 100%), radial-gradient(ellipse 55% 70% at 50% 45%, rgba(179, 18, 26, .35), transparent 70%); }
body.theme-yaksa .banner h1, body.theme-yaksa .hub h1 {
  font-family: var(--font-head); font-weight: 700; letter-spacing: 0; color: var(--gold-2);
  background: linear-gradient(180deg, #fff6d6 0%, #f7d98b 40%, #e2a83f 70%, #b06a1c 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  text-shadow: none; filter: drop-shadow(0 2px 0 #2a0303) drop-shadow(0 0 18px rgba(255, 90, 30, .45)); }
body.theme-yaksa .banner .wrap::after { content: ''; display: block; width: 240px; height: 80px; max-width: 70%; margin: 6px auto -18px; background: url(../img/orn/kranok.svg) center / contain no-repeat; opacity: .95; }
body.theme-yaksa .banner p { color: #e6cfae; }
body.theme-yaksa .banner.bg-weapon::before { background: url(../../img/bg/weapon.jpg) center / cover no-repeat; }
body.theme-yaksa .banner.bg-arena::before { background: url(../../img/bg/arena.jpg) center / cover no-repeat; }
body.theme-yaksa .banner.bg-soldiercamp::before { background: url(../../img/bg/soldiercamp.jpg) center / cover no-repeat; }
body.theme-yaksa .banner.bg-k01city::before { background: url(../../img/bg/k01city.jpg) center / cover no-repeat; }
body.theme-yaksa .banner.bg-bookstore::before { background: url(../../img/bg/bookstore.jpg) center / cover no-repeat; }
body.theme-yaksa .banner.bg-heaven::before { background: url(../../img/bg/heaven.jpg) center / cover no-repeat; }
body.theme-yaksa .banner.bg-cityhall::before { background: url(../../img/bg/cityhall.jpg) center / cover no-repeat; }
body.theme-yaksa .banner.bg-none::before { background: radial-gradient(ellipse at 50% 30%, #3a0608, #070202 70%); filter: none; }

/* section titles: gold serif + kranok under it */
body.theme-yaksa .title h2, body.theme-yaksa .dbx h2.sec, body.theme-yaksa h2.sec, body.theme-yaksa .hub h2 { font-family: var(--font-head); font-weight: 700; color: var(--gold-2); text-shadow: 0 2px 0 #1a0202, 0 0 16px rgba(255, 80, 20, .35); }
body.theme-yaksa .title::after { background: url(../img/orn/kranok.svg) center / contain no-repeat; height: 34px; width: 180px; margin: 6px auto 0; filter: none; }

/* panels: lacquer box, thin gold rim + inner rule, kranok corners (uses the .corner markup the pages already have) */
body.theme-yaksa .panel, body.theme-yaksa .panel.paper, body.theme-yaksa .modal .box, body.theme-yaksa .dbx .card,
body.theme-yaksa .fbox, body.theme-yaksa .wp .box, body.theme-yaksa .rc-box, body.theme-yaksa .s-shopcard, body.theme-yaksa .tu-scroll, body.theme-yaksa .tu-rates, body.theme-yaksa .mb-sellbox, body.theme-yaksa .stats {
  clip-path: none; border-radius: 2px; border: 1px solid var(--yk-goldline);
  background: radial-gradient(ellipse 70% 40% at 50% 0%, rgba(179, 18, 26, .16), transparent 70%), var(--yk-panel);
  box-shadow: inset 0 0 0 4px #070202, inset 0 0 0 5px rgba(226, 168, 63, .22), inset 0 0 40px rgba(90, 8, 8, .3), 0 14px 34px rgba(0, 0, 0, .65); }
body.theme-yaksa .panel .corner { display: block; width: 46px; height: 46px; border: 0 !important; background: url(../img/orn/corner.svg) 0 0 / 100% 100% no-repeat; pointer-events: none; z-index: 1; opacity: .95; }
body.theme-yaksa .panel .corner.tl { top: 3px; left: 3px; }
body.theme-yaksa .panel .corner.tr { top: 3px; right: 3px; transform: scaleX(-1); }
body.theme-yaksa .panel .corner.bl { bottom: 3px; left: 3px; transform: scaleY(-1); }
body.theme-yaksa .panel .corner.br { bottom: 3px; right: 3px; transform: scale(-1, -1); }
body.theme-yaksa .panel-head, body.theme-yaksa .panel.paper .panel-head { position: relative; z-index: 2; background: linear-gradient(180deg, #4a080a, #220304); border-bottom: 1px solid var(--gold); box-shadow: 0 3px 0 -2px rgba(226, 168, 63, .4); border-radius: 0; }
body.theme-yaksa .panel-head h3, body.theme-yaksa .panel .panel-head a, body.theme-yaksa .panel-head .more { color: var(--gold-2); text-shadow: 0 2px 0 #1a0202; }
body.theme-yaksa .panel h3, body.theme-yaksa .panel.paper h3, body.theme-yaksa .feat h3 { color: var(--gold-2); text-shadow: none; }
body.theme-yaksa .step::before, body.theme-yaksa .panel .step::before { border-radius: 0; transform: rotate(45deg) scale(.8); background: radial-gradient(circle at 40% 35%, #e0353a, #7a0b0f 65%, #3a0406); border: 2px solid var(--gold); color: transparent; box-shadow: 0 0 14px rgba(255, 70, 20, .45); }
body.theme-yaksa .step::after { content: counter(s); position: absolute; left: 0; top: 0; width: 50px; height: 50px; display: grid; place-items: center; font: 700 22px var(--font-head); color: var(--gold-hi); pointer-events: none; }

/* cards + tables */
body.theme-yaksa .item, body.theme-yaksa .sol, body.theme-yaksa .sol2, body.theme-yaksa .sol3, body.theme-yaksa .drop-list .item { border-radius: 2px; border-color: rgba(226, 168, 63, .3); }
body.theme-yaksa .item:hover, body.theme-yaksa .sol:hover, body.theme-yaksa .sol2:hover, body.theme-yaksa .sol3:hover { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold), 0 0 20px rgba(226, 120, 40, .35); }
body.theme-yaksa .tbl th, body.theme-yaksa .panel.paper .tbl th, body.theme-yaksa .solgrid th.t, body.theme-yaksa .soltbl th, body.theme-yaksa .rc-tbl th, body.theme-yaksa .s-tbl th, body.theme-yaksa .tu-rates th {
  background: linear-gradient(180deg, #4a080a, #260405); color: var(--gold-2); font-family: var(--font-head); font-weight: 600; border-bottom: 1px solid var(--gold); }
body.theme-yaksa .tbl tr:nth-child(even) td { background: rgba(226, 168, 63, .035); }
body.theme-yaksa .tbl tr:hover td { background: rgba(196, 22, 28, .14); }
body.theme-yaksa .chip, body.theme-yaksa .panel .chip { border-radius: 2px; }
body.theme-yaksa .chip.red, body.theme-yaksa button.chip.on, body.theme-yaksa .chip.on { background: var(--yk-blood) !important; border-color: var(--gold) !important; color: var(--gold-hi) !important; }

/* buttons: red lacquer with pointed temple ends; gold = main call to action */
body.theme-yaksa .btn, body.theme-yaksa .btn.big, body.theme-yaksa .btn-reg, body.theme-yaksa .panel .btn {
  border-radius: 0; color: var(--gold-hi); background: var(--yk-blood); border: 1px solid var(--gold); font-family: var(--font-head); font-weight: 600;
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%); padding-left: 30px; padding-right: 30px;
  box-shadow: inset 0 1px 0 rgba(255, 220, 150, .45), inset 0 -3px 8px rgba(0, 0, 0, .45); text-shadow: 0 1px 0 #2a0303; }
body.theme-yaksa .btn.small, body.theme-yaksa .nav .btn-reg, body.theme-yaksa .nav .btn-login { padding: 6px 20px; font-size: 14.5px; clip-path: polygon(9px 0, calc(100% - 9px) 0, 100% 50%, calc(100% - 9px) 100%, 9px 100%, 0 50%); }
body.theme-yaksa .btn:hover { filter: brightness(1.15) saturate(1.1); }
body.theme-yaksa .btn.gold { color: #2a0d03; background: linear-gradient(180deg, #fff3c4 0%, #f2c860 38%, #d0902e 70%, #8f5a1c 100%); border-color: #fff0c0; text-shadow: 0 1px 0 rgba(255, 255, 255, .45); }
body.theme-yaksa .btn.ghost { background: rgba(8, 2, 2, .7); color: var(--gold-2); border-color: var(--gold-3); }

/* footer: band on top, big logo */
body.theme-yaksa .site-foot { position: relative; margin-top: 60px; background: linear-gradient(180deg, #0a0303, #040101); border-top: 1px solid var(--gold); color: var(--muted); }
body.theme-yaksa .site-foot::before { content: ''; position: absolute; left: 0; right: 0; top: -19px; height: 18px; background: url(../img/orn/band.svg) center top / 36px 18px repeat-x; opacity: .9; }
.yk-foot .foot-in { padding: 30px 0 26px; }
.yk-foot .foot-links { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.yk-foot .foot-links a { color: var(--gold-2); font-family: 'Pridi', serif; }
.yk-copy { flex-basis: 100%; text-align: center; font-size: 13px; color: #8f7462; border-top: 1px solid rgba(226, 168, 63, .15); padding-top: 14px; }
@media (max-width: 600px) {
  .yk-foot .foot-in { justify-content: center; text-align: center; } .yk-foot .foot-links { justify-content: center; }
  .yk-logo-foot { height: 80px; } .yk-logo { height: 46px !important; } body.theme-yaksa .banner { padding: 56px 0 44px; }
}

/* status page */
.yk-status-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.yk-stat { text-align: center; padding: 26px 16px 22px; }
.yk-stat b { display: block; font: 700 clamp(30px, 5vw, 44px)/1.1 'Pridi', serif; color: var(--gold-hi); text-shadow: 0 0 18px rgba(255, 90, 30, .5); }
.yk-stat span { color: var(--muted); font-size: 15px; }
.yk-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #6b5a4a; vertical-align: middle; margin-right: 6px; }
.yk-dot.on { background: #4cd964; box-shadow: 0 0 10px 2px rgba(76, 217, 100, .7); }
.yk-dot.off { background: #e0353a; box-shadow: 0 0 10px 2px rgba(224, 53, 58, .6); }
.yk-two { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 18px; align-items: start; }
@media (max-width: 760px) { .yk-status-grid, .yk-two { grid-template-columns: 1fr; } }
/* download page */
.yk-dl-hero { text-align: center; }
.yk-dl-hero .btn { font-size: 20px; padding: 16px 40px; }
.yk-dl-meta { margin: 12px 0 0; color: var(--muted); font-size: 14px; }
.yk-note { margin: 18px 0 0; padding: 12px 16px; border-left: 3px solid var(--gold); background: rgba(196, 22, 28, .14); color: #ecd6b0; font-size: 15px; }
/* register page */
.yk-tag { display: inline-block; padding: 1px 10px; margin-right: 6px; border: 1px solid var(--gold); background: var(--yk-blood); color: var(--gold-hi); font-weight: 700; font-size: 13px; letter-spacing: .5px; }
.yk-callout { margin: 0 0 16px; padding: 12px 14px; border: 1px solid rgba(226, 168, 63, .4); background: rgba(196, 22, 28, .12); color: #f0dcb8; }
.yk-reg-grid { align-items: start; }
body.theme-yaksa .cap input.cap-in { width: 120px; text-transform: uppercase; }
.yk-small { color: var(--muted); font-size: 14px; margin: 0; }
.yk-center { text-align: center; }
.yk-narrow { max-width: 860px; }
.yk-gap { margin-top: 18px; }

.yk-stat .dot { width: 30px; height: 30px; margin: 6px 0 8px; }

/* ================================================================ Part 4: the Yaksa frame (owner 2026-11-06: "UI ไม่เหมือนเซิฟเก่า")
   Side "temple pillar" nav on desktop (tools/shell.cjs writes it into every page), slim top bar + bottom tab bar on phones,
   left-aligned title plaques instead of centred banners, card-grid game data, timeline news, seal footer. Fonts: Srisakdi (display),
   Taviraj (headings), Noto Sans Thai (text) - none of them are used by the Classic site. */
body.theme-yaksa { --rail: 252px; --font-body: 'Noto Sans Thai', 'Sarabun', Tahoma, sans-serif; --font-head: 'Taviraj', 'Pridi', serif; --font-disp: 'Srisakdi', 'Taviraj', serif;
  font-family: var(--font-body); padding-left: var(--rail); }
body.theme-yaksa h1, body.theme-yaksa h2, body.theme-yaksa h3, body.theme-yaksa .panel-head h3 { font-family: var(--font-head); }
#k3-online { display: none !important; }   /* the floating Classic-style online plate: the rail shows the count instead */
.g { width: 22px; height: 22px; flex: none; display: inline-block; vertical-align: middle; }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #6b5a4a; flex: none; }
.dot.on { background: #4cd964; box-shadow: 0 0 10px 2px rgba(76, 217, 100, .7); }
.dot.off { background: #e0353a; box-shadow: 0 0 10px 2px rgba(224, 53, 58, .6); }

/* --- the pillar (desktop) */
.yk-rail { position: fixed; z-index: 60; left: 0; top: 0; bottom: 0; width: var(--rail); display: flex; flex-direction: column; gap: 10px; padding: 14px 14px 16px 12px; overflow-y: auto; scrollbar-width: thin;
  background: linear-gradient(90deg, #070101 0%, #140303 70%, #1e0404 100%); border-right: 1px solid var(--gold); box-shadow: 8px 0 30px rgba(0, 0, 0, .7); }
.yk-rail::after { content: ''; position: fixed; left: calc(var(--rail) - 1px); top: 0; bottom: 0; width: 18px; background: url(../img/orn/band-v.svg) 0 0 / 18px 36px repeat-y; pointer-events: none; filter: drop-shadow(3px 0 4px rgba(0, 0, 0, .8)); }
.yk-rail-logo img { display: block; width: 100%; height: auto; filter: drop-shadow(0 0 14px rgba(255, 70, 20, .5)); }
.yk-rail-live { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 8px 10px; border: 1px solid rgba(226, 168, 63, .35); background: rgba(0, 0, 0, .45); font-size: 13px; color: #dcc3a0; }
.yk-rail-live .n { margin-left: auto; color: var(--muted); } .yk-rail-live .n b { color: var(--gold-hi); font-size: 15px; }
.yk-pillar { display: flex; flex-direction: column; gap: 4px; }
.yk-pillar > a, .yk-more > summary { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 16px; color: #e9d2ad; text-decoration: none; cursor: pointer; list-style: none;
  font: 600 17px/1.2 var(--font-head); border-left: 3px solid transparent; transition: background .2s, color .2s, border-color .2s; }
.yk-more > summary::-webkit-details-marker { display: none; }
.yk-more > summary::after { content: '▸'; margin-left: auto; color: var(--gold-3); transition: transform .2s; }
.yk-more[open] > summary::after { transform: rotate(90deg); }
.yk-pillar > a .g, .yk-more > summary .g { color: var(--gold); }
.yk-pillar > a:hover, .yk-more > summary:hover { background: linear-gradient(90deg, rgba(196, 22, 28, .3), transparent); color: var(--gold-hi); border-left-color: var(--gold-3); }
.yk-pillar > a.on { color: #2a0d03; background: linear-gradient(90deg, #f7d98b, #d0902e 70%, rgba(143, 90, 28, .6)); border-left-color: var(--ruby); }
.yk-pillar > a.on .g { color: #5a0a0c; }
.yk-pillar > a.on::before { content: ''; position: absolute; left: -9px; top: 50%; width: 10px; height: 10px; background: var(--ruby); border: 1px solid var(--gold-hi); transform: translateY(-50%) rotate(45deg); box-shadow: 0 0 8px var(--ruby); }
.yk-more-list { display: flex; flex-direction: column; padding: 2px 0 6px 50px; border-left: 1px dashed rgba(226, 168, 63, .3); margin-left: 26px; }
.yk-more-list a { padding: 5px 4px; font-size: 14.5px; color: #cdb08a; text-decoration: none; }
.yk-more-list a:hover, .yk-more-list a.on { color: var(--gold-hi); }
.yk-more-list a.on::before { content: '◆ '; color: var(--ruby); }
.yk-rail-cta { margin-top: auto; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 10px; text-decoration: none; font: 700 17px var(--font-head); color: #2a0d03 !important;
  background: linear-gradient(180deg, #fff3c4, #f2c860 40%, #c98526); border: 1px solid #fff0c0; clip-path: polygon(0 0, 100% 0, 100% 72%, 50% 100%, 0 72%); padding-bottom: 20px; }
.yk-rail-cta:hover { filter: brightness(1.12); }
/* --- phones: slim top bar + bottom tab bar */
.yk-top, .yk-tabs { display: none; }
@media (max-width: 999px) {
  body.theme-yaksa { padding-left: 0; padding-top: 58px; padding-bottom: 64px; }
  .yk-rail { display: none; }
  .yk-top { display: flex; align-items: center; gap: 10px; position: fixed; z-index: 60; top: 0; left: 0; right: 0; height: 58px; padding: 0 12px; background: linear-gradient(#0e0303, #060101); border-bottom: 1px solid var(--gold); }
  .yk-top::after { content: ''; position: absolute; left: 0; right: 0; bottom: -19px; height: 18px; background: url(../img/orn/band.svg) 0 0 / 36px 18px repeat-x; pointer-events: none; }
  .yk-top-logo img { height: 46px; width: auto; display: block; }
  .yk-top-live { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--gold-hi); }
  .yk-top-reg { padding: 7px 14px; font: 700 15px var(--font-head); color: #2a0d03 !important; text-decoration: none; background: linear-gradient(#fff3c4, #d0902e); clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
  .yk-tabs { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; height: 64px; background: linear-gradient(#140303, #070101); border-top: 1px solid var(--gold); box-shadow: 0 -8px 24px rgba(0, 0, 0, .7); }
  .yk-tabs > a, .yk-sheet > summary { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; height: 64px; font: 500 11.5px var(--font-body); color: #cdb08a; text-decoration: none; list-style: none; cursor: pointer; }
  .yk-sheet > summary::-webkit-details-marker { display: none; }
  .yk-tabs .g { color: var(--gold); }
  .yk-tabs > a.on, .yk-sheet > summary.on, .yk-sheet[open] > summary { color: var(--gold-hi); background: radial-gradient(ellipse 60% 80% at 50% 0%, rgba(196, 22, 28, .55), transparent 75%); box-shadow: inset 0 2px 0 var(--gold); }
  .yk-sheet-in { position: fixed; left: 10px; right: 10px; bottom: 74px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 14px; background: #0c0303; border: 1px solid var(--gold); box-shadow: 0 -10px 40px rgba(0, 0, 0, .85); }
  .yk-sheet-in a { padding: 10px 12px; border: 1px solid rgba(226, 168, 63, .3); color: #ecd6b0; text-decoration: none; font-size: 14.5px; background: rgba(196, 22, 28, .1); }
  .yk-sheet-in a.on { border-color: var(--gold); color: var(--gold-hi); }
}

/* --- page title plaque (was a centred picture banner) */
body.theme-yaksa .banner { text-align: left; margin: 26px 26px 0; padding: 38px 0 34px; border: 1px solid rgba(226, 168, 63, .55); box-shadow: inset 0 0 0 4px #070202, inset 0 0 0 5px rgba(226, 168, 63, .25); }
body.theme-yaksa .banner::before { left: 40%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 40%); mask-image: linear-gradient(90deg, transparent, #000 40%); filter: brightness(.55) saturate(.7) sepia(.5) hue-rotate(-25deg); }
body.theme-yaksa .banner::after { background: linear-gradient(90deg, #0b0202 0%, rgba(11, 2, 2, .85) 45%, transparent 80%), linear-gradient(180deg, transparent 60%, rgba(5, 2, 2, .8)); }
body.theme-yaksa .banner .wrap { width: auto; margin: 0 34px; padding-left: 26px; border-left: 3px solid var(--ruby); }
body.theme-yaksa .banner .wrap::after { display: none; }
body.theme-yaksa .banner h1, body.theme-yaksa .hub h1 { font: 700 clamp(30px, 4.4vw, 50px)/1.25 var(--font-disp); }
body.theme-yaksa .banner p { font-size: 16px; margin-top: 4px; }
body.theme-yaksa .section { padding: 34px 0 40px; }
body.theme-yaksa .wrap { width: min(1180px, 100% - 52px); }
@media (max-width: 999px) { body.theme-yaksa .banner { margin: 22px 10px 0; padding: 26px 0 24px; } body.theme-yaksa .banner .wrap { margin: 0 16px; padding-left: 14px; } body.theme-yaksa .wrap { width: calc(100% - 24px); } }
/* --- game-data pages: tile index instead of an underline tab bar, a framed filter console, square item cards */
body.theme-yaksa .dbtabs { background: none; border: 0; padding: 18px 0 0; }
body.theme-yaksa .dbtabs .wrap { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 6px; overflow: visible; }
body.theme-yaksa .dbtabs a { padding: 7px 14px; border: 1px solid rgba(226, 168, 63, .35); background: rgba(10, 2, 2, .7); font: 600 14.5px var(--font-head); box-shadow: none; }
body.theme-yaksa .dbtabs a.on { color: #2a0d03; background: linear-gradient(#f7d98b, #c98526); border-color: #fff0c0; box-shadow: none; }
body.theme-yaksa .toolbar { padding: 14px 16px; border: 1px solid rgba(226, 168, 63, .4); border-top: 3px solid var(--ruby); background: linear-gradient(180deg, #160404, #0a0202); gap: 10px; }
body.theme-yaksa .toolbar input, body.theme-yaksa .toolbar select { border-radius: 0 !important; border-color: rgba(226, 168, 63, .45) !important; }
body.theme-yaksa .chiprow { gap: 6px; margin-top: 10px; }
body.theme-yaksa .chip, body.theme-yaksa .panel .chip { border-radius: 0; border: 0; border-bottom: 2px solid rgba(226, 168, 63, .35); background: transparent; color: #d9bf98; padding: 4px 10px; font-family: var(--font-head); }
body.theme-yaksa .chip:hover { color: var(--gold-hi); border-bottom-color: var(--gold); }
body.theme-yaksa .chip.red, body.theme-yaksa button.chip.on, body.theme-yaksa .chip.on { background: transparent !important; color: var(--gold-hi) !important; border-bottom-color: var(--ruby) !important; box-shadow: 0 6px 10px -8px var(--ruby); }
body.theme-yaksa .items { grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 12px; }
body.theme-yaksa .items .item { flex-direction: column; align-items: center; justify-content: flex-start; text-align: center; gap: 8px; padding: 18px 10px 14px; min-height: 150px; border-radius: 0;
  background: radial-gradient(circle at 50% 28%, rgba(196, 22, 28, .25), transparent 55%), linear-gradient(180deg, #160505, #0a0202); }
body.theme-yaksa .items .item .icon { width: 58px; height: 58px; border-radius: 50%; background-size: 44px 44px; border: 2px solid var(--gold-3); box-shadow: 0 0 0 4px #0a0202, 0 0 0 5px rgba(226, 168, 63, .3), 0 0 16px rgba(255, 80, 20, .3); }
body.theme-yaksa .items .item .nm { font-size: 14.5px; }
body.theme-yaksa .items .item .sub { font-size: 12px; }
@media (max-width: 560px) { body.theme-yaksa .items { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

/* --- seal footer */
.yk-foot2 { position: relative; margin-top: 70px; padding: 60px 16px 26px; text-align: center; background: radial-gradient(ellipse 50% 70% at 50% 0%, rgba(196, 22, 28, .25), transparent 70%), #050101; border-top: 1px solid rgba(226, 168, 63, .5); }
.yk-foot2::before { content: ''; position: absolute; left: 50%; top: -60px; width: 120px; height: 120px; transform: translateX(-50%); background: url(../img/orn/mandala.svg) center / contain no-repeat; opacity: .55; }
.yk-seal img { width: 220px; max-width: 70%; height: auto; filter: drop-shadow(0 0 16px rgba(255, 70, 20, .45)); }
.yk-motto { margin: 8px 0 14px; font: 700 22px var(--font-disp); color: var(--gold-2); }
.yk-foot2-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 0; }
.yk-foot2-links a { color: #dcc3a0; text-decoration: none; padding: 2px 12px; font-family: var(--font-head); }
.yk-foot2-links a + a::before { content: '◆'; margin-right: 12px; color: var(--gold-3); font-size: 10px; vertical-align: 2px; }
.yk-foot2-links a:hover { color: var(--gold-hi); }
.yk-foot2-copy { margin: 18px 0 0; font-size: 12.5px; color: #7d6352; }

/* --- buttons used by the new pages */
.yk-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 13px 22px; text-decoration: none; font: 700 17px var(--font-head); color: var(--gold-hi) !important;
  background: linear-gradient(180deg, #b3121a, #5a080b); border: 1px solid var(--gold); box-shadow: inset 0 0 0 3px rgba(0, 0, 0, .35), 0 8px 20px rgba(0, 0, 0, .5); clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%); padding-right: 30px; }
.yk-btn.ghost { background: rgba(8, 2, 2, .75); border-color: var(--gold-3); color: var(--gold-2) !important; }
.yk-btn:hover { filter: brightness(1.15); }
.yk-h { margin: 0 0 18px; font: 700 clamp(26px, 3vw, 34px)/1.2 var(--font-disp); color: var(--gold-2); text-shadow: 0 0 18px rgba(255, 80, 20, .35); }
.yk-h small { font: 500 14px var(--font-body); color: var(--muted); margin-left: 10px; text-shadow: none; }
.yk-link { display: inline-block; margin-top: 14px; color: var(--gold-2); font-family: var(--font-head); }
.yk-link::after { content: ' ⟶'; }

/* --- home */
.yk-mandala { position: absolute; left: 50%; top: 50%; width: min(760px, 120vw); aspect-ratio: 1; transform: translate(-50%, -50%); z-index: -1; pointer-events: none; background: url(../img/orn/mandala.svg) center / contain no-repeat; opacity: .16; animation: yk-spin 160s linear infinite; }
@keyframes yk-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
.yk-split { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, 1fr); min-height: min(92vh, 860px); border-bottom: 1px solid rgba(226, 168, 63, .4); }
.yk-split-art { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 30px;
  background: linear-gradient(180deg, rgba(5, 1, 1, .2), rgba(5, 1, 1, .1) 60%, rgba(5, 1, 1, .9)), url(../img/scene_bg.jpg) center / cover no-repeat; }
.yk-split-art::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 40%; z-index: -1; background: radial-gradient(ellipse 60% 80% at 50% 100%, rgba(255, 110, 30, .45), transparent 70%); animation: yk-fire 3.4s ease-in-out infinite alternate; }
@keyframes yk-fire { 0% { opacity: .65; } 50% { opacity: 1; } 100% { opacity: .8; } }
.yk-split-logo { width: min(760px, 100%); height: auto; filter: drop-shadow(0 0 26px rgba(255, 60, 20, .6)) drop-shadow(0 14px 20px rgba(0, 0, 0, .8)); animation: yk-float 6s ease-in-out infinite; }
@keyframes yk-float { 50% { transform: translateY(-8px); } }
.yk-split-motto { margin: 10px 0 0; font: 700 clamp(26px, 3.4vw, 44px)/1.3 var(--font-disp); color: var(--gold-2); text-align: center; text-shadow: 0 0 22px rgba(255, 70, 20, .6), 0 3px 0 #2a0303; }
.yk-split-motto span { display: inline-block; }
.yk-altar { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 18px; padding: 40px 38px; background: linear-gradient(180deg, #120303, #070101); border-left: 1px solid var(--gold); }
.yk-altar::before { content: ''; position: absolute; left: -10px; top: 0; bottom: 0; width: 18px; background: url(../img/orn/band-v.svg) 0 0 / 18px 36px repeat-y; transform: scaleX(-1); opacity: .9; }
.yk-altar-k { margin: 0; font: 600 13px var(--font-body); letter-spacing: .2em; color: var(--molten); }
.yk-altar-live { display: flex; align-items: center; gap: 10px; font: 600 18px var(--font-head); color: #ecd6b0; }
.yk-altar-nums { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid rgba(226, 168, 63, .4); }
.yk-altar-nums div { padding: 14px 16px; } .yk-altar-nums div + div { border-left: 1px solid rgba(226, 168, 63, .4); }
.yk-altar-nums b { display: block; font: 700 38px/1.1 var(--font-head); color: var(--gold-hi); text-shadow: 0 0 16px rgba(255, 90, 30, .5); }
.yk-altar-nums span { font-size: 13px; color: var(--muted); }
.yk-eye { position: relative; align-self: center; display: grid; justify-items: center; align-content: center; gap: 2px; width: 210px; height: 210px; margin: 6px 0; border-radius: 50%; text-decoration: none; isolation: isolate;
  background: radial-gradient(circle at 50% 45%, #ff9a3a 0%, #e0301c 28%, #7a0b0f 58%, #2a0304 74%); border: 2px solid var(--gold); box-shadow: 0 0 0 6px #0a0202, 0 0 0 7px rgba(226, 168, 63, .5), 0 0 50px rgba(255, 70, 20, .65); animation: yk-eye 3s ease-in-out infinite; }
.yk-eye .g { width: 64px; height: 64px; color: #fff3c4; filter: drop-shadow(0 0 10px #ffcf5a); }
.yk-eye b { font: 700 28px/1.2 var(--font-disp); color: #fff6d6; text-shadow: 0 2px 0 #4a0508; }
.yk-eye small { font: 600 13px var(--font-body); color: #ffe3b0; }
.yk-eye-ring { position: absolute; inset: -16px; z-index: -1; border-radius: 50%; background: url(../img/orn/mandala.svg) center / contain no-repeat; opacity: .7; animation: yk-spin2 40s linear infinite; }
@keyframes yk-spin2 { to { transform: rotate(360deg); } }
@keyframes yk-eye { 50% { box-shadow: 0 0 0 6px #0a0202, 0 0 0 7px rgba(226, 168, 63, .7), 0 0 80px rgba(255, 110, 30, .9); } }
.yk-eye:hover { filter: brightness(1.12); }
.yk-altar-btns { display: grid; gap: 10px; }
.yk-altar-note { margin: 0; font-size: 13.5px; color: var(--muted); }
.yk-band { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0; border-bottom: 1px solid rgba(226, 168, 63, .3); }
.yk-pane { padding: 46px 40px; } .yk-pane + .yk-pane { border-left: 1px solid rgba(226, 168, 63, .3); background: rgba(196, 22, 28, .05); }
.yk-timeline { list-style: none; margin: 0; padding: 0 0 0 26px; position: relative; }
.yk-timeline::before { content: ''; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(var(--gold), var(--ruby), transparent); }
body.theme-yaksa .yk-timeline li { position: relative; display: flex; flex-direction: column-reverse; gap: 2px; padding: 0 0 22px; border: 0; }
.yk-timeline li::before { content: ''; position: absolute; left: -25px; top: 4px; width: 12px; height: 12px; background: var(--ruby); border: 2px solid var(--gold-hi); transform: rotate(45deg); box-shadow: 0 0 10px var(--ruby); }
body.theme-yaksa .yk-timeline .d { font: 600 13px var(--font-head); color: var(--molten); }
.yk-timeline a { color: #f3e4cc; font-size: 16.5px; text-decoration: none; } .yk-timeline a:hover { color: var(--gold-hi); }
.yk-podium { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.yk-podium li { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid rgba(226, 168, 63, .25); background: rgba(0, 0, 0, .35); }
.yk-podium li i { display: grid; place-items: center; width: 34px; height: 34px; font: 700 18px var(--font-head); font-style: normal; color: #2a0d03; background: linear-gradient(#fff3c4, #c98526); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.yk-podium li.p1 { border-color: var(--gold); background: linear-gradient(90deg, rgba(226, 168, 63, .2), transparent); } .yk-podium li.p1 b { font-size: 18px; color: var(--gold-hi); }
.yk-podium li.p2 i { background: linear-gradient(#f2f2f2, #8f8f8f); } .yk-podium li.p3 i { background: linear-gradient(#ffd2a8, #9a5424); }
.yk-podium li.p4 i, .yk-podium li.p5 i { background: #3a0a08; color: var(--gold-2); }
.yk-podium li span { color: var(--muted); font-size: 14px; }
.yk-empty { color: var(--muted); }
.yk-vows { padding: 54px 40px; }
.yk-vow-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid rgba(226, 168, 63, .3); }
.yk-vow-list li { display: grid; grid-template-columns: 70px 1fr; gap: 16px; padding: 22px 10px; border-bottom: 1px solid rgba(226, 168, 63, .3); }
.yk-vow-list li:nth-child(odd) { border-right: 1px solid rgba(226, 168, 63, .3); padding-right: 26px; } .yk-vow-list li:nth-child(even) { padding-left: 26px; }
.yk-vow-list b { font: 700 52px/1 var(--font-disp); color: var(--ruby); text-shadow: 0 0 16px rgba(255, 60, 20, .5); text-align: center; }
.yk-vow-list h3 { margin: 4px 0 6px; font-size: 21px; color: var(--gold-2); }
.yk-vow-list p { margin: 0; color: #d9c2a2; }
.yk-path { padding: 10px 40px 40px; }
.yk-path-row { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.yk-path-row::before { content: ''; position: absolute; left: 16%; right: 16%; top: 30px; height: 2px; background: repeating-linear-gradient(90deg, var(--gold) 0 14px, transparent 14px 22px); }
.yk-node { position: relative; text-align: center; text-decoration: none; color: inherit; padding: 0 10px; }
.yk-node i { display: grid; place-items: center; width: 60px; height: 60px; margin: 0 auto 12px; font: 700 26px var(--font-head); font-style: normal; color: var(--gold-hi); background: radial-gradient(circle at 40% 35%, #e0353a, #5a080b 70%); border: 2px solid var(--gold); border-radius: 50%; box-shadow: 0 0 0 5px #070101, 0 0 20px rgba(255, 70, 20, .5); }
.yk-node h3 { margin: 0 0 4px; font-size: 20px; color: var(--gold-2); } .yk-node p { margin: 0; color: var(--muted); font-size: 14.5px; }
.yk-node:hover i { filter: brightness(1.2); }
.js .reveal { opacity: 0; transform: translateY(16px); transition: opacity .7s ease, transform .7s ease; } .js .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .yk-mandala, .yk-split-logo, .yk-eye, .yk-eye-ring, .yk-split-art::after { animation: none; } .js .reveal { opacity: 1; transform: none; transition: none; } }
@media (max-width: 1180px) { .yk-split { grid-template-columns: 1fr; min-height: 0; } .yk-altar { border-left: 0; border-top: 1px solid var(--gold); } .yk-altar::before { display: none; } }
@media (max-width: 760px) {
  .yk-split-art { padding: 34px 14px 30px; } .yk-altar { padding: 26px 16px; } .yk-eye { width: 180px; height: 180px; }
  .yk-band { grid-template-columns: 1fr; } .yk-pane { padding: 34px 16px; } .yk-pane + .yk-pane { border-left: 0; border-top: 1px solid rgba(226, 168, 63, .3); }
  .yk-vows { padding: 40px 16px; } .yk-vow-list { grid-template-columns: 1fr; } .yk-vow-list li:nth-child(odd) { border-right: 0; padding-right: 10px; } .yk-vow-list li:nth-child(even) { padding-left: 10px; }
  .yk-path { padding: 0 16px 30px; } .yk-path-row { grid-template-columns: 1fr; gap: 26px; } .yk-path-row::before { left: 50%; right: auto; top: 30px; bottom: 30px; width: 2px; height: auto; background: repeating-linear-gradient(180deg, var(--gold) 0 14px, transparent 14px 22px); }
  .yk-node { background: #070101; padding: 6px 10px; }
}
/* --- news page: the list becomes a timeline too */
body.theme-yaksa[data-page="news"] .news { list-style: none; position: relative; padding-left: 28px; }
body.theme-yaksa[data-page="news"] .news::before { content: ''; position: absolute; left: 8px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(var(--gold), var(--ruby), transparent); }
body.theme-yaksa[data-page="news"] .news li { position: relative; display: flex; flex-direction: column-reverse; padding: 0 0 22px; border: 0; }
body.theme-yaksa[data-page="news"] .news li::before { content: ''; position: absolute; left: -25px; top: 4px; width: 12px; height: 12px; background: var(--ruby); border: 2px solid var(--gold-hi); transform: rotate(45deg); }
body.theme-yaksa[data-page="news"] .news .d { color: var(--molten); font-family: var(--font-head); }