/* fy99.info — Pechhon-pat: contemporary Dhaka rickshaw-art studio (rexine hood, cut-vinyl applique, enamel tin plates, chrome rosettes, reflector studs) */
:root{
 --rex:#18121d;--rex2:#241c2b;--rex3:#312738;
 --cream:#f7efdf;--cream2:#efe3cb;--cream3:#e6d6b8;--line:#d8c6a4;
 --ink:#221a24;--muted:#5d515c;
 --red:#c8233a;--red-d:#8e1427;--teal:#0c7773;--teal-d:#095a57;--green:#1f7a3a;--gold:#f0a20f;--pink:#b82e63;--plum:#5b2a57;
 --chrome:#dfe3e8;--steel:#98a0aa;
 --f-disp:"Shrikhand","Galada","Hind Siliguri",Georgia,serif;
 --f-plate:"Shrikhand",Georgia,serif;
 --f-body:"Tiro Bangla","Hind Siliguri",Georgia,serif;
 --f-ui:"Mina","Hind Siliguri",system-ui,sans-serif;
 --font-head:var(--f-disp);--font-body:var(--f-ui);
 --primary:var(--gold);--accent:var(--gold);--surface:var(--rex2);--text:var(--cream);
 --lh:1.7;--lh-h:1.15;
 --wrap:1240px;--gut:16px;
 --app:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='26' viewBox='0 0 84 26'%3E%3Cg stroke-width='2'%3E%3Cpath d='M0 0A14 14 0 0 0 28 0Z' fill='%23c8233a'/%3E%3Cpath d='M28 0A14 14 0 0 0 56 0Z' fill='%230c7773'/%3E%3Cpath d='M56 0A14 14 0 0 0 84 0Z' fill='%23f0a20f'/%3E%3Cpath d='M14 13v8' stroke='%23f0a20f'/%3E%3Cpath d='M42 13v8' stroke='%23e05a8c'/%3E%3Cpath d='M70 13v8' stroke='%2320a39c'/%3E%3C/g%3E%3Ccircle cx='14' cy='6' r='2.6' fill='%23f7efdf'/%3E%3Ccircle cx='42' cy='6' r='2.6' fill='%23f0a20f'/%3E%3Ccircle cx='70' cy='6' r='2.6' fill='%23c8233a'/%3E%3Ccircle cx='14' cy='23' r='2.6' fill='%23f0a20f'/%3E%3Ccircle cx='42' cy='23' r='2.6' fill='%23e05a8c'/%3E%3Ccircle cx='70' cy='23' r='2.6' fill='%2320a39c'/%3E%3C/svg%3E");
 --quilt:repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 1px,transparent 1px 9px),repeating-linear-gradient(-45deg,rgba(255,255,255,.035) 0 1px,transparent 1px 9px);
 --studs:radial-gradient(circle at 50% 50%,#ffe9b0 0 1.6px,#e0405a 2.4px 6.5px,#7a0f22 7px 8px,#e9ecf0 8.5px 10px,#7d848e 10.5px 11px,transparent 11.5px);
}
html:lang(bn){--f-disp:"Galada","Hind Siliguri",serif;--lh:1.85;--lh-h:1.5}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px}
body{margin:0;background:var(--cream);color:var(--ink);font:400 1.0625rem/var(--lh) var(--f-body);overflow-x:clip}
@media (min-width:700px){body{font-size:1.125rem}}
img,svg{max-width:100%}
a{color:var(--teal-d);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--red)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}
.hood :focus-visible,.foot :focus-visible,.screen :focus-visible,.namehead :focus-visible{outline-color:#ffd166}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
@media (min-width:700px){:root{--gut:28px}}
h1,h2,h3{margin:0;font-weight:400;line-height:var(--lh-h);text-wrap:balance}
p{margin:0 0 1em}
.skip{position:absolute;left:12px;top:-80px;z-index:100;background:var(--gold);color:var(--ink);padding:12px 18px;font:700 1rem var(--f-ui);border-radius:6px;text-decoration:none}
.skip:focus{top:12px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:50px;padding:.7em 1.3em;border-radius:8px;border:2px solid var(--rex);background:var(--red);color:var(--cream);font:700 1rem/1.2 var(--f-ui);text-decoration:none;box-shadow:4px 4px 0 var(--rex);transition:transform .15s,box-shadow .15s,background .15s;text-align:center}
.btn:hover{color:var(--cream);background:#d8304a;transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--rex)}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--rex)}
.btn-ghost{background:var(--cream);color:var(--ink)}
.btn-ghost:hover{background:#fff8ea;color:var(--ink)}
.btn-sm{min-height:46px;padding:.55em 1em;font-size:.95rem}

/* ---------- header: chrome rail + rexine hood + applique ---------- */
.hood{position:relative;z-index:20;background:var(--rex);background-image:var(--quilt);color:var(--cream)}
.rail{background:linear-gradient(180deg,#f1f3f6,#c3c9d1 55%,#e4e7eb);color:#2b2530;border-bottom:1px solid #6f7680}
.rail-in{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.indie{margin:0;font:700 .8125rem/1.3 var(--f-ui);color:#3a3240}
html:lang(en) .indie{letter-spacing:.04em;text-transform:uppercase;font-size:.75rem}
.lsw{display:flex;gap:4px;margin-left:auto}
.lsw a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font:700 .875rem/1 var(--f-ui);color:#2b2530;text-decoration:none;border-radius:4px}
.lsw a[aria-current]{background:var(--rex);color:var(--cream)}
.lsw a:not([aria-current]):hover{background:rgba(24,18,29,.1)}
.hood-in{display:flex;align-items:center;gap:14px;min-height:78px;padding-top:10px;padding-bottom:10px;position:relative}
.hood-in::after{content:"";position:absolute;left:var(--gut);right:var(--gut);bottom:5px;border-bottom:2px dashed rgba(240,162,15,.5)}
.brand{text-decoration:none;display:inline-flex;flex:none}
.plate{display:inline-flex;align-items:center;gap:10px;padding:6px 14px 7px 16px;border-radius:7px;background:var(--cream);color:var(--ink);
 box-shadow:inset 0 0 0 2px var(--cream),inset 0 0 0 4px var(--red),inset 0 0 0 5px var(--cream),0 3px 0 rgba(0,0,0,.35);
 background-image:radial-gradient(circle at 8px 50%,#8b929c 0 2px,transparent 2.5px),radial-gradient(circle at calc(100% - 8px) 50%,#8b929c 0 2px,transparent 2.5px)}
.plate-no{font:400 1.75rem/1 var(--f-plate);color:var(--red);text-shadow:2px 2px 0 var(--rex);padding:2px 0 4px}
.plate-tag{font:700 .75rem/1.1 var(--f-ui);color:var(--teal-d);border-left:2px solid var(--line);padding-left:9px;max-width:6em}
html:lang(en) .plate-tag{text-transform:uppercase;letter-spacing:.12em}
.plate-lg .plate-no{font-size:2.4rem}
.nav{flex:1;min-width:0}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 4px;justify-content:center}
.nav a{--c:var(--red);position:relative;display:flex;align-items:center;min-height:46px;padding:0 13px;color:var(--cream);text-decoration:none;font:700 .98rem/1.2 var(--f-ui);border-radius:6px}
.nav a[data-i="1"]{--c:#20a39c}.nav a[data-i="2"]{--c:var(--gold)}.nav a[data-i="3"]{--c:#e05a8c}.nav a[data-i="4"]{--c:#3fae5d}
.nav a::after{content:"";position:absolute;left:13px;right:13px;bottom:6px;height:3px;border-radius:2px;background:var(--c);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav a:hover{color:#fff}.nav a:hover::after{transform:scaleX(1)}
.nav a[aria-current]{background:var(--cream);color:var(--ink);box-shadow:inset 0 -4px 0 var(--c)}
.nav a[aria-current]::after{display:none}
.btn-hood{background:var(--gold);color:var(--ink);border-color:#0d0a10;box-shadow:3px 3px 0 #0d0a10;min-height:46px;flex:none}
.btn-hood:hover{background:#ffb72e;color:var(--ink);box-shadow:4px 4px 0 #0d0a10}
.menu-btn{display:none;align-items:center;gap:10px;min-height:48px;min-width:48px;margin-left:auto;padding:0 14px;border-radius:8px;border:2px solid var(--gold);background:transparent;color:var(--cream);font:700 1rem/1 var(--f-ui);cursor:pointer}
.bars{display:grid;gap:4px;width:20px}.bars i{display:block;height:2px;background:var(--gold);border-radius:2px;transition:transform .2s,opacity .2s}
.hood.open .bars i:nth-child(1){transform:translateY(6px) rotate(45deg)}.hood.open .bars i:nth-child(2){opacity:0}.hood.open .bars i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.applique{position:absolute;left:0;right:0;top:100%;height:26px;background:var(--app) 0 0/84px 26px repeat-x;pointer-events:none;transform-origin:top}
@media (prefers-reduced-motion:no-preference){.applique{animation:sway 5s ease-in-out infinite alternate}}
@keyframes sway{from{background-position:0 0}to{background-position:3px 0}}
@media (max-width:979.98px){
 .menu-btn{display:inline-flex}
 .btn-hood{display:none}
 .hood-in{flex-wrap:wrap}
 .nav{display:none;order:5;flex-basis:100%;padding:6px 0 14px}
 .hood.open .nav{display:block}
 .nav ul{flex-direction:column;align-items:stretch;gap:6px}
 .nav a{min-height:52px;padding:0 16px 0 22px;background:var(--rex2);border-radius:6px;font-size:1.05rem}
 .nav a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;border-radius:6px 0 0 6px;background:var(--c)}
 .nav a::after{display:none}
 .nav a[aria-current]{box-shadow:none}
}
@media (max-width:420px){.indie{font-size:.75rem}html:lang(en) .indie{font-size:.6875rem;letter-spacing:.02em}.plate-no{font-size:1.5rem}.plate-tag{display:none}.menu-btn{padding:0 12px}}
@media (min-width:980px) and (max-width:1180px){.nav a{padding:0 9px;font-size:.92rem}.nav a::after{left:9px;right:9px}}

/* ---------- home stage: painted back-plate + cinema screen ---------- */
.stage{background:var(--rex);background-image:var(--quilt);color:var(--cream);padding-top:52px}
.stage-grid{display:grid;gap:26px;align-items:start;padding-bottom:30px}
@media (min-width:1024px){.stage-grid{grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);gap:32px}}
.backplate{padding:12px;border-radius:12px;
 background:radial-gradient(circle,rgba(255,255,255,.7) 0 1.4px,transparent 2px) 0 0/12px 12px,linear-gradient(135deg,#eef0f3,#a2a9b3 38%,#eef1f4 58%,#8f97a1);
 box-shadow:0 0 0 2px #0d0a10,0 18px 40px -18px rgba(0,0,0,.8)}
.scene{position:relative;height:clamp(118px,20vw,176px);border-radius:6px 6px 0 0;overflow:hidden;
 background:linear-gradient(180deg,#0c5f5c 0 34%,#0c7773 34% 52%,#b82e63 52% 68%,#e0573f 68% 80%,#f0a20f 80%)}
.scene::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,#fff6 0 1px,transparent 1.5px) 0 0/34px 22px;height:40%}
.sun{position:absolute;left:62%;bottom:18%;width:clamp(70px,13vw,112px);aspect-ratio:1;border-radius:50%;background:#ffd166;box-shadow:0 0 0 7px rgba(255,209,102,.35),0 0 0 15px rgba(255,209,102,.15)}
.skyline{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:52%;fill:var(--rex)}
.letter{background:var(--cream);color:var(--ink);padding:22px 20px 24px;border-radius:0 0 6px 6px;box-shadow:inset 0 5px 0 var(--red)}
@media (min-width:700px){.letter{padding:30px 34px 34px}}
.badge{display:inline-block;margin:0 0 14px;padding:4px 12px;border-radius:999px;background:var(--rex);color:var(--gold);font:700 .875rem/1.5 var(--f-ui)}
.letter h1{font-family:var(--f-disp);font-size:clamp(1.9rem,1.2rem + 2.2vw,2.8rem);color:var(--ink);margin-bottom:16px}
html:lang(en) .letter h1{color:var(--red);text-shadow:3px 3px 0 var(--rex);line-height:1.08;letter-spacing:.005em}
html:lang(bn) .letter h1{font-size:clamp(1.9rem,1.3rem + 2vw,2.6rem);line-height:1.45}
.lead p{margin:0 0 1em;font-size:1.06em}
.acts{display:flex;flex-wrap:wrap;gap:14px 16px;margin:20px 0 20px}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips li{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:6px;background:var(--cream2);border:1px solid var(--line);font:700 .875rem/1.4 var(--f-ui);color:var(--ink)}
.chips li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 0 2px var(--chrome),0 0 0 3px var(--steel)}
.chips li:nth-child(2)::before{background:var(--teal)}.chips li:nth-child(3)::before{background:var(--gold)}
.screen{position:relative;border-radius:12px;padding:10px;background:#0d0a10;box-shadow:0 0 0 2px #3b3142,0 18px 40px -18px rgba(0,0,0,.9);container-type:inline-size;scroll-margin-top:12px}
.screen-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:4px 12px;padding:8px 34px 10px;font:700 .875rem/1.3 var(--f-ui)}
.st-t{color:var(--gold)}.st-n{color:#cdbfc9}
.bolt{position:absolute;top:10px;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle,var(--red) 0 30%,transparent 32%),repeating-conic-gradient(#eef0f3 0 20deg,#8a919b 20deg 40deg)}
.b1{left:10px}.b2{right:10px}
.studs{height:26px;background:var(--rex3) var(--studs) 6px 50%/30px 26px repeat-x;border-top:2px solid #0d0a10;border-bottom:2px solid #0d0a10}

/* ---------- inner page head: enamel name-board ---------- */
.namehead{--pc:var(--teal);--pi:var(--cream);position:relative;overflow:hidden;background:var(--pc);color:var(--pi);padding-top:50px}
.slug-customer-support .namehead{--pc:var(--pink)}.slug-real-or-fake .namehead{--pc:var(--red)}.slug-deposit-withdrawal .namehead{--pc:var(--green)}
.slug-faq .namehead{--pc:var(--gold);--pi:var(--ink)}.slug-responsible-gaming .namehead{--pc:var(--teal-d)}.slug-about .namehead{--pc:var(--plum)}
.slug-privacy .namehead,.slug-terms .namehead{--pc:#3d3a45}
.namehead::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 88% 110%,rgba(255,255,255,.07) 0 6deg,transparent 6deg 12deg);pointer-events:none}
.nh-grid{position:relative;display:grid;gap:10px;padding-bottom:34px}
@media (min-width:880px){.nh-grid{grid-template-columns:minmax(0,1fr) 200px;align-items:center;gap:40px}}
.crumbs ol{list-style:none;margin:0 0 6px;padding:0;display:flex;flex-wrap:wrap;align-items:center;font:700 .9rem/1.3 var(--f-ui)}
.crumbs li{display:inline-flex;align-items:center}
.crumbs li+li::before{content:"";width:7px;height:7px;margin:0 10px;transform:rotate(45deg);background:currentColor;opacity:.7}
.crumbs a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:underline;text-underline-offset:.25em}
.crumbs span{opacity:.9}
.namehead h1{font-family:var(--f-disp);font-size:clamp(1.8rem,1.2rem + 2.4vw,2.9rem);max-width:24ch;text-shadow:3px 3px 0 rgba(13,10,16,.55);margin-bottom:14px}
.slug-faq .namehead h1{text-shadow:3px 3px 0 rgba(255,255,255,.45)}
html:lang(en) .namehead h1{line-height:1.1}
.namehead .lead{max-width:62ch}.namehead .lead p{margin-bottom:0}
.namehead .lead a{color:inherit}
.wheel{position:absolute;right:-70px;bottom:-80px;width:170px;height:170px;opacity:.2}
@media (min-width:880px){.wheel{position:static;width:200px;height:200px;opacity:1;justify-self:end}}
.w-tyre{fill:none;stroke:#0d0a10;stroke-width:9}.w-rim{fill:none;stroke:var(--chrome);stroke-width:3}
.w-spokes line{stroke:var(--chrome);stroke-width:1.1}.w-hub{fill:var(--red);stroke:var(--chrome);stroke-width:3}.w-cap{fill:var(--gold)}
@media (prefers-reduced-motion:no-preference){.w-spokes,.w-hub{transform-origin:60px 60px;animation:spin 38s linear infinite}}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- reading area ---------- */
.read{display:grid;gap:40px;padding-top:48px;padding-bottom:56px}
@media (min-width:1080px){.read{grid-template-columns:minmax(0,1fr) 300px;gap:64px}}
.art{max-width:44rem;min-width:0;counter-reset:sec}
.art>.intro-rest{font-size:1.04em}
.sec{margin-top:2.8rem}
.art>.sec:first-child,.art>.intro-rest+.sec{margin-top:1.4rem}
.sec h2,.faq h2{display:flex;align-items:flex-start;gap:14px;margin-bottom:1.1rem;padding-bottom:.8rem;font-family:var(--f-disp);font-size:clamp(1.45rem,1.15rem + 1.2vw,2rem);color:var(--ink);
 background:linear-gradient(var(--red),var(--red)) left bottom/100% 3px no-repeat,linear-gradient(var(--teal),var(--teal)) left calc(100% - 7px)/100% 1px no-repeat}
.h2t{padding-top:.18em}
html:lang(bn) .h2t{padding-top:.05em}
.medal{--mc:var(--red);flex:none;display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;color:#fff8ec;font:700 1rem/1 var(--f-ui);
 background:radial-gradient(circle,var(--mc) 0 50%,#0d0a10 51% 55%,transparent 56%),repeating-conic-gradient(#f1f3f5 0 10deg,#9aa1ab 10deg 20deg);box-shadow:0 0 0 2px #0d0a10}
.sec:nth-of-type(5n+2) .medal{--mc:var(--teal)}.sec:nth-of-type(5n+3) .medal{--mc:var(--green)}.sec:nth-of-type(5n+4) .medal{--mc:var(--pink)}.sec:nth-of-type(5n+5) .medal{--mc:var(--plum)}
.medal-q{--mc:var(--gold);color:var(--ink);font-family:var(--f-plate);font-size:1.2rem}
.art h3{margin:1.6em 0 .6em;font:700 1.15rem/1.4 var(--f-ui);color:var(--ink);padding-left:14px;border-left:4px solid var(--red)}
.art ul,.art ol{margin:0 0 1.2em;padding-left:0;list-style:none}
.art li{position:relative;padding-left:1.7em;margin-bottom:.55em}
.art ul>li::before{content:"";position:absolute;left:.25em;top:.62em;width:.55em;height:.55em;transform:rotate(45deg);background:var(--red);box-shadow:2px 2px 0 var(--gold)}
.art ul>li:nth-child(3n+2)::before{background:var(--teal)}.art ul>li:nth-child(3n)::before{background:var(--pink)}
.art ol{counter-reset:li}
.art ol>li{counter-increment:li;padding-left:2.3em}
.art ol>li::before{content:counter(li);position:absolute;left:0;top:.2em;width:1.65em;height:1.65em;border-radius:50%;display:grid;place-items:center;background:var(--rex);color:var(--gold);font:700 .85rem/1 var(--f-ui)}
html:lang(bn) .art ol>li::before{content:counter(li,bengali)}
.art strong{color:#120d14}
.art blockquote{margin:1.4em 0;padding:14px 20px;border-left:6px solid var(--teal);background:var(--cream2)}
.art table{display:block;overflow-x:auto;border-collapse:collapse;margin:0 0 1.4em;font:400 .95rem/1.5 var(--f-ui);max-width:100%}
.art th,.art td{padding:10px 12px;border:1px solid var(--line);text-align:left;vertical-align:top;min-width:8em}
.art th{background:var(--rex);color:var(--cream)}
.art tr:nth-child(even) td{background:var(--cream2)}
.sec-plain{margin-top:1.2rem}

/* FAQ: enamel strips with chrome toggles */
.faq{margin-top:3rem}
.faq-list{display:grid;gap:10px}
.faq details{--fc:var(--red);background:var(--cream2);border-radius:8px;border-left:7px solid var(--fc);box-shadow:0 1px 0 var(--line)}
.faq details:nth-child(4n+2){--fc:var(--teal)}.faq details:nth-child(4n+3){--fc:var(--gold)}.faq details:nth-child(4n+4){--fc:var(--pink)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:12px 16px;cursor:pointer;list-style:none;font:700 1.02rem/1.5 var(--f-ui)}
.faq summary::-webkit-details-marker{display:none}
.tog{flex:none;width:30px;height:30px;border-radius:50%;position:relative;background:repeating-conic-gradient(#f1f3f5 0 15deg,#9aa1ab 15deg 30deg);box-shadow:0 0 0 2px #0d0a10;transition:transform .25s}
.tog::before,.tog::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:3px;margin:-1.5px 0 0 -6px;background:#0d0a10;border-radius:2px}
.tog::after{transform:rotate(90deg)}
details[open] .tog{transform:rotate(45deg)}
.ans{padding:0 18px 6px 16px}
.cta-plate{margin-top:3rem;padding:24px;border-radius:10px;background:var(--teal);color:var(--cream);box-shadow:inset 0 0 0 3px var(--teal),inset 0 0 0 5px rgba(247,239,223,.55),4px 4px 0 var(--rex)}
.cta-plate p{margin-bottom:16px}
.cta-plate .btn{background:var(--gold);color:var(--ink)}

/* aside: hood-panel TOC + demo tag */
.side{min-width:0}
.side-in{display:grid;gap:22px}
@media (min-width:1080px){.side-in{position:sticky;top:18px;max-height:calc(100vh - 36px);overflow-y:auto;scrollbar-width:thin}}
.toc{position:relative;background:var(--rex);background-image:var(--quilt);color:var(--cream);border-radius:10px;padding:22px 14px 14px}
.toc::before{content:"";position:absolute;left:0;right:0;top:0;height:13px;background:var(--app) 0 0/42px 13px repeat-x;border-radius:10px 10px 0 0}
.toc-h{margin:6px 6px 10px;font:700 .95rem/1.3 var(--f-ui);color:var(--gold)}
html:lang(en) .toc-h{text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.toc a{display:flex;gap:10px;align-items:flex-start;min-height:44px;padding:9px 8px;border-radius:6px;color:#eadfcd;text-decoration:none;font:400 .95rem/1.45 var(--f-ui)}
.toc a b{flex:none;min-width:1.7em;color:var(--gold);font-weight:700}
.toc a:hover,.toc a.on{background:var(--cream);color:var(--ink)}
.toc a.on b{color:var(--red)}
.demo-tag{position:relative;padding:26px 20px 20px;border-radius:10px 10px 10px 10px;background:var(--cream2);border:2px dashed var(--red);font:400 .98rem/1.6 var(--f-ui)}
.demo-tag::before{content:"";position:absolute;top:10px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--cream);box-shadow:inset 0 0 0 2px var(--steel)}
.demo-t{font:400 1.3rem/1.3 var(--f-disp);color:var(--red);margin-bottom:.4em}
@media (max-width:1079.98px){.side{order:-1}.slug-home .side,.page-home .side{order:0}.page-inner .demo-tag{display:none}}

/* ---------- related tins ---------- */
.more{background:var(--cream2);border-top:1px solid var(--line);padding:48px 0 70px;container-type:inline-size}
.more-h{font-family:var(--f-disp);font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);margin-bottom:22px}
.tins{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
@container (min-width:560px){.tins{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:900px){.tins{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tin{--tc:var(--red);position:relative;display:flex;flex-direction:column;gap:8px;height:100%;min-height:150px;padding:22px 22px 20px;border-radius:9px;background:var(--tc);color:var(--cream);text-decoration:none;
 box-shadow:inset 0 0 0 4px var(--tc),inset 0 0 0 6px rgba(247,239,223,.5),4px 4px 0 var(--rex);transition:transform .18s,box-shadow .18s;overflow:hidden}
.tins li:nth-child(6n+2) .tin{--tc:var(--teal)}.tins li:nth-child(6n+3) .tin{--tc:var(--green)}.tins li:nth-child(6n+4) .tin{--tc:var(--pink)}.tins li:nth-child(6n+5) .tin{--tc:var(--plum)}.tins li:nth-child(6n) .tin{--tc:var(--rex2)}
.tin:hover{color:var(--cream);transform:translate(-2px,-2px);box-shadow:inset 0 0 0 4px var(--tc),inset 0 0 0 6px rgba(247,239,223,.7),6px 6px 0 var(--rex)}
.tin-n{position:absolute;right:14px;top:4px;font:400 2.6rem/1.2 var(--f-disp);color:rgba(247,239,223,.22)}
.tin strong{font:700 1.15rem/1.35 var(--f-ui);padding-right:2.6rem}
.tin span{font:400 .98rem/1.6 var(--f-ui);color:#f3e9d6}

/* ---------- footer: rexine + mudguard flap ---------- */
.foot{position:relative;margin-top:26px;background:var(--rex);background-image:var(--quilt);color:#e9dfcf;padding-top:44px}
.applique-up{top:auto;bottom:100%;transform:scaleY(-1);transform-origin:center}
.foot-grid{display:grid;gap:30px;padding-bottom:36px}
@media (min-width:820px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr;gap:48px}}
.indie-f{margin:18px 0 8px;font:700 .95rem/1.5 var(--f-ui);color:var(--gold)}
.disc{font:400 .98rem/1.7 var(--f-ui);color:#d9cdbb;max-width:44ch}
.fh{margin:0 0 8px;font:700 .95rem/1.3 var(--f-ui);color:var(--gold)}
html:lang(en) .fh{text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}
.fcol ul{list-style:none;margin:0;padding:0}
.fcol a{display:flex;align-items:center;min-height:44px;color:#f1e7d6;text-decoration:none;font:400 1rem/1.35 var(--f-ui);border-bottom:1px dashed rgba(240,162,15,.25)}
.fcol a:hover{color:var(--gold)}
.flap{background:var(--red);clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,18px 100%);color:var(--cream);border-top:4px solid #0d0a10}
.flap-in{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 22px;min-height:76px;padding-top:12px;padding-bottom:14px;font:700 .95rem/1.3 var(--f-ui)}
.age{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:radial-gradient(circle,#e0405a 0 56%,#7a0f22 58% 64%,#e9ecf0 66% 84%,#7d848e 86%);color:#fff;font:700 .95rem/1 var(--f-ui);box-shadow:0 0 0 2px #0d0a10}
.up{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;color:var(--cream)}
.up:hover{color:#ffd166}

/* 404 */
.nf{padding-top:70px;padding-bottom:80px;text-align:left}
.nf-code{font:400 5rem/1 var(--f-plate);color:var(--red);text-shadow:4px 4px 0 var(--rex);margin-bottom:10px}
.nf h1{font-family:var(--f-disp);font-size:2.2rem;margin-bottom:12px}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.hood,.foot,.side,.more,.screen{display:none}}