/* Defence Trail redesign v1 — based on "UI/UX dan Platform Flow" handoff v1 (13 Oct 2026)
   Loaded after the inline stylesheet; overrides only. */
:root{
  /* spacing scale: 4px base, 8px rhythm */
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:40px;--s-8:48px;--s-9:64px;--s-10:80px;
  /* type scale (Inter) */
  --t-xs:12px;--t-sm:14px;--t-md:16px;--t-lg:18px;--t-xl:24px;--t-2xl:32px;--t-3xl:40px;--t-hero:52px;
  --lh-tight:1.15;--lh-ui:1.5;--lh-read:1.6;
  --radius:8px;--container:1280px;--gutter:24px;
  --shadow-1:0 1px 2px #081a2f0f,0 1px 3px #081a2f14;--shadow-2:0 8px 24px #081a2f14;
}
html{scroll-padding-top:96px}
body{font:400 var(--t-md)/var(--lh-ui) Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,video{max-width:100%;height:auto}
img{object-fit:cover}
/* translation markers are internal QA aids: no dotted underlines on the public UI */
[data-mt]{text-decoration:none!important}
p{margin:0 0 var(--s-3)}p:last-child{margin-bottom:0}
/* container + 12-col grid (desktop) / 8 (tablet) / 4 (mobile) */
.wrap{max-width:var(--container);padding:0 var(--gutter)}
@media(max-width:1023px){:root{--gutter:20px}}@media(max-width:599px){:root{--gutter:16px}}
.grid{gap:var(--gutter)}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gutter)}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1023px){.g4,.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:599px){.g4,.g3,.g2{grid-template-columns:minmax(0,1fr)}}
.grid>*,.det>*,.lay>*,.hero .g>*,.kd>*{min-width:0}
/* type */
h1,h2,h3,h4{text-wrap:balance;overflow-wrap:anywhere}
h1{font:700 var(--t-hero)/1.08 Inter;letter-spacing:-.025em}
h2{font:700 var(--t-2xl)/var(--lh-tight) Inter;letter-spacing:-.02em}
h3{font:600 var(--t-lg)/1.35 Inter;letter-spacing:-.01em}
.crumb+h1,main h1:not(.hero h1){font-size:var(--t-3xl);line-height:1.12;margin-bottom:var(--s-3)}
@media(max-width:599px){h1{font-size:34px}.crumb+h1,main h1:not(.hero h1){font-size:28px}h2{font-size:var(--t-xl)}h3{font-size:var(--t-md)}}
.lead{font-size:var(--t-lg);line-height:var(--lh-read);margin:var(--s-4) 0 var(--s-5)}
.kick,.pre{font-size:var(--t-xs);letter-spacing:.08em}
.muted{color:var(--mut)}.sm{font-size:var(--t-sm);line-height:1.5}
label{font:500 var(--t-sm)/1.4 Inter;margin-bottom:var(--s-2)}
td,li{overflow-wrap:anywhere}
/* header */
.pre{padding:var(--s-2) 0;line-height:1.4}
@media(max-width:599px){.pre{font-size:10px;letter-spacing:.05em}}
.hd{height:72px;gap:var(--s-6)}
.logo svg,.logo img{width:36px;height:36px;flex:none}
@media(max-width:599px){.hd{height:64px;gap:var(--s-3)}.logo small{display:none}.logo b{font-size:18px}}
.nb{font-size:var(--t-sm);padding:var(--s-2) var(--s-3)}
.mega{top:calc(100% + var(--s-2));padding:var(--s-4);gap:var(--s-1)}
/* sections: one vertical rhythm */
section{padding:var(--s-9) 0}
section+section{padding-top:0}
.sh{margin-bottom:var(--s-5);align-items:baseline}
.crumb{padding:var(--s-5) 0 var(--s-2);font-size:var(--t-sm)}
main>.wrap>h1:first-child,main .wrap>h1:first-child{padding-top:var(--s-6)}
.hero{padding:var(--s-10) 0 var(--s-8);background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%)}
.hero .g{gap:var(--s-8)}
@media(max-width:599px){section{padding:var(--s-7) 0}.hero{padding:var(--s-7) 0 var(--s-6)}}
/* cards: equal height, aligned inner rhythm */
.card{padding:var(--s-5);border-radius:var(--radius);box-shadow:var(--shadow-1);display:flex;flex-direction:column;gap:var(--s-2);min-width:0}
.card>*{margin-top:0!important;margin-bottom:0!important}
.card.l{display:flex}
.card.l:hover{box-shadow:var(--shadow-2)}
.grid>.card{height:100%}
@media(max-width:599px){.card{padding:var(--s-4)}}
.badges{gap:var(--s-2);margin:var(--s-1) 0}
.bd{padding:var(--s-1) var(--s-3);font-size:var(--t-xs);line-height:1.4;min-height:24px;max-width:100%;white-space:normal}
.chips{gap:var(--s-2);margin:0 0 var(--s-4)}
.chip{padding:var(--s-1) var(--s-3);font-size:var(--t-sm)}
/* buttons */
.btn{padding:0 var(--s-5);font-size:var(--t-sm);border-radius:var(--radius)}
.hero .btn+.btn,.btn+.btn{margin-left:var(--s-2)}
@media(max-width:599px){.hero .btn{width:100%}.hero .btn+.btn{margin:var(--s-2) 0 0}}
/* forms */
input,select{min-height:44px;padding:0 var(--s-3);font-size:var(--t-sm)}
.search{gap:var(--s-4);margin-top:var(--s-6)}
/* tables: scroll inside a labelled container, never the page */
.tw{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;box-shadow:var(--shadow-1)}
table{font-size:var(--t-sm);line-height:1.5}
th,td{padding:var(--s-3) var(--s-4)}
th{font-size:var(--t-xs);line-height:1.3;white-space:nowrap}
tbody tr:hover td{background:var(--bg2)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
/* layouts */
.lay{gap:var(--s-6)}
.det{grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:var(--s-5)}
@media(max-width:899px){.det{grid-template-columns:minmax(0,1fr)}}
.det>div{display:flex;flex-direction:column;gap:var(--s-4)}
.det>div>*{margin:0!important}
.kd{gap:var(--s-4) var(--s-5)}.kd div b{font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--s-1)}
.tabs{margin:var(--s-5) 0;gap:var(--s-1);scrollbar-width:none}
.tabs button{padding:var(--s-3) var(--s-4);font-size:var(--t-sm)}
.vt{gap:var(--s-2)}
.filt fieldset{margin-bottom:var(--s-5)}.filt legend{margin-bottom:var(--s-2)}
.note{padding:var(--s-3) var(--s-4);margin:var(--s-4) 0;line-height:1.5}
.pg{gap:var(--s-2);margin:var(--s-6) 0}
.steps{gap:var(--s-5)}
.tree .tn{margin:var(--s-2) 0;padding:var(--s-1) var(--s-3)}
/* footer: wraps on mobile (fixes 156px overflow at 390px) */
footer{padding:var(--s-7) 0;margin-top:var(--s-8)}
footer .f{gap:var(--s-4) var(--s-5);align-items:flex-start}
#fcountries{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4)}
footer a{margin-right:0}
footer small{flex-basis:100%;line-height:1.5}
/* spacing utilities that replace ad-hoc inline values */
.mt-1{margin-top:var(--s-1)}.mt-2{margin-top:var(--s-2)}.mt-3{margin-top:var(--s-3)}.mt-4{margin-top:var(--s-4)}.mt-5{margin-top:var(--s-5)}.mt-6{margin-top:var(--s-6)}
.vt{flex-wrap:wrap}.vt .btn+.btn,.right .btn+.btn{margin-left:0}
@media(max-width:599px){.vt{width:100%;margin-left:0}.vt>*{flex:1 1 0;padding:0 var(--s-3)}}

/* ===== Layer 2: consulting-template look (own CSS, structure inspired by reference; no third-party code/assets) ===== */
:root{
  --midnight:#081A2F;--medit:#006B8F;--lgrey:#F3F5F7;--white:#FFFFFF;
  --mid:var(--midnight);--med:var(--medit);--med-d:#00566f;--grey:var(--lgrey);
  --bg:var(--white);--bg2:var(--lgrey);--fg:var(--midnight);--mut:#4a5868;--line:#dde3ea;--card:var(--white);
  --chip:#e6f1f5;--chipfg:#00566f;
  /* status: minimal, AA on white */
  --warn:#fff4e0;--warnfg:#7a4b00;--danger:#b42318;
  --radius:12px;--radius-pill:999px;
  --sec:var(--s-10);
}
/* header: white bar, airy nav, pill CTA */
.pre{background:var(--midnight);color:#c9d3de}
header{background:var(--white);box-shadow:0 4px 20px #081a2f0d;border-bottom:0}
.hd{height:80px}
.nb{font-weight:500;color:var(--midnight)}.nb[aria-current=page]{color:var(--medit);box-shadow:inset 0 -2px 0 var(--medit);border-radius:0}
.btn{border-radius:var(--radius-pill);min-height:48px;padding:0 var(--s-6);font-weight:700}
.btn.o{border-color:var(--midnight);color:var(--midnight)}.btn.o:hover{background:var(--midnight);color:#fff}
/* hero: dark midnight band, large type */
.hero{background:var(--midnight) radial-gradient(600px 400px at 85% 20%,#006B8F55,transparent 70%);color:#fff;padding:var(--s-10) 0 calc(var(--s-10) + var(--s-4))}
.hero h1{color:#fff;font-size:64px;line-height:1.05}
.hero .lead,.hero .muted,.hero [class*=muted]{color:#c9d3de}
.hero .btn.o{border-color:#fff;color:#fff}.hero .btn.o:hover{background:#fff;color:var(--midnight)}
.hero .card{color:var(--midnight);box-shadow:0 24px 60px #00000040;border:0}
@media(max-width:599px){.hero h1{font-size:36px}}
/* eyebrow (kicker) with accent bar */
.kick{color:var(--medit);font-weight:700;display:inline-flex;align-items:center;gap:var(--s-2)}
.kick:before{content:'';width:20px;height:3px;border-radius:2px;background:var(--medit)}
/* section rhythm: generous padding, alternating light-grey bands */
section{padding:var(--sec) 0}section+section{padding-top:var(--sec)}
main section:nth-of-type(even){background:var(--lgrey)}
.sh{margin-bottom:var(--s-7)}.sh h2{font-size:40px;line-height:1.15}
@media(max-width:599px){:root{--sec:var(--s-8)}.sh h2{font-size:28px}}
/* cards: white, soft shadow, 12px radius, accent top-edge on hover */
.card{border-radius:var(--radius);border:1px solid var(--line);box-shadow:0 2px 6px #081a2f0a;padding:var(--s-6)}
main section:nth-of-type(even) .card{border-color:transparent}
.card.l{position:relative;overflow:hidden}
.card.l:after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--medit);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.card.l:hover{transform:translateY(-2px);box-shadow:0 16px 40px #081a2f1f;border-color:transparent}.card.l:hover:after{transform:scaleX(1)}
@media(max-width:599px){.card{padding:var(--s-5)}}
/* stat blocks (.num and kd values) */
.num{width:48px;height:48px;background:var(--midnight);color:#fff;font-size:var(--t-lg)}
.steps>div{padding:var(--s-6);border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}
.kd>div{padding:var(--s-4);background:var(--lgrey);border-radius:var(--radius)}
.bd{border-radius:var(--radius-pill)}.bd.s{background:var(--chip);color:var(--chipfg)}
/* search panel floats over the hero edge */
.search{background:var(--white);padding:var(--s-5);border-radius:var(--radius);box-shadow:0 16px 40px #081a2f1a}
/* tables */
.tw{border-radius:var(--radius)}th{background:var(--midnight);color:#fff}
/* tabs as pills */
.tabs{border-bottom:0;gap:var(--s-2)}.tabs button{border:1px solid var(--line);border-radius:var(--radius-pill);padding:0 var(--s-5)}
.tabs button[aria-selected=true]{background:var(--midnight);color:#fff;border-color:var(--midnight)}
/* footer: dark, roomy */
footer{background:var(--midnight);color:#c9d3de;padding:var(--s-9) 0 var(--s-7);margin-top:0}
footer a,footer .logo,footer .logo b{color:#fff}footer a:hover{color:#7fc6de}footer .muted{color:#9fb0c2}
.crumb{color:var(--mut)}
.sh>div:first-child{min-width:0}
@media(max-width:599px){.sh{flex-direction:column;align-items:stretch}.vt{width:100%;margin-left:0;flex-wrap:nowrap}.vt>.btn{flex:1 1 0;min-width:0;padding:0 var(--s-2)}}
.pg{flex-wrap:wrap}.pg .btn{min-width:44px;padding:0 var(--s-3)}
form.card.search{display:grid}form.card.filt{display:block}
.search>*{margin:0!important}
.hero .card .muted,.hero .card p,.hero .card .sm{color:var(--mut)}
.hero+.wrap .search,.hero+* .search{margin-top:calc(-1 * var(--s-8));position:relative;z-index:2}
@media(max-width:599px){.badges .bd{font-size:11px}.tabs{flex-wrap:nowrap}.tabs button{padding:0 var(--s-4)}}

/* ===== Layer 3: QA 2026-10-14 tokens (authoritative) ===== */
:root{
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;--s-8:64px;--s-9:64px;--s-10:64px;
  --t-xs:12px;--t-sm:14px;--t-md:16px;--t-lg:18px;--t-xl:22px;--t-2xl:28px;--t-3xl:40px;--t-hero:52px;
  --container:1200px;--ctl:40px;--sec:var(--s-8);
}
@media(max-width:599px){:root{--sec:var(--s-7);--ctl:44px}} /* guide: 44px touch targets on mobile */
body{font-size:var(--t-md);line-height:1.5}
h1{font-size:var(--t-hero);line-height:1.15}.hero h1{font-size:var(--t-hero)}
.crumb+h1,main h1:not(.hero h1),h1[style]{font-size:var(--t-3xl)!important;line-height:1.2}
h1 span{font-size:inherit}
h2,.sh h2{font-size:var(--t-3xl);line-height:1.2}h2[style]{font-size:var(--t-2xl)!important}
h3{font-size:var(--t-xl);line-height:1.25}.card h3{font-size:var(--t-lg)}
@media(max-width:599px){h1,.hero h1{font-size:var(--t-3xl)}.crumb+h1,main h1:not(.hero h1),h1[style]{font-size:var(--t-2xl)!important}h2,.sh h2,h2[style]{font-size:var(--t-2xl)!important}h3{font-size:var(--t-lg)}}
.lead{font-size:var(--t-lg);line-height:1.6}
.sm,.crumb,small,footer,.bd,.chip,label,.filt label.c,table{font-size:var(--t-sm)}
.bd{font-size:var(--t-xs);line-height:1.5}
.kick,.pre,th,.kd div b,.logo small{font-size:var(--t-xs);line-height:1.25}
@media(max-width:599px){.pre,.badges .bd{font-size:var(--t-xs)}}
.nb,.btn,button,input,select{line-height:1.25}
/* container */
.wrap{max-width:calc(var(--container) + 2 * var(--gutter))}
/* controls: one height */
.btn,.nb,input,select,.langsw select,#langsel,.tabs button,.chip{min-height:var(--ctl)}
.btn,.nb,.tabs button{padding:0 var(--s-4)}
.btn{padding:0 var(--s-5)}
input,select,#langsel,.langsw select{padding:0 var(--s-4);border-radius:var(--radius)}
#langsel,.langsw select{max-width:none;width:auto;min-width:120px;padding-right:var(--s-6);font-size:var(--t-sm)}
/* header: no wrapping, caret inline */
.hd{gap:var(--s-5)}nav.main{gap:var(--s-1);flex-wrap:nowrap;min-width:0}
.nb{white-space:nowrap;display:inline-flex;align-items:center;gap:var(--s-1);flex:none}
.logo{gap:var(--s-3);flex:none}.right{gap:var(--s-2);flex:none}
@media(max-width:1199px){.logo small{display:none}}
/* cards: auto-fill grid, safe min width */
.grid.g2,.grid.g3,.grid.g4{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));align-items:stretch}
.lay .grid.g2{grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.card,.card.l{padding:var(--s-5)}@media(max-width:599px){.card,.card.l{padding:var(--s-4)}}
.grid{gap:var(--s-4)}.lay,.det,.hero .g{gap:var(--s-5)}.steps{gap:var(--s-4)}
/* sections */
section,section+section{padding:var(--sec) 0}footer{padding:var(--s-6) 0}
.hero{padding:var(--s-8) 0}
/* footer countries wrap */
#fcountries{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);max-width:100%}
/* lists + trees */
ul,ol{padding-left:var(--s-5)}li+li{margin-top:var(--s-1)}
.tree .tk{margin-left:var(--s-4)}.un{padding:var(--s-2) 0}
.filt fieldset{margin-bottom:var(--s-5)}.note{padding:var(--s-3) var(--s-4)}
.logo b{font-size:var(--t-xl);line-height:1.25}@media(max-width:599px){.logo b{font-size:var(--t-lg)}}
@media(max-width:1023px){form.card.filt{display:none}form.card.filt.open{display:block}}
.hero{padding-bottom:calc(var(--s-8) + var(--s-6))}

/* ===== Revision 2 (SPEKTRUM review) ===== */
:root{--container:1280px;--ctl:44px}
@media(max-width:599px){:root{--ctl:44px}}
.btn,.nb,input,select,.tabs button,.chip,.pg .btn{min-height:var(--ctl)}
.filt input[type=checkbox]{width:20px;min-height:20px}
/* Renbut gloss */
.gloss{margin:var(--s-1) 0 0!important;font:400 var(--t-sm)/1.5 Inter;color:var(--mut);display:flex;gap:var(--s-2);align-items:baseline}
h1+.gloss{font-size:var(--t-lg);margin:var(--s-2) 0 var(--s-3)!important}
.gloss-k{flex:none;font:700 var(--t-xs)/1.5 Inter;letter-spacing:.06em;color:var(--medit);border:1px solid currentColor;border-radius:4px;padding:0 var(--s-1)}
.hero .gloss{color:var(--mut)}
/* tab row: horizontal scroll with fade + arrow hint */
.tabs-wrap{position:relative}
.tabs{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;scroll-snap-align:start}
.tabs-hint{display:none}
.tabs-wrap.more:after{content:'';position:absolute;top:0;bottom:0;right:0;width:56px;pointer-events:none;background:linear-gradient(90deg,#fff0,var(--bg) 70%)}
.tabs-wrap.scrolled:before{content:'';position:absolute;top:0;bottom:0;left:0;width:32px;z-index:1;pointer-events:none;background:linear-gradient(270deg,#fff0,var(--bg))}
.tabs-wrap.more .tabs-hint{display:grid;place-items:center;position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:2;width:28px;height:28px;border-radius:50%;background:var(--midnight);color:#fff;font:700 18px/1 Inter;pointer-events:none}

/* ===== Rebase on deploy 20246334: reconcile with inline "mobile quick fix" ===== */
/* quick fix sets html,body{overflow-x:hidden}, which breaks the sticky header; clip keeps the no-overflow guarantee */
html{overflow-x:visible}body{overflow-x:clip;max-width:100%}
#fcountries{gap:var(--s-2) var(--s-4)}
nav.pg,.pg{gap:var(--s-2)}
.card,.card *{overflow-wrap:break-word}.card h3,.card td{overflow-wrap:anywhere}
a+.gloss,b+.gloss{margin-top:2px!important}
li>.gloss,td>.gloss{font-size:var(--t-xs)}
.gloss-i{color:var(--mut);font-size:var(--t-xs)}
.kd .gloss{font-size:var(--t-xs)}
.tree summary{flex-wrap:wrap;row-gap:0}.tree summary>*{min-width:0}.tree summary>.gloss{order:3;flex-basis:100%;margin-top:0!important}
.tree summary .sm{white-space:nowrap}
/* 0e5c: icons removed — tighten list header gap on mobile */
@media(max-width:599px){.sh:has(+.lay){margin-bottom:var(--s-5)}}
/* ===== Theme contrast fix (14 Oct 2026): palette #081A2F/#006B8F/#F3F5F7/#FFFFFF; dark accent = light tint of #006B8F ===== */
/* light: white header, midnight wordmark */
header .logo,header .logo b,header .nb{color:var(--midnight)}
header .logo small{color:#4a5868}
/* light search card = same as content cards */
.search{background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.search label,.search .lbl,.search label>span{color:var(--fg)}
.search input,.search select{background:var(--white);color:var(--midnight);border:1px solid #8796a5}
.search input::placeholder{color:#5b6877}
/* dark tokens */
:root[data-t=dark]{--bg:#081A2F;--bg2:#0c2139;--fg:#F3F5F7;--mut:#b4c1ce;--line:#2a4664;--card:#0f2845;
  --chip:#0d3550;--chipfg:#9fdcf0;--med:#5cc0e0;--medit-d:#5cc0e0;--med-d:#7fd0ea;--warn:#3a2c10;--warnfg:#ffd48a}
:root[data-t=dark] body{background:var(--bg);color:var(--fg)}
:root[data-t=dark] header{background:#081A2F;box-shadow:0 1px 0 var(--line)}
:root[data-t=dark] header .logo,:root[data-t=dark] header .logo b,:root[data-t=dark] header .nb,:root[data-t=dark] #tt,:root[data-t=dark] #burger{color:#FFFFFF}
:root[data-t=dark] header .logo small{color:#b4c1ce}
:root[data-t=dark] .logo svg rect,:root[data-t=dark] .logo svg path{fill:#5cc0e0}:root[data-t=dark] .logo svg circle{fill:#FFFFFF}
:root[data-t=dark] .nb[aria-current=page]{color:#5cc0e0;box-shadow:inset 0 -2px 0 #5cc0e0}
:root[data-t=dark] .btn.o{border-color:#F3F5F7;color:#F3F5F7}
:root[data-t=dark] .kick,:root[data-t=dark] .gloss-k,:root[data-t=dark] a:not(.btn):not(.card):not(.logo){color:#5cc0e0}
:root[data-t=dark] .card,:root[data-t=dark] .hero .card{background:var(--card);color:var(--fg);border:1px solid var(--line)}
:root[data-t=dark] .card h3,:root[data-t=dark] .hero .card h3,:root[data-t=dark] .hero .card b{color:#FFFFFF}
:root[data-t=dark] .hero .card .muted,:root[data-t=dark] .hero .card p,:root[data-t=dark] .hero .card .sm{color:var(--mut)}
:root[data-t=dark] .search label,:root[data-t=dark] .search label>span{color:#F3F5F7}
:root[data-t=dark] .search input,:root[data-t=dark] .search select,:root[data-t=dark] input,:root[data-t=dark] select{background:#081A2F;color:#F3F5F7;border:1px solid #6f8aa6}
:root[data-t=dark] input::placeholder{color:#b4c1ce}
:root[data-t=dark] .mega,:root[data-t=dark] .drawer>div{background:var(--card);color:var(--fg)}
:root[data-t=dark] .mega a,:root[data-t=dark] .drawer a,:root[data-t=dark] .drawer summary{color:#F3F5F7}
:root[data-t=dark] .num,:root[data-t=dark] th,:root[data-t=dark] .tabs button[aria-selected=true]{background:#006B8F;color:#fff;border-color:#006B8F}
:root[data-t=dark] .tabs-wrap.more .tabs-hint{background:#006B8F}
:root[data-t=dark] .steps>div{background:var(--card);border-color:var(--line)}
span[aria-hidden=true]:empty{display:none}
.tabs button{border-color:#8796a5}
:root[data-t=dark] .btn:not(.o){background:#006B8F;color:#FFFFFF;border-color:#006B8F}
:root[data-t=dark] .kd>div{background:var(--bg2);color:var(--fg)}:root[data-t=dark] .kd div b{color:var(--mut)}
:root[data-t=dark] main section:not(.hero){background:var(--bg);color:var(--fg)}
:root[data-t=dark] h1,:root[data-t=dark] h2,:root[data-t=dark] h3{color:#FFFFFF}
:root[data-t=dark] .tabs button{border-color:#6f8aa6;color:#F3F5F7}
/* data tables: no letter-level wrapping; desktop widths; <640px stacked cards */
td,th,.card td{word-break:normal;overflow-wrap:break-word;hyphens:manual}
td>a,td>b,td>a>b{overflow-wrap:break-word}
.tw table td:nth-child(2){min-width:240px}
.tw table td .gloss{display:flex;width:auto}
@media(max-width:639px){
 .tw{overflow-x:visible;box-shadow:none}
 .tw table,.tw tbody{display:block;width:100%}
 .tw tr:first-child:has(th),.tw thead{display:none}
 .tw tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-1) 0;padding:var(--s-4);margin-bottom:var(--s-3);background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
 .tw td{display:block;padding:0;border:0;min-width:0;flex:0 1 auto;font-size:var(--t-sm);color:var(--mut)}
 .tw td:nth-child(n+3):before{content:'·';padding:0 var(--s-2)}
 .tw td:nth-child(2){order:-1;flex:1 1 100%;min-width:0;font-size:var(--t-md);font-weight:600;color:var(--fg)}
 .tw td:nth-child(2) .gloss{font-weight:400}
 .tw td:first-child{order:0}
 tbody tr:hover td{background:none}
}
@media(max-width:639px){
 .tw table.t1 td:nth-child(2){order:0;flex:0 1 auto;font-size:var(--t-sm);font-weight:400;color:var(--mut)}
 .tw table.t1 td:first-child{order:-1;flex:1 1 100%;font-size:var(--t-md);font-weight:600;color:var(--fg)}
 .tw table.t1 td:nth-child(n+3):before{content:'·';padding:0 var(--s-2)}
}
@media(min-width:640px){.tw table.t1 td:nth-child(2){min-width:0}.tw table.t1 td:first-child{min-width:240px}}
/* polish 3176f23b+1 */
:root:not([data-t=dark]) .hero .card{border:1px solid #DDE3EA}
.mn{display:none}@media(max-width:639px){.tw .dn{display:none}.tw .mn{display:inline}}
.hero .btn:not(.o),:root[data-t=dark] .btn:not(.o){border:1px solid #7FD0EA}
span[aria-hidden="true"]:empty{display:none!important}
/* theme icon toggle */
#tt.ti{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;justify-content:center;border-radius:50%;color:var(--midnight)}
#tt.ti svg{width:20px;height:20px;flex:none}
#tt .i-sun{display:none}
:root[data-t=dark] #tt .i-moon{display:none}:root[data-t=dark] #tt .i-sun{display:block}
:root[data-t=dark] #tt.ti{color:#FFFFFF}