/* equal9.info — Equal arms: a beam balance read as the equation "= 9" */
:root{
  --ground:#EFE7D4;--ground-2:#E6DCC4;--paper:#FBF8F0;--paper-2:#F5EFE1;
  --line:#D8CDB3;--line-2:#BFAF8A;
  --ink:#15282C;--ink-2:#3C5155;--ink-3:#586767;
  --sea:#1C6155;--sea-d:#0F4238;--sea-t:#DCE9E3;
  --brass:#B8893A;--brass-l:#E2C27B;--brass-d:#7A5819;
  --verm:#B83E26;
  --night:#14262A;--night-2:#1B3236;--night-line:#33504F;--night-mute:#A8B7B1;
  --fh:"Castoro","Noto Serif Myanmar",Georgia,serif;
  --fb:"Gantari","Padauk","Noto Sans Myanmar",system-ui,sans-serif;
  --font-head:var(--fh);--font-body:var(--fb);
  --surface:var(--paper);--surface-2:var(--paper-2);--border:var(--line);--primary:var(--sea);--primary-contrast:#fff;--accent:var(--brass-l);--heading:var(--ink);--text:var(--ink);--muted:var(--ink-3);
  --gut:clamp(16px,4vw,40px);--max:1240px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:16px}
body{margin:0;background:var(--ground);color:var(--ink);font:400 17px/1.7 var(--fb);overflow-x:hidden;text-rendering:optimizeLegibility}
:lang(my) body,body:lang(my){line-height:1.85}
img,svg{max-width:100%}
a{color:var(--sea);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--sea-d);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--verm);outline-offset:3px;border-radius:2px}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.skip{position:absolute;left:12px;top:-80px;z-index:50;background:var(--ink);color:var(--paper);padding:12px 18px;border-radius:0 0 6px 6px;font-weight:700;text-decoration:none}
.skip:focus{top:0;color:var(--paper)}
h1,h2,h3{font-family:var(--fh);font-weight:400;color:var(--ink);margin:0}
:lang(my) h1,:lang(my) h2,:lang(my) h3{font-weight:600;line-height:1.7}
.w{display:inline-block;max-width:100%}
p{margin:0 0 1em}

/* ===== hallmark "=9" ===== */
.hm{--s:46px;position:relative;flex:none;display:inline-grid;grid-template-columns:auto auto;align-items:center;justify-content:center;gap:3px;width:var(--s);height:var(--s);border-radius:50%;background:var(--paper);box-shadow:inset 0 0 0 2px var(--brass),inset 0 0 0 5px var(--paper),inset 0 0 0 6px var(--brass-d)}
.hm i{display:block;width:calc(var(--s)*.22);height:calc(var(--s)*.18);background:linear-gradient(var(--verm) 0 34%,transparent 34% 66%,var(--verm) 66%)}
.hm b{font:400 calc(var(--s)*.5)/1 "Castoro",Georgia,serif;color:var(--ink);transform:translateY(-.04em)}

/* ===== header ===== */
.hdr{background:var(--paper);position:relative;z-index:10}
.strip{background:var(--night);color:var(--paper)}
.strip-in{display:flex;align-items:center;gap:8px 16px;min-height:44px}
.strip-note{flex:1;min-width:0;font-size:15px;color:var(--night-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lang{display:flex;align-items:center;gap:2px}
.lang a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:inherit;text-decoration:none;font-size:15px;font-weight:600;position:relative}
.lang a[aria-current]{color:var(--brass-l)}
.lang a[aria-current]::after{content:"";position:absolute;left:12px;right:12px;bottom:9px;height:5px;background:linear-gradient(currentColor 0 1.5px,transparent 1.5px 3.5px,currentColor 3.5px)}
.lang a:hover{color:var(--brass-l)}
.strip-cta{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--brass-l);font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap}
.strip-cta::before{content:"";width:14px;height:8px;background:linear-gradient(currentColor 0 2px,transparent 2px 6px,currentColor 6px)}
.strip-cta:hover{color:#fff}
.bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 16px;min-height:76px;padding-block:10px}
.brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;min-height:48px;min-width:0}
.brand:hover{color:var(--ink)}
.wm{display:flex;flex-direction:column;line-height:1}
.wm-n{font:400 29px/1 var(--fh);letter-spacing:-.01em}
.wm-t{font-size:13px;font-weight:600;color:var(--ink-3);margin-top:5px}
.wm-t:lang(en){letter-spacing:.14em;text-transform:uppercase}
.toggle{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 16px;border:1.5px solid var(--ink);border-radius:6px;background:transparent;color:var(--ink);font:700 16px/1 var(--fb);cursor:pointer}
.toggle:hover{background:var(--paper-2)}
.eq{position:relative;width:20px;height:12px}
.eq i{position:absolute;left:0;right:0;height:2.5px;background:currentColor;border-radius:2px;transition:transform .25s ease,top .25s ease}
.eq i:first-child{top:1px}.eq i:last-child{top:8.5px}
.hdr.open .eq i:first-child{top:4.75px;transform:rotate(45deg)}
.hdr.open .eq i:last-child{top:4.75px;transform:rotate(-45deg)}
.nav{grid-column:1/-1;display:none}
.hdr.open .nav{display:block}
.nav ul{list-style:none;margin:0;padding:0}
.nav a{display:flex;align-items:center;gap:14px;min-height:50px;padding:6px 2px;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:17px;font-weight:600}
.nav a::before{content:"";flex:none;width:14px;height:8px;background:linear-gradient(var(--line-2) 0 2px,transparent 2px 6px,var(--line-2) 6px)}
.nav a[aria-current]::before{background:linear-gradient(var(--verm) 0 2px,transparent 2px 6px,var(--verm) 6px)}
.nav a:hover{color:var(--sea)}
.beam{position:relative;height:22px;background:var(--paper)}
.beam-bar{position:absolute;left:0;right:0;top:7px;height:8px;background:linear-gradient(var(--ink) 0 2px,transparent 2px 6px,var(--ink) 6px);transform-origin:50% 50%;transition:transform .6s cubic-bezier(.3,1.6,.5,1)}
.beam-pv{position:absolute;left:50%;top:3px;width:16px;height:16px;margin-left:-8px;border-radius:50%;background:var(--brass);box-shadow:0 0 0 3px var(--paper),inset 0 0 0 4px var(--brass-l)}
.beam-pv::after{content:"";position:absolute;left:50%;top:15px;width:22px;height:8px;margin-left:-11px;background:var(--ink);clip-path:polygon(50% 0,100% 100%,0 100%)}
@media (min-width:1200px){
  .bar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);min-height:88px}
  .brand{grid-column:2;grid-row:1;padding-inline:28px;position:relative;z-index:1}
  .toggle{display:none}
  .nav{display:grid;grid-column:1/-1;grid-row:1;grid-template-columns:subgrid;align-items:center}
  .nav ul{display:flex;flex-wrap:wrap;gap:2px 4px}
  .nav .pan-l{grid-column:1;justify-content:space-evenly}
  .nav .pan-r{grid-column:3;justify-content:space-evenly}
  .nav a{position:relative;min-height:44px;padding:6px 12px;border:0;font-size:16px}
  .nav a::before{display:none}
  .nav a[aria-current]{color:var(--verm)}
  .nav a[aria-current]::after,.nav a:hover::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:6px;background:linear-gradient(currentColor 0 1.5px,transparent 1.5px 4.5px,currentColor 4.5px)}
  .hdr:has(.pan-l a:hover) .beam-bar{transform:rotate(-.5deg)}
  .hdr:has(.pan-r a:hover) .beam-bar{transform:rotate(.5deg)}
}
@media (max-width:1199.98px){.hdr.open .nav{padding-bottom:12px}.nav .pan-r a:last-child{border-bottom:0}}
@media (max-width:640px){.strip-note{display:none}.strip-in{justify-content:space-between}}
@media (max-width:400px){.strip-cta{display:none}.strip-in{justify-content:flex-end}.wm-n{font-size:25px}.hm{--s:42px}.toggle-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.toggle{padding:0 13px}}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:50px;padding:10px 22px;border-radius:6px;background:var(--sea);color:#fff;font:700 16px/1.3 var(--fb);text-decoration:none;box-shadow:inset 0 -3px 0 var(--sea-d);transition:background .2s,transform .2s;text-align:center}
.btn::before{content:"";flex:none;width:14px;height:8px;background:linear-gradient(currentColor 0 2px,transparent 2px 6px,currentColor 6px)}
.btn:hover{background:var(--sea-d);color:#fff}
.btn:active{transform:translateY(1px)}
.btn-g{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-g:hover{background:var(--ink);color:var(--paper)}
.btn-s{min-height:46px;padding:8px 16px;font-size:15px}

/* ===== home: the scale ===== */
.scale{background:radial-gradient(120% 70% at 50% 0%,var(--paper) 0,var(--ground) 62%),var(--ground);border-bottom:1px solid var(--line)}
.scale-in{display:grid;grid-template-columns:minmax(0,1fr);padding-block:18px 36px;position:relative}
.sbeam{position:relative;height:64px;z-index:2}
.sbeam-bar{position:absolute;left:14%;right:14%;top:26px;height:12px;border-radius:6px;background:linear-gradient(var(--brass-l),var(--brass) 55%,var(--brass-d));box-shadow:0 2px 0 rgba(21,40,44,.18);transform-origin:50% 50%;animation:settle 1.8s cubic-bezier(.3,1.4,.5,1) .2s both}
.sbeam-bar::before,.sbeam-bar::after{content:"";position:absolute;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:var(--paper);box-shadow:inset 0 0 0 3px var(--brass-d)}
.sbeam-bar::before{left:-6px}.sbeam-bar::after{right:-6px}
.sbeam-pv{position:absolute;left:50%;top:4px;transform:translateX(-50%)}
.sbeam-pv .hm{--s:56px;box-shadow:inset 0 0 0 2px var(--brass),inset 0 0 0 6px var(--paper),inset 0 0 0 7px var(--brass-d),0 6px 14px rgba(21,40,44,.18)}
@keyframes settle{0%{transform:rotate(-2.2deg)}35%{transform:rotate(1.4deg)}65%{transform:rotate(-.6deg)}100%{transform:rotate(0)}}
@keyframes weigh{0%,100%{transform:rotate(-1.1deg)}50%{transform:rotate(1.1deg)}}
.scale.weighing .sbeam-bar{animation:weigh .5s ease-in-out infinite}
.scale.won .sbeam-bar{background:linear-gradient(#F4DFA6,var(--brass-l) 55%,var(--brass));box-shadow:0 0 0 4px rgba(226,194,123,.35),0 2px 0 rgba(21,40,44,.18)}
.pan{position:relative;padding-top:46px;min-width:0}
.hang{position:absolute;top:0;left:10%;width:80%;height:46px;overflow:visible;fill:none;stroke:var(--ink-2);stroke-width:1.4;vector-effect:non-scaling-stroke}
.hang path{vector-effect:non-scaling-stroke}
.hook{position:absolute;left:50%;top:-8px;width:12px;height:12px;margin-left:-6px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--ink-2)}
.hook::before{content:"";position:absolute;left:5px;bottom:100%;width:2px;height:26px;background:var(--ink-2)}
.h2t{min-width:0}
.pan-b{position:relative;border-top:4px solid var(--brass);border-radius:4px 4px 34px 34px/4px 4px 22px 22px;min-width:0}
.pan-copy .pan-b{background:var(--paper);padding:clamp(22px,4vw,40px) clamp(18px,4vw,40px) clamp(28px,4vw,44px);box-shadow:0 1px 0 var(--line),0 14px 30px -18px rgba(21,40,44,.35)}
.kick{display:inline-flex;align-items:center;gap:10px;margin:0 0 18px;padding:6px 12px;border-radius:4px;background:var(--sea-t);color:var(--sea-d);font-size:15px;font-weight:700}
.pan-copy h1{font-size:clamp(34px,4.2vw,50px);line-height:1.08;letter-spacing:-.015em;margin-bottom:18px;text-wrap:balance}
.pan-copy h1:lang(my),:lang(my) .pan-copy h1{font-size:clamp(25px,2.7vw,34px);line-height:1.62;letter-spacing:0}
.lead p{font-size:clamp(17px,1.4vw,19px);color:var(--ink-2)}
.lead p:last-child{margin-bottom:0}
.acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.pan-game .pan-b{background:var(--night);color:var(--paper);padding:8px 8px 14px;box-shadow:0 18px 34px -18px rgba(21,40,44,.6)}
.pan-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 8px 6px;font-size:15px;font-weight:700;color:var(--brass-l)}
.age{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 6px;border-radius:50%;box-shadow:inset 0 0 0 2px currentColor;font:700 14px/1 var(--fb);color:var(--brass-l)}
.post{display:none}
.base{list-style:none;margin:28px 0 0;padding:14px 18px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px;background:var(--ink);color:var(--paper);border-radius:6px;font-size:16px;font-weight:600;position:relative;z-index:1}
.base li{display:inline-flex;align-items:center;gap:12px;min-height:32px}
.base li+li::before{content:"";width:12px;height:7px;background:linear-gradient(var(--brass-l) 0 2px,transparent 2px 5px,var(--brass-l) 5px)}
@media (min-width:1000px){
  .scale-in{grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr);column-gap:0;padding-block:24px 48px}
  .sbeam{grid-column:1/-1}
  .sbeam-bar{left:24%;right:24%}
  .pan{align-self:start}
  .pan-copy{grid-column:1;margin-right:12px}
  .pan-game{grid-column:3;margin-left:12px}
  .post{display:block;position:absolute;left:50%;top:70px;bottom:70px;width:12px;margin-left:-6px;background:linear-gradient(90deg,var(--brass-d),var(--brass-l) 45%,var(--brass) 70%,var(--brass-d));border-radius:6px 6px 0 0}
  .base{grid-column:1/-1;margin-top:34px}
  .pan-copy .pan-b{padding:44px 40px 46px}
}
@media (max-width:999.98px){.pan-game{margin-top:26px}.pan-game .hang{left:18%;width:64%}}

/* ===== inner page head ===== */
.ph{background:linear-gradient(var(--paper),var(--ground));border-bottom:1px solid var(--line)}
.ph-in{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding-block:22px 40px}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:0 4px;font-size:15px}
.crumbs li{display:inline-flex;align-items:center;gap:4px}
.crumbs li+li::before{content:"";width:10px;height:6px;margin:0 6px;background:linear-gradient(var(--line-2) 0 1.5px,transparent 1.5px 4.5px,var(--line-2) 4.5px)}
.crumbs a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-2);font-weight:600}
.crumbs span{color:var(--ink-3)}
.ph-t h1{font-size:clamp(32px,4.4vw,54px);line-height:1.08;letter-spacing:-.015em;max-width:22ch;text-wrap:balance;margin-bottom:16px}
.ph-t h1:lang(my),:lang(my) .ph-t h1{font-size:clamp(25px,3vw,36px);line-height:1.62;letter-spacing:0;max-width:30ch}
.ph-t .lead{max-width:62ch}
.stack{display:none}
@media (min-width:860px){
  .ph-in{grid-template-columns:minmax(0,1fr) 230px;column-gap:48px;padding-block:24px 48px}
  .crumbs{grid-column:1}
  .ph-t{grid-column:1}
  .stack{grid-column:2;grid-row:1/3;align-self:end;display:flex;flex-direction:column-reverse;align-items:center;gap:3px;padding-bottom:12px;border-bottom:4px solid var(--ink);position:relative}
  .stack::before{content:"";position:absolute;left:50%;bottom:-18px;width:60px;height:14px;margin-left:-30px;background:var(--ink);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}
  .stack span{display:block;height:20px;width:calc(54px + (var(--n) - var(--i)) * 17px);border-radius:3px;background:linear-gradient(90deg,var(--brass-d),var(--brass-l) 32%,var(--brass) 64%,var(--brass-d));box-shadow:inset 0 2px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,0,.18);animation:drop .5s cubic-bezier(.3,1.5,.6,1) both;animation-delay:calc(var(--i) * 70ms)}
  .stack::after{content:"";width:24px;height:14px;border-radius:12px 12px 3px 3px;background:var(--ink)}
}
@keyframes drop{from{transform:translateY(-10px)}to{transform:none}}

/* ===== page grid, toc, content ===== */
.page{background:var(--paper);padding-block:clamp(32px,5vw,64px)}
.grid{display:grid;grid-template-columns:minmax(0,1fr);gap:32px}
.side{min-width:0}
.toc{position:relative;padding:4px 0 4px 34px;background:repeating-linear-gradient(to bottom,var(--line-2) 0 1px,transparent 1px 9px) 0 0/10px 100% no-repeat,linear-gradient(var(--ink),var(--ink)) 12px 0/1.5px 100% no-repeat}
.toc-t{margin:0 0 6px;font-size:15px;font-weight:700;color:var(--ink-3)}
.toc-t:lang(en){text-transform:uppercase;letter-spacing:.12em;font-size:13px}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.toc li{counter-increment:t;position:relative}
.toc a{display:grid;grid-template-columns:28px minmax(0,1fr);align-items:center;min-height:44px;padding:6px 0;color:var(--ink-2);text-decoration:none;font-size:15.5px;line-height:1.45}
.toc a::before{content:counter(t,decimal-leading-zero);font:400 15px/1 var(--fh);color:var(--brass-d)}
.toc:lang(my) a::before,:lang(my) .toc a::before{content:counter(t,myanmar)}
.toc a:hover{color:var(--ink)}
.toc a.on{color:var(--ink);font-weight:700}
.toc a.on::after{content:"";position:absolute;left:-30px;top:50%;width:16px;height:12px;margin-top:-6px;background:var(--verm);clip-path:polygon(0 50%,100% 0,100% 100%)}
.mini{display:none}
@media (min-width:1024px){
  .grid{grid-template-columns:minmax(0,1fr) 290px;gap:64px;align-items:start}
  .side{grid-column:2;grid-row:1}
  .content{grid-column:1;grid-row:1}
  .side-in{position:sticky;top:18px;display:flex;flex-direction:column;gap:26px;max-height:calc(100vh - 36px);overflow:auto;padding-right:4px}
  .mini{display:block;position:relative;padding:40px 20px 22px;background:var(--night);color:var(--paper);border-radius:4px 4px 28px 28px/4px 4px 18px 18px;border-top:4px solid var(--brass)}
  .mini::before{content:"";position:absolute;left:50%;top:10px;width:28px;height:16px;margin-left:-14px;border-radius:14px 14px 3px 3px;box-shadow:inset 0 0 0 2px var(--brass-l)}
  .mini-t{font:400 21px/1.3 var(--fh);color:var(--brass-l);margin:0 0 8px}
  .mini-t:lang(my),:lang(my) .mini-t{font-size:18px;line-height:1.7;font-weight:600}
  .mini-p{font-size:15.5px;color:var(--night-mute)}
  .mini .btn{width:100%;background:var(--brass-l);color:var(--ink);box-shadow:inset 0 -3px 0 var(--brass)}
  .mini .btn:hover{background:#F0D595}
}
@media (max-width:1023.98px){.toc{padding-bottom:10px;border-bottom:1px solid var(--line)}}

.content{min-width:0;max-width:74ch;counter-reset:s}
.content>.intro{margin-bottom:8px}
.content h2{counter-increment:s;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:16px;align-items:start;margin:56px 0 22px;padding-bottom:18px;font-size:clamp(26px,2.6vw,34px);line-height:1.15;letter-spacing:-.01em;background:linear-gradient(var(--verm),var(--verm)) 0 100%/64px 2px no-repeat,linear-gradient(var(--verm),var(--verm)) 0 calc(100% - 6px)/64px 2px no-repeat}
.content h2:lang(my),:lang(my) .content h2{font-size:clamp(21px,2.1vw,26px);line-height:1.65;letter-spacing:0}
.content h2::before{content:counter(s);display:grid;place-items:center;width:44px;height:44px;margin-top:-2px;border-radius:50%;font:400 20px/1 var(--fh);color:var(--ink);background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--brass),inset 0 0 0 4px var(--paper),inset 0 0 0 5px var(--brass-d)}
.content h2:lang(my)::before,:lang(my) .content h2::before{content:counter(s,myanmar);line-height:1.6}
.content .sec:first-child h2,.content>.intro+.sec h2{margin-top:8px}
.content h3{font-size:22px;line-height:1.3;margin:30px 0 10px}
.content h3:lang(my),:lang(my) .content h3{font-size:19px;line-height:1.7}
.content p,.content li{max-width:70ch}
.content ul,.content ol{margin:0 0 1.2em;padding:0}
.content ul{list-style:none}
.content ul>li{position:relative;padding-left:28px;margin-bottom:.5em}
.content ul>li::before{content:"";position:absolute;left:2px;top:.72em;width:13px;height:7px;background:linear-gradient(var(--brass-d) 0 2px,transparent 2px 5px,var(--brass-d) 5px)}
.content ol{padding-left:1.6em}
.content ol>li{margin-bottom:.5em;padding-left:4px}
.content ol>li::marker{font-family:var(--fh);color:var(--brass-d)}
.content strong{color:var(--ink);font-weight:700}
.content table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;margin:0 0 1.4em;font-size:16px}
.content th,.content td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.content th{background:var(--paper-2);font-weight:700}
.content blockquote{margin:0 0 1.2em;padding:14px 20px;border-left:4px double var(--brass);background:var(--paper-2)}
.content a{overflow-wrap:anywhere}

/* faq: plus becomes equals */
.faq{margin-top:56px}
.faq-l{border-top:2px solid var(--ink)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:grid;grid-template-columns:minmax(0,1fr) 36px;gap:16px;align-items:center;min-height:60px;padding:12px 2px;cursor:pointer;list-style:none;font-weight:700;font-size:17.5px;line-height:1.5}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover .q{color:var(--sea)}
.pm{position:relative;width:36px;height:36px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-2)}
.pm i{position:absolute;left:10px;right:10px;top:50%;height:2px;margin-top:-1px;background:var(--ink);transition:transform .3s ease}
.pm i:last-child{transform:rotate(90deg)}
.faq details[open] .pm{background:var(--ink);box-shadow:none}
.faq details[open] .pm i{background:var(--brass-l)}
.faq details[open] .pm i:first-child{transform:translateY(-3.5px)}
.faq details[open] .pm i:last-child{transform:translateY(3.5px)}
.faq .a{padding:0 48px 18px 2px;color:var(--ink-2)}
.faq .a p:last-child{margin-bottom:0}

/* counterweight cta */
.cw{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 20px;align-items:center;margin-top:52px;padding:24px;background:var(--ground);border-radius:4px 4px 28px 28px/4px 4px 18px 18px;border-top:4px solid var(--brass)}
.cw p{margin:0;font:400 20px/1.4 var(--fh)}
.cw p:lang(my),:lang(my) .cw p{font-size:18px;line-height:1.75;font-weight:600}
.cw .btn{grid-column:1/-1;justify-self:start}
.cw-w{width:44px;height:50px;position:relative}
.cw-w::before{content:"";position:absolute;left:14px;top:0;width:16px;height:12px;border-radius:8px 8px 2px 2px;box-shadow:inset 0 0 0 2.5px var(--ink)}
.cw-w::after{content:"";position:absolute;left:0;right:0;bottom:0;height:38px;background:var(--ink);clip-path:polygon(22% 0,78% 0,100% 100%,0 100%);border-radius:4px}

/* ===== related: a row of weights ===== */
.rel{background:var(--ground);padding-block:clamp(40px,6vw,72px);border-top:1px solid var(--line)}
.rel-t{font-size:clamp(28px,3vw,38px);margin-bottom:34px}
.rel-t:lang(my),:lang(my) .rel-t{font-size:clamp(22px,2.4vw,28px)}
.wts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:34px 20px}
.wt{position:relative;display:flex;flex-direction:column;gap:8px;padding:24px 22px 24px;background:var(--paper);border-radius:6px 6px 22px 22px/6px 6px 14px 14px;box-shadow:inset 0 0 0 1.5px var(--ink),0 10px 20px -16px rgba(21,40,44,.5);color:var(--ink);text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}
.wt-k{position:absolute;left:50%;top:-14px;width:42px;height:16px;margin-left:-21px;border-radius:14px 14px 3px 3px;background:var(--ink)}
.wt strong{font:400 21px/1.3 var(--fh)}
.wt strong:lang(my),:lang(my) .wt strong{font-size:18px;line-height:1.7;font-weight:600}
.wt-d{font-size:15.5px;color:var(--ink-3);line-height:1.6}
.wt:hover{color:var(--ink);transform:translateY(-4px);box-shadow:inset 0 0 0 1.5px var(--ink),0 18px 26px -16px rgba(21,40,44,.55)}
.wt:hover .wt-k{background:var(--verm)}
.wt:hover strong{color:var(--sea)}

/* ===== footer ===== */
.ft{background:var(--night);color:var(--paper)}
.beam-ft{background:var(--night)}
.beam-ft .beam-bar{background:linear-gradient(var(--brass) 0 2px,transparent 2px 6px,var(--brass) 6px)}
.beam-ft .beam-pv{box-shadow:0 0 0 3px var(--night),inset 0 0 0 4px var(--brass-l)}
.beam-ft .beam-pv::after{background:var(--brass)}
.ft-g{display:grid;grid-template-columns:minmax(0,1fr);gap:30px;padding-block:44px 30px}
.ft .brand{color:var(--paper)}
.ft .wm-t{color:var(--night-mute)}
.ft-d{margin:18px 0 0;max-width:46ch;color:var(--night-mute);font-size:16px}
.ft-h{margin:0 0 8px;font:400 20px/1.3 var(--fh);color:var(--brass-l)}
.ft-h:lang(my),:lang(my) .ft-h{font-size:17px;line-height:1.7;font-weight:600}
.ft ul{list-style:none;margin:0;padding:0}
.ft-c a{display:flex;align-items:center;min-height:44px;color:var(--paper);text-decoration:none;border-bottom:1px solid var(--night-line);font-size:16px}
.ft-c a:hover{color:var(--brass-l)}
.ft-bot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;padding-block:18px 28px;border-top:1px solid var(--night-line);font-size:15px;color:var(--night-mute)}
.age-l{color:#F0A08C;width:44px;height:44px}
.ft-cp{flex:1;min-width:0}
.ft-top{display:inline-flex;align-items:center;min-height:44px;color:var(--brass-l);font-weight:600}
.ft .lang a{color:var(--paper)}
@media (min-width:800px){.ft-g{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:48px}}

/* 404 */
.bar-nf{grid-template-columns:1fr}
.bar-nf .brand{grid-column:1}
.nf{padding-block:64px 96px}
.nf-n{font:400 clamp(72px,16vw,160px)/1 var(--fh);color:var(--ink);margin:0 0 20px;display:flex;align-items:center;gap:.2em}
.nf-n span{color:var(--verm)}
.nf h1{font-size:clamp(30px,4vw,44px);margin-bottom:12px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media print{.hdr,.side,.rel,.ft,.post,.sbeam{display:none}}
