@font-face{font-family:"Titillium Web";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/titillium-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/titillium-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inconsolata";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inconsolata-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inconsolata";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inconsolata-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

@font-face{font-family:"TW Fallback";font-style:normal;font-weight:400;src:local("Arial"),local("ArialMT"),local("Helvetica"),local("Liberation Sans"),local("LiberationSans");size-adjust:93.59%;ascent-override:121.06%;descent-override:41.46%;line-gap-override:0%}
@font-face{font-family:"TW Fallback";font-style:normal;font-weight:700;src:local("Arial Bold"),local("Arial-BoldMT"),local("Helvetica Bold"),local("Liberation Sans Bold"),local("LiberationSans-Bold");size-adjust:90.02%;ascent-override:125.87%;descent-override:43.10%;line-gap-override:0%}
@font-face{font-family:"TW Fallback R";font-style:normal;font-weight:400;src:local("Roboto"),local("Roboto-Regular"),local("Roboto Regular");size-adjust:94.29%;ascent-override:120.17%;descent-override:41.15%;line-gap-override:0%}
@font-face{font-family:"TW Fallback R";font-style:normal;font-weight:700;src:local("Roboto Bold"),local("Roboto-Bold");size-adjust:95.75%;ascent-override:118.33%;descent-override:40.52%;line-gap-override:0%}

@font-face{font-family:"IN Fallback C";src:local("Consolas");size-adjust:90.94%;ascent-override:94.46%;descent-override:20.89%;line-gap-override:0%}
@font-face{font-family:"IN Fallback M";src:local("Menlo"),local("Menlo-Regular"),local("DejaVu Sans Mono"),local("DejaVuSansMono");size-adjust:83.06%;ascent-override:103.42%;descent-override:22.88%;line-gap-override:0%}
@font-face{font-family:"IN Fallback L";src:local("Courier New"),local("CourierNewPSMT"),local("Liberation Mono"),local("LiberationMono"),local("Droid Sans Mono"),local("Cousine");size-adjust:83.33%;ascent-override:103.08%;descent-override:22.80%;line-gap-override:0%}

:root{
  color-scheme:light;
  --bg:#ffffff;
  --band:#f2f3f9;
  --slab:#ffffff;
  --sunk:#f7f8fb;
  --line:#dcdfea;
  --line-strong:#b3b8cc;
  --box:#767b90;
  --ink:#171927;
  --ink-2:#3f4459;
  --muted:#5b6076;
  --brand:#3F51B5;
  --brand-ink:#3F51B5;
  --brand-fill:#3F51B5;
  --brand-soft:#e8eaf6;
  --brand-line:#9aa4dc;
  --on-brand:#ffffff;
  --go:#4CAF50;
  --go-hover:#5cbb60;
  --go-ink:#0c2310;
  --sel:#c5cae9;
  --sel-ink:#171927;
  --s-weak:#c62828;
  --s-fair:#a86400;
  --s-strong:#3F51B5;
  --s-vstrong:#2e7d32;
  --s-empty:#dcdfea;
  --shadow:0 1px 2px rgb(23 27 60 / .07),0 3px 8px -4px rgb(23 27 60 / .12);
  --pop-shadow:0 10px 20px -8px rgb(23 27 60 / .28),0 2px 6px rgb(23 27 60 / .08);
  --scrim:rgb(15 17 30 / .38);
  --ui:"Titillium Web","TW Fallback","TW Fallback R",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;
  --mono:"Inconsolata","IN Fallback C","IN Fallback M","IN Fallback L",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --r:10px;
  --wrap:880px;
  --wide:1136px;
  --gutter:24px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#13141c;--band:#1a1c26;--slab:#222532;--sunk:#1c1e29;--line:#313444;--line-strong:#484c62;--box:#8a8fa0;
    --ink:#eceef3;--ink-2:#c6c9d4;--muted:#a3a7b6;
    --brand-ink:#82b1ff;--brand-fill:#4a5fd0;--brand-soft:#262d4d;--brand-line:#5465c4;--on-brand:#ffffff;
    --go:#4CAF50;--go-hover:#5cbb60;--go-ink:#0c2310;--sel:#3949ab;--sel-ink:#ffffff;
    --s-weak:#ef5350;--s-fair:#ffb300;--s-strong:#82b1ff;--s-vstrong:#66bb6a;--s-empty:#393c46;
    --shadow:0 1px 2px rgb(0 0 0 / .3),0 3px 8px -4px rgb(0 0 0 / .4);
    --pop-shadow:0 10px 20px -8px rgb(0 0 0 / .7),0 2px 6px rgb(0 0 0 / .3);
    --scrim:rgb(0 0 0 / .55);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#13141c;--band:#1a1c26;--slab:#222532;--sunk:#1c1e29;--line:#313444;--line-strong:#484c62;--box:#8a8fa0;
  --ink:#eceef3;--ink-2:#c6c9d4;--muted:#a3a7b6;
  --brand-ink:#82b1ff;--brand-fill:#4a5fd0;--brand-soft:#262d4d;--brand-line:#5465c4;--on-brand:#ffffff;
  --go:#4CAF50;--go-hover:#5cbb60;--go-ink:#0c2310;--sel:#3949ab;--sel-ink:#ffffff;
  --s-weak:#ef5350;--s-fair:#ffb300;--s-strong:#82b1ff;--s-vstrong:#66bb6a;--s-empty:#393c46;
  --shadow:0 1px 2px rgb(0 0 0 / .3),0 3px 8px -4px rgb(0 0 0 / .4);
  --pop-shadow:0 10px 20px -8px rgb(0 0 0 / .7),0 2px 6px rgb(0 0 0 / .3);
  --scrim:rgb(0 0 0 / .55);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scrollbar-color:var(--line-strong) transparent;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.55 var(--ui);font-synthesis:none;-webkit-font-smoothing:antialiased}

body{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
body>main{flex:1 0 auto}
main:has(>.band:only-child){display:flex;flex-direction:column}
main>.band:only-child{flex:1 0 auto}   
::selection{background:var(--sel);color:var(--sel-ink)}
a{color:var(--brand-ink);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px;border-radius:6px}
.ico{width:20px;height:20px;flex:none;display:block}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--muted)}
h1,h2,h3{font-weight:400;margin:0;text-wrap:balance}

.top{background:var(--band);border-bottom:1px solid var(--line)}
.top-in{max-width:var(--wide);margin:0 auto;padding:0 var(--gutter);height:64px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-size:22px;letter-spacing:-.01em;flex:none}
.brand:hover{text-decoration:none}
.brand b{font-weight:400;color:var(--brand-ink)}
.brand svg{width:30px;height:30px}
.tools{display:flex;align-self:stretch;gap:2px;flex:1;min-width:0}
.tools a{position:relative;display:flex;align-items:center;gap:8px;padding:0 13px;color:var(--ink-2);text-decoration:none;font-size:16px;white-space:nowrap}
.tools a .ico{width:18px;height:18px;color:var(--muted)}
.tools a:hover{color:var(--ink)}
.tools a[aria-current="page"]{color:var(--brand-ink)}
.tools a[aria-current="page"] .ico{color:var(--brand-ink)}
.tools a[aria-current="page"]::after{content:"";position:absolute;inset-inline:10px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--brand-ink)}
@media (min-width:861px){.tools a[aria-current="page"]::after{bottom:10px;border-radius:3px}}   
.tools .sep{width:1px;background:var(--line);margin:22px 8px}
.top-actions{display:flex;align-items:center;gap:6px;flex:none}

.top-actions .menu-btn{display:none}
#menu-pop ul{list-style:none;margin:0;padding:0}
#menu-pop .menu-tools{margin:6px 0 14px}
.menu-tool{display:flex;align-items:center;gap:14px;padding:9px 10px;margin-inline:-10px;border-radius:10px;color:var(--ink);text-decoration:none}
.menu-tool:hover,.menu-tool[aria-current]{background:var(--brand-soft)}
.menu-tool .ico{display:block;width:22px;height:22px;flex:none;color:var(--brand-ink)}
.menu-tool b{display:block;font-weight:400;font-size:17px;line-height:1.3}
.menu-tool small{display:block;font-size:14px;line-height:1.35;color:var(--muted)}
.menu-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:6px}
.menu-row .btn{height:46px;font-size:15px;gap:8px;padding:0 10px;justify-content:flex-start}
.menu-row .btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-links{margin-top:16px!important;border-top:1px solid var(--line);padding-top:6px!important}
.menu-links button,.menu-links a{display:block;width:100%;padding:11px 0;border:0;background:none;color:var(--ink);font-size:16px;text-align:start;text-decoration:none;cursor:pointer}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;min-width:40px;padding:0 10px;border-radius:var(--r);border:1px solid transparent;background:transparent;color:var(--ink-2)}
.icon-btn:hover{background:var(--slab);border-color:var(--line)}
.lang-btn .code{font-size:15px;letter-spacing:.04em}
.lang-pill{display:inline-flex;align-items:center;flex:none;height:40px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}   
.lang-pill .lang-btn{height:38px;border:0;border-inline-end:1px solid var(--line);border-radius:0}   
.lang-sug{display:inline-flex;align-items:center;height:100%;padding:0 12px;color:var(--ink-2);text-decoration:none;font-size:16px;white-space:nowrap}
.lang-sug:hover{background:var(--slab);text-decoration:none}
:root:not([data-theme="dark"]) .top .lang-sug:hover{background:rgb(255 255 255 / .12)}
.lang-pill :focus-visible{outline-offset:-3px}
:root .top .lang-pill .lang-btn.icon-btn:hover{border-inline-end-color:var(--line)}
.lang-pill.no-code .lang-btn .code{display:none}   
@media (min-width:861px){.top-actions:has(.lang-pill){margin-inline-start:-14px}}   
@media (min-width:861px){html[data-sug] .tools a{padding:0 10px}}   

.band{background:var(--band);border-bottom:1px solid var(--line)}
.band-in{max-width:var(--wrap);margin:0 auto;padding:44px var(--gutter) 40px}
.title{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 24px}
h1{font-size:36px;line-height:1.12;letter-spacing:-.012em;color:var(--ink)}
.title+.slab{margin-top:24px}
.promise{display:flex;align-items:center;gap:7px;font-size:15px;color:var(--muted);margin:0}
.promise .ico{width:16px;height:16px}

.recipe{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 14px;padding:0;list-style:none}
.chip{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:var(--r);border:1px solid var(--line-strong);background:var(--slab);color:var(--ink-2);font-size:16px;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s}
.chip:hover{border-color:var(--brand-line);color:var(--ink)}
.chip .ico{width:16px;height:16px;color:var(--muted);transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.chip[aria-expanded="true"] .ico.chev{transform:rotate(180deg)}
.chip .val{color:var(--ink)}
.chip .box{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--box);display:grid;place-items:center;flex:none;transition:background-color .15s,border-color .15s}
.chip .box svg{width:12px;height:12px;color:var(--on-brand);opacity:0;transform:scale(.6);transition:opacity .15s,transform .2s cubic-bezier(.2,.8,.2,1)}
.chip[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.chip[aria-pressed="true"] .box{background:var(--brand-fill);border-color:var(--brand-fill)}
.chip[aria-pressed="true"] .box svg{opacity:1;transform:none}
.chip[aria-pressed="false"]{color:var(--muted)}
.chip .badge{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--brand-fill);color:var(--on-brand);font-size:13px;line-height:20px;text-align:center}
.chip.sets{font-family:var(--ui)}
.chip.nope{animation:nope .32s cubic-bezier(.36,.07,.19,.97)}
@keyframes nope{20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
.recipe .gap{width:8px}
.recipe .ex-ic{display:none}
.sep-glyph{font-size:20px;line-height:1;color:var(--ink);min-width:10px;text-align:center;letter-spacing:0}
.recipe li{display:flex}
.recipe li>.chip{flex:1;justify-content:center}

.slab{background:var(--slab);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.slab-main:has(.out.many){align-items:start}
.slab-main{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:16px 16px 16px 24px;padding-inline:24px 16px}
.out{min-width:0;height:64px;display:flex;align-items:center;font-family:var(--mono);color:var(--ink);direction:ltr;unicode-bidi:isolate}
.out-text{display:block;white-space:nowrap;overflow:hidden;font-size:40px;line-height:1.2;letter-spacing:.01em;font-variant-ligatures:none}
.out.wrap{height:auto;min-height:64px;max-height:40vh;overflow:auto;align-items:flex-start;padding:6px 0}
.out.wrap .out-text{white-space:normal;word-break:break-all;overflow:visible}
.out.phrase.wrap .out-text{word-break:normal;overflow-wrap:anywhere;text-wrap:balance}

.out:not(.many):not(.none)>.out-text{text-align:center;margin-inline:auto}
[dir="rtl"] .out{justify-content:flex-end}
.out.pin{height:104px}
.pin-text{letter-spacing:.14em;line-height:1.1}
.pin-text .g{display:inline-block}
.pin-text .g+.g{margin-inline-start:.4em}
.out-list{list-style:none;margin:0;padding:0;display:grid;gap:2px;min-width:0}
.out.many{height:auto;display:block}
.out-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-height:44px;border-bottom:1px dashed var(--line)}
.out-list li:last-child{border-bottom:0}
.out-list .out-text{font-size:24px}
.row-copy{width:40px;height:40px;display:grid;place-items:center;border-radius:8px;border:1px solid transparent;background:none;color:var(--muted)}
.row-copy:hover{border-color:var(--line);color:var(--ink)}
.row-copy.ok{color:var(--s-vstrong)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 22px;border-radius:var(--r);border:1px solid var(--line-strong);background:var(--slab);color:var(--ink);font-size:18px;white-space:nowrap;transition:background-color .15s,border-color .15s,transform .1s}
.btn:active{transform:translateY(1px)}
.btn .ico{width:20px;height:20px}
.btn-icon{width:52px;padding:0;color:var(--ink-2)}
.btn-icon:hover{border-color:var(--brand-line);color:var(--brand-ink)}
.btn-icon .ico{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.btn-icon.spin .ico{transform:rotate(360deg)}
.btn-go{background:var(--go);border-color:var(--go);color:var(--go-ink);min-width:132px}
.btn-go:hover{background:var(--go-hover);border-color:var(--go-hover)}
.btn-go .labels{display:grid}
.btn-go .labels>span{grid-area:1/1;transition:opacity .15s}
.btn-go .labels>span[hidden]{display:block;visibility:hidden;opacity:0}
.btn-go .ic-wrap{display:grid;width:20px;height:20px}
.btn-go .ic-wrap svg{width:20px;height:20px;grid-area:1/1;transition:opacity .15s,transform .25s cubic-bezier(.2,.8,.2,1)}
.btn-go .ic-done{opacity:0;transform:scale(.5)}
.btn-go.ok .ic-done{opacity:1;transform:none}
.btn-go.ok .ic-copy{opacity:0;transform:scale(.5)}
.btn-brand{background:var(--brand-fill);border-color:var(--brand-fill);color:var(--on-brand)}
.btn-brand:hover{filter:brightness(1.08)}
.btn-quiet{height:44px;font-size:16px;padding:0 14px;color:var(--ink-2)}
.btn-quiet:hover{border-color:var(--brand-line);color:var(--brand-ink)}

.slab-foot{display:flex;align-items:center;gap:14px;padding:12px 24px;border-top:1px solid var(--line);font-size:15px;color:var(--muted);min-height:48px}
.meter{display:flex;gap:4px;flex:none}
.meter i{width:26px;height:6px;border-radius:3px;background:var(--s-empty);transition:background-color .25s}
.meter[data-l="1"] i:nth-child(-n+1){background:var(--s-weak)}
.meter[data-l="2"] i:nth-child(-n+2){background:var(--s-fair)}
.meter[data-l="3"] i:nth-child(-n+3){background:var(--s-strong)}
.meter[data-l="4"] i:nth-child(-n+4){background:var(--s-vstrong)}
.verdict{color:var(--ink);font-size:16px}
.foot-sp{flex:1}
.bits{font-variant-numeric:tabular-nums;white-space:nowrap}
.tray .slab-foot .bits{display:none}   
.slab-foot .install-link{height:36px;margin-block:-6px;margin-inline-start:auto;margin-inline-end:-10px;font-size:15px;flex:none}   

.after{display:flex;flex-wrap:wrap;gap:4px 8px;margin-top:12px;margin-inline-start:-8px;min-height:40px}
.link-btn{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--brand-ink);font-size:16px}
.link-btn .ico{width:18px;height:18px}
.link-btn:hover{background:var(--brand-soft)}

.names{list-style:none;margin:0;padding:6px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
.name{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;height:60px;padding:0 16px;border:0;border-radius:10px;background:none;color:var(--ink);text-align:start;transition:background-color .15s}
.name:hover{background:var(--sunk)}
.name-t{font-family:var(--mono);font-size:24px;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;unicode-bidi:isolate}
.name-s{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:15px;flex:none}
.name-s .ico{width:18px;height:18px}
.name-l{opacity:0;transition:opacity .15s}
.name:hover .name-l,.name:focus-visible .name-l,.name.ok .name-l{opacity:1}
.name.ok .name-s{color:var(--s-vstrong)}

.check-slab:focus-within{border-color:var(--brand-ink);box-shadow:var(--shadow),0 0 0 1px var(--brand-ink),0 0 0 4px var(--brand-soft)}
.check-in{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:14px 16px 14px 24px;padding-inline:24px 16px}
.masked{-webkit-text-security:disc}
.check-input{height:60px;border:0;background:none;font-family:var(--mono);font-size:28px;color:var(--ink);min-width:0;outline:none;direction:ltr}
.check-input::placeholder{font-family:var(--ui);font-size:20px;color:var(--muted)}
.reasons{list-style:none;margin:0;padding:0 24px 16px;min-height:72px;display:grid;gap:4px;align-content:start}
.reasons li{position:relative;padding-inline-start:16px;color:var(--ink-2);font-size:16px}
.reasons li::before{content:"";position:absolute;inset-inline-start:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--line-strong)}
.reasons li.muted{padding:0;color:var(--muted)}
.reasons li.muted::before{display:none}
.breach{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:16px}
.breach .hint{margin:0;max-width:52ch}
.breach-out{flex-basis:100%;margin:0;min-height:1.55em;color:var(--ink-2)}
.breach-out.bad{color:var(--s-weak)}
.breach-out.good{color:var(--s-vstrong)}
.btn:disabled{opacity:.5;cursor:not-allowed}

.bulk-in{max-width:var(--wide)}
.bulk{display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;margin-top:24px;align-items:start}
.bulk-form{padding:18px;display:grid;gap:18px}
.lab{display:block;font-size:15px;color:var(--ink-2);margin:0 0 6px}
.seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line-strong);border-radius:var(--r);padding:3px;gap:3px;background:var(--sunk)}
.seg label{position:relative}
.seg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.seg span{display:flex;align-items:center;justify-content:center;height:40px;border-radius:7px;color:var(--ink-2);font-size:16px;transition:background-color .15s,color .15s}
.seg input:checked+span{background:var(--slab);color:var(--brand-ink);box-shadow:0 1px 3px rgb(0 0 0 / .12)}
.seg input:focus-visible+span{outline:2px solid var(--brand-ink);outline-offset:1px}
textarea{width:100%;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--sunk);padding:10px 12px;font:15px/1.55 var(--mono);color:var(--ink);resize:vertical;min-height:170px}
.mode-list .hint{margin-top:6px}
.styles{border:0;padding:0;margin:0;display:grid;gap:6px;min-width:0}
.styles legend{padding:0}
.style{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:center;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r);cursor:pointer;transition:background-color .15s,border-color .15s}
.style input{width:18px;height:18px;margin:0;accent-color:var(--brand-fill)}
.style>span{display:flex;justify-content:space-between;gap:10px;align-items:baseline;min-width:0}
.style .ex{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.style:has(input:checked){background:var(--brand-soft);border-color:var(--brand-line)}
.style:has(input:checked) .l{color:var(--brand-ink)}
.bulk-form .check-line{height:auto}
.gen{width:100%}
.bulk-out{min-width:0;overflow:hidden}
.bulk-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
.bulk-bar .count{color:var(--ink);font-size:17px;padding-inline-start:4px}
.bulk-bar .select{width:auto;height:44px}
.btn-sm{height:44px;font-size:16px;min-width:0;padding:0 14px;gap:8px}
.tbl-wrap{max-height:470px;overflow:auto}
.bulk-tbl{margin:0}
.bulk-tbl th{position:sticky;top:0;background:var(--slab);z-index:1}
.bulk-tbl th,.bulk-tbl td{padding:6px 14px}
.bulk-tbl td{color:var(--ink-2);white-space:nowrap}
.bulk-tbl .c-pw{color:var(--ink);font-size:18px;letter-spacing:.02em}
.bulk-tbl .c-copy{width:56px;text-align:end}
.bulk-note{display:flex;gap:8px;align-items:center;margin:0;padding:12px 16px;border-top:1px solid var(--line);color:var(--muted);font-size:15px}
.bulk-note .ico{width:16px;height:16px}

.pop{position:fixed;inset:auto;margin:0;padding:18px;border:1px solid var(--line-strong);border-radius:14px;background:var(--slab);color:var(--ink);box-shadow:var(--pop-shadow);width:340px;max-width:calc(100vw - 24px);opacity:0;transform:translateY(-4px);transition:opacity .16s ease-out,transform .2s cubic-bezier(.2,.8,.2,1),display .2s allow-discrete,overlay .2s allow-discrete}
.pop:popover-open{opacity:1;transform:none}
@starting-style{.pop:popover-open{opacity:0;transform:translateY(-4px)}}
.pop::backdrop{background:transparent}
@supports not selector(:popover-open){[popover]:not(.shim-open){display:none}[popover].shim-open{display:block;opacity:1;transform:none;z-index:1000}}
.pop h3{font-size:15px;color:var(--muted);margin:0 0 10px;letter-spacing:.01em}
.pop .grab{display:none}
.pop-head{display:flex;align-items:center;gap:8px;margin:0 0 10px}
.pop-head h3{margin:0;flex:1}
.pop-x{display:none;place-items:center;flex:none;width:36px;height:36px;margin:-6px -8px -6px auto;border:0;border-radius:8px;background:none;color:var(--muted);cursor:pointer}
.pop-x:hover{color:var(--ink);background:var(--sunk)}
.pop-x .ico{width:20px;height:20px}
.pop-full .pop-x,.lang-pop .pop-x{display:grid}
.pop-info>.pop-head:not(:has(h3)){margin:0}   
.stepper{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;border:1px solid var(--line-strong);border-radius:var(--r);overflow:hidden;height:52px}
.stepper button{border:0;background:var(--sunk);color:var(--ink-2);display:grid;place-items:center}
.stepper button:hover{color:var(--brand-ink)}
.stepper input{border:0;border-inline:1px solid var(--line);background:var(--slab);text-align:center;font-size:24px;font-variant-numeric:tabular-nums;min-width:0;-moz-appearance:textfield;appearance:textfield}
.stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.stepper input:focus{outline:none;box-shadow:inset 0 0 0 2px var(--brand-ink)}
.range{width:100%;margin:18px 0 6px;accent-color:var(--brand-fill);height:28px}
.picks{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
#pop-am .picks{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}   
#pop-am .picks>*{min-width:0;padding-inline:0}
.pick{min-width:48px;height:38px;padding:0 10px;border-radius:8px;border:1px solid var(--line);background:var(--sunk);color:var(--ink-2);font-variant-numeric:tabular-nums}
.pick:hover{border-color:var(--brand-line);color:var(--ink)}
.pick[aria-pressed="true"]{background:var(--brand-fill);border-color:var(--brand-fill);color:var(--on-brand)}
.hint{font-size:14px;color:var(--muted);margin:10px 0 0}
.opt{display:grid;grid-template-columns:22px 1fr;gap:4px 12px;align-items:start;padding:10px 0;cursor:pointer}
.opt+.opt{border-top:1px solid var(--line)}
.opt input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--brand-fill)}
.opt .l{color:var(--ink)}
.opt code,.pop code,.mono{font-family:var(--mono);font-size:15px;color:var(--muted);letter-spacing:.04em;word-break:break-all}
.opt code{grid-column:2}
.choice{display:grid;gap:4px}
.choice button{display:flex;align-items:center;justify-content:space-between;gap:12px;height:44px;padding:0 12px;border:0;border-radius:8px;background:none;text-align:start;color:var(--ink)}
.choice button:hover{background:var(--sunk)}
.choice button[aria-pressed="true"]{background:var(--brand-soft);color:var(--brand-ink)}
.choice button .ex{font-family:var(--mono);color:var(--muted)}
.choice button[aria-pressed="true"] .ex{color:var(--brand-ink)}

.guide{max-width:var(--wrap);margin:0 auto;padding:24px var(--gutter) 72px}
.guide section{max-width:68ch;padding-top:48px}
.guide h2{font-size:28px;line-height:1.2;margin-bottom:12px;color:var(--ink)}
.guide h3{font-size:20px;margin:24px 0 6px}
.guide p,.guide li{color:var(--ink-2)}
.guide p{margin:0 0 14px}
.guide section.wide{max-width:none}
.tbl{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:16px;margin-top:6px}
.tbl th,.tbl td{text-align:start;padding:10px 12px;border-bottom:1px solid var(--line)}
.tbl th{color:var(--muted);font-size:14px;letter-spacing:.02em}
.tbl td:first-child{color:var(--ink)}
.tbl .lv{display:inline-flex;align-items:center;gap:8px}
.tbl .lv i{width:8px;height:8px;border-radius:50%;background:currentColor}
.lv-1{color:var(--s-weak)}.lv-2{color:var(--s-fair)}.lv-3{color:var(--s-strong)}.lv-4{color:var(--s-vstrong)}
.tbl .lv span{color:var(--ink-2)}
.scroll-x{overflow-x:auto;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}
.scroll-x.more-e{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 48px),transparent)}
.scroll-x.more-s{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 48px),transparent)}
.scroll-x.more-s.more-e{-webkit-mask-image:linear-gradient(to right,transparent,#000 48px,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to right,transparent,#000 48px,#000 calc(100% - 48px),transparent)}
[dir=rtl] .scroll-x.more-e{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 48px),transparent)}
[dir=rtl] .scroll-x.more-s{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 48px),transparent)}
.presets{list-style:none;padding:0;margin:8px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.presets li{border-bottom:1px solid var(--line)}
.presets a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;text-decoration:none;color:var(--ink)}
.presets a:hover .p-name{color:var(--brand-ink)}
.presets .p-spec{color:var(--muted);font-size:15px;white-space:nowrap}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;gap:16px;padding:16px 0;cursor:pointer;color:var(--ink);font-size:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ico{color:var(--muted);transition:transform .2s cubic-bezier(.2,.8,.2,1);margin-top:3px}
.faq details[open] summary .ico{transform:rotate(180deg)}
.faq details p{margin:0 0 18px}

.foot{background:var(--band);border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
.foot-in{max-width:var(--wide);margin:0 auto;padding:44px var(--gutter) 36px;display:grid;grid-template-columns:minmax(18ch,1.25fr) minmax(0,max-content) minmax(16ch,.9fr);gap:40px}
.foot .brand{font-size:20px;width:max-content;height:auto;padding:0}
.foot .brand .lock{width:17px;height:24px}
.foot-brand p{margin:12px 0 0;max-width:32ch;line-height:1.55}
.foot h2{font-size:14px;color:var(--muted);margin:2px 0 8px;letter-spacing:.02em;font-weight:400}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:0;align-content:start}
.foot-cols{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:0 44px}   
.foot-in li a{max-width:100%}
.foot-in li a span{min-width:0;overflow-wrap:anywhere;hyphens:auto}
.foot-in>div{min-width:0}   
.foot-in li a,.foot-link{display:inline-flex;align-items:center;gap:10px;min-height:34px;padding:0;border:0;background:none;color:var(--ink-2);font:inherit;text-decoration:none;cursor:pointer;text-align:start}
.foot-in li a:hover span,.foot-link:hover span{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}
.foot-in li a:focus-visible,.foot-link:focus-visible,.foot-lang:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px;border-radius:4px}
.foot-tools .ico{display:inline-block;width:18px;height:18px;flex:none;color:var(--muted)}
.foot-tools a[aria-current="page"],.foot-tools a[aria-current="page"] .ico,.foot-links a[aria-current="page"]{color:var(--brand-ink)}
.foot-base{border-top:1px solid var(--line)}
.foot-base-in{max-width:var(--wide);margin:0 auto;padding:12px var(--gutter) 18px;display:flex;justify-content:space-between;align-items:center;gap:12px 20px;flex-wrap:wrap}
.foot-lang{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 10px 0 12px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--slab);color:var(--ink-2);font:inherit;cursor:pointer}
.foot-lang:hover{border-color:var(--brand-line);color:var(--brand-ink)}
.foot-lang .ico{display:inline-block;width:18px;height:18px;flex:none}
.foot-lang .chev{width:16px;height:16px;color:var(--muted)}
.foot-copy{font-size:14px}
.fb-fab{transition:opacity .2s,transform .2s}
body.foot-in-view .fb-fab{opacity:0;transform:translateY(12px);pointer-events:none}   
@media (min-width:1001px){   
  .foot-in{grid-template-columns:calc((100% - 56px) / 3.4 + 24px) minmax(0,max-content) minmax(21ch,1fr);column-gap:32px}   
  .foot-cols{column-gap:32px}
}
@media (min-width:1001px) and (max-width:1100px){   
  .foot-cols{column-gap:20px}
  .foot-tools li a{gap:8px}
}
@media (max-width:1000px){   
  .foot-in{grid-template-columns:1fr 1fr;gap:28px 24px;padding:36px var(--gutter) 28px}
  .foot-in,.foot-base-in{max-width:var(--wrap)}   
  .foot-brand,.foot-tools{grid-column:1/-1}
}
@media (max-width:560px){
  .foot-cols{grid-template-columns:1fr}
  .foot-links{grid-column:1/-1}
  .foot-links ul{display:flex;flex-wrap:wrap;gap:0 24px}
}

.lang-pop{width:600px}
.lang-pop .filter{width:100%;height:44px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--sunk);padding:0 14px;margin-bottom:12px}
.lang-pop .filter::placeholder{color:var(--muted)}
.lang-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;max-height:min(420px,60vh);overflow:auto;margin:0;padding:0;list-style:none}
.lang-grid a{width:100%;display:flex;text-decoration:none;box-sizing:border-box;justify-content:space-between;align-items:center;gap:8px;height:40px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--ink);text-align:start}
.lang-grid a:hover{background:var(--sunk)}
.lang-grid a[aria-current="page"]{background:var(--brand-soft);color:var(--brand-ink)}
.lang-grid .c{font-size:13px;color:var(--muted);letter-spacing:.05em}

dialog.sheet{border:1px solid var(--line-strong);border-radius:16px;background:var(--slab);color:var(--ink);padding:0;width:440px;max-width:calc(100vw - 24px);box-shadow:var(--pop-shadow)}
dialog.sheet::backdrop{background:var(--scrim)}
dialog.sheet[open]{animation:rise .22s cubic-bezier(.2,.8,.2,1)}
@keyframes rise{from{opacity:0;transform:translateY(8px)}}
.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 0 22px;padding-inline:22px 12px}
.sheet-head h2{font-size:22px}
.sheet-body{padding:12px 22px 8px}
.qr-box{display:grid;place-items:center;background:#fff;border-radius:12px;padding:16px;border:1px solid var(--line)}
.qr-box canvas{width:232px;height:232px;image-rendering:pixelated}
.qr-cap{font-size:14px;color:var(--muted);text-align:center;margin:10px 0 16px}
.field{display:grid;gap:6px;margin:12px 0}
.field label,.field .lab{font-size:15px;color:var(--ink-2)}
.input,.select{height:46px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--sunk);padding:0 12px;width:100%}
.input::placeholder,textarea::placeholder{color:var(--muted)}
.input:focus,.select:focus,textarea:focus{outline:none;border-color:var(--brand-ink);box-shadow:0 0 0 1px var(--brand-ink)}
.row2{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}
.check-line{display:flex;align-items:center;gap:10px;height:46px;color:var(--ink-2)}
.check-line input{width:20px;height:20px;accent-color:var(--brand-fill);margin:0}
.fieldset[disabled]{opacity:.55}
.sheet-foot{display:flex;gap:8px;padding:12px 22px 22px}
.sheet-foot .btn{flex:1;height:48px;font-size:16px}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:10px;font-size:15px;opacity:0;pointer-events:none;transition:opacity .18s,transform .25s cubic-bezier(.2,.8,.2,1);z-index:50;max-width:calc(100vw - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.net-note{position:fixed;left:50%;bottom:calc(80px + env(safe-area-inset-bottom));transform:translate(-50%,12px);display:flex;align-items:center;gap:6px;background:var(--ink);color:var(--bg);padding:6px 6px 6px 16px;border-radius:12px;font-size:15px;line-height:1.4;opacity:0;pointer-events:none;transition:opacity .18s,transform .25s cubic-bezier(.2,.8,.2,1);z-index:60;width:max-content;max-width:calc(100vw - 32px);box-shadow:0 6px 24px rgb(0 0 0 / .18);cursor:pointer}
.net-note.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.net-note .net-x{flex:none;display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:8px;background:none;color:inherit;cursor:pointer}
.net-note .net-x:hover{background:rgb(255 255 255 / .12)}
.net-note .net-x:focus-visible{outline:2px solid currentColor;outline-offset:-2px}
.net-note .net-x .ico{width:18px;height:18px}
@media (prefers-reduced-motion:reduce){.net-note{transition:none}}

.print-only{display:none}
@media print{
  body>*:not(.print-only){display:none!important}
  .print-only{display:block!important}
  
  html,body{height:auto!important;min-height:0!important;overflow:visible!important}
  body{display:block!important}
  .print-only>:last-child{break-after:avoid}
}

html{scrollbar-gutter:stable}   
html:has(dialog:modal),html:has(#pop-print:popover-open),html:has(#pop-fb:popover-open),html:has(.lang-pop:popover-open){overflow:hidden}
dialog,.pop{overscroll-behavior:contain}
@media (max-width:860px){ html:has(.pop:not(.pop-info):popover-open){overflow:hidden} }

@media (min-width:861px){
  .tools a .ico{display:none}
  .tools a{padding:0 10px}
}

@media (max-width:999px){
  .recipe{margin:18px 0 12px;gap:6px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-flow:row dense}
  .recipe>li{grid-column:span 4}
  .recipe .r-len,.recipe .r-am{grid-column:span 5}
  .recipe .r-ex{grid-column:span 2}
  .recipe .r-set{grid-column:span 3}
  .recipe .r-words{grid-column:span 5}
  .recipe .r-sep{grid-column:span 7}
  .recipe .r-half{grid-column:span 6}
  .recipe .r-wl{grid-column:span 12}
  .recipe .r-full{grid-column:span 12}
  .recipe .r-third{grid-column:span 5}
  .recipe .r-third2{grid-column:span 7}
  .recipe .ex-ic{display:block;width:18px;height:18px}
  .recipe .ex-l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .recipe .r-ex .chip{padding:0;gap:0;position:relative}
  .recipe .r-ex .chev{display:none}
  .recipe .r-ex .badge{position:absolute;top:-7px;inset-inline-end:-7px}
  .recipe .gap{display:none}
}
@media (max-width:860px){
  :root{--gutter:16px}
  .top-in{display:grid;grid-template-columns:minmax(0,1fr) auto;height:auto;padding:0;gap:0}
  .brand{font-size:20px;height:56px;padding-inline:16px}
  .brand svg{width:26px;height:26px}
  .top-actions{padding-inline-end:8px;grid-row:1;grid-column:2}
  .top-actions .menu-btn{display:inline-flex}
  .tools{grid-row:2;grid-column:1/-1;border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none;height:48px;padding:0 8px;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;mask-image:linear-gradient(90deg,#000 88%,transparent);scroll-padding-inline:56px 16px}
  .tools a[aria-current]{scroll-initial-target:nearest}   
  [dir="rtl"] .tools{mask-image:linear-gradient(270deg,#000 88%,transparent)}
  .tools:not([data-fade]):has(>a[aria-current]:not(:first-child)){mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}   
  .tools[data-fade="se"]{mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
  .tools[data-fade="e"]{mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .tools[data-fade="s"]{mask-image:linear-gradient(90deg,transparent,#000 12%)}
  .tools[data-fade=""]{mask-image:none}
  [dir="rtl"] .tools:not([data-fade]):has(>a[aria-current]:not(:first-child)),[dir="rtl"] .tools[data-fade="se"]{mask-image:linear-gradient(270deg,transparent,#000 12%,#000 88%,transparent)}
  [dir="rtl"] .tools[data-fade="e"]{mask-image:linear-gradient(270deg,#000 88%,transparent)}
  [dir="rtl"] .tools[data-fade="s"]{mask-image:linear-gradient(270deg,transparent,#000 12%)}
  .tools::-webkit-scrollbar{display:none}
  .tools a{padding:0 12px;scroll-snap-align:start}
  .tools a .ico{display:block}
  .tools .sep{margin:14px 4px}
  .band-in{padding:24px var(--gutter) 28px}
  h1{font-size:28px}
  .title{display:block}
  .promise{margin-top:6px}
  .names{grid-template-columns:1fr;padding:4px}
  .bulk{grid-template-columns:1fr}
  .bulk-tbl thead{display:none}
  .bulk-tbl tr{display:grid;grid-template-columns:minmax(0,1fr) 48px;grid-template-areas:"n c" "u c" "p c";padding:10px 14px;border-bottom:1px solid var(--line)}
  .bulk-tbl td{border:0;padding:0;white-space:normal;overflow-wrap:anywhere}
  .bulk-tbl .c-name{grid-area:n;color:var(--ink)}
  .bulk-tbl .c-user{grid-area:u;font-size:15px}
  .bulk-tbl .c-pw{grid-area:p;margin-top:2px}
  .bulk-tbl .c-copy{grid-area:c;align-self:center;width:auto}
  .bulk-bar .select{flex:1}
  .check-in{padding:10px 10px 10px 16px;padding-inline:16px 10px;grid-template-columns:minmax(0,1fr) 48px 48px}
  .check-in .btn-icon{width:48px;height:48px}
  .check-input{font-size:22px;height:52px}
  .check-input::placeholder{font-size:17px}
  .reasons{padding:0 16px 14px}
  .name{height:54px;padding:0 12px}
  .name-t{font-size:21px}
  .name-l{opacity:1}
  .chip{height:42px;padding:0 10px;font-size:15px;gap:7px}
  .slab-main{grid-template-columns:52px minmax(0,1fr);padding:14px}
  .slab-main .out{grid-column:1/-1;height:56px}
  .slab-main .out.wrap,.slab-main .out.many{height:auto}
  .slab-main .out.pin:not(.many){height:84px}
  .btn-go{width:100%}
  .slab-foot{padding:10px 14px;flex-wrap:wrap;gap:6px 12px}
  .slab-foot .bits{display:none}
  .guide section{padding-top:36px}
  .guide h2{font-size:24px}
  .presets{grid-template-columns:1fr}
  .presets a{flex-direction:column;gap:0;padding:12px 0}
  .presets .p-spec{white-space:normal}
  .scroll-x .tbl{min-width:560px;font-size:15px}
  
  .pop:not(.pop-info),.lang-pop{left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%;max-width:none;border-radius:18px 18px 0 0;border-bottom:0;padding:0 18px calc(22px + env(safe-area-inset-bottom));transform:translateY(24px);max-height:82vh;overflow:auto}
  .pop:popover-open{transform:none}
  @starting-style{.pop:not(.pop-info):popover-open{transform:translateY(24px)}}
  .pop:not(.pop-info)::backdrop{background:var(--scrim)}
  .pop.pop-full,.lang-pop{top:0!important;height:100dvh;max-height:none;border-radius:0;border:0;transform:none}
  @starting-style{.pop.pop-full:popover-open,.lang-pop:popover-open{transform:none;opacity:0}}
  .pop.pop-info{width:min(360px,calc(100vw - 24px));max-width:none;padding:14px 16px}
  .lang-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none}
  dialog.sheet{margin:0;width:100%;max-width:none;height:100dvh;max-height:none;border-radius:0;border:0}
  dialog.sheet .sheet-head{position:sticky;top:0;z-index:1;background:var(--slab);padding-block:max(14px,env(safe-area-inset-top)) 12px;border-bottom:1px solid var(--line)}
  .pop-x{display:grid}
  .pop:not(.pop-info) .pop-head{position:sticky;top:0;z-index:1;background:var(--slab);padding:14px 0 10px;margin:0 0 6px}
  .pop.pop-full .pop-head,.lang-pop .pop-head{padding-top:max(14px,env(safe-area-inset-top));border-bottom:1px solid var(--line);margin:0 -18px 16px;padding-inline:18px}
  .pop-info>.pop-head:not(:has(h3)){position:absolute;top:10px;inset-inline-end:10px;z-index:1;margin:0}   
  .pop-info>.pop-head:not(:has(h3))+*{padding-inline-end:34px}
}

@media (min-width:600px) and (max-width:860px){ .slab-main{grid-template-columns:52px minmax(0,240px) minmax(0,1fr)} }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

:root[data-theme="dark"] .theme-btn .ic-moon,:root:not([data-theme="dark"]) .theme-btn .ic-sun{display:none}
:root.theme-switching,:root.theme-switching *,:root.theme-switching *::before,:root.theme-switching *::after{transition:none!important}:root:not([data-theme="dark"]) .top{
  --band:#3F51B5;
  --line:rgb(255 255 255 / .2);
  --line-strong:rgb(255 255 255 / .5);
  --ink:#ffffff;
  --ink-2:rgb(255 255 255 / .94);
  --muted:rgb(255 255 255 / .84);
  --brand-ink:#ffffff;
  --brand-fill:#ffffff;
  --brand-soft:rgb(255 255 255 / .16);
  --brand-line:rgb(255 255 255 / .75);
  --on-brand:#3F51B5;
  --box:rgb(255 255 255 / .8);
  border-bottom-color:transparent;
}
:root:not([data-theme="dark"]) .top .icon-btn:hover{background:rgb(255 255 255 / .12);border-color:transparent}

:root:not([data-theme="dark"]) .top .pop,
:root:not([data-theme="dark"]) .top dialog{
  --line:#dcdfea;
  --line-strong:#b3b8cc;
  --ink:#171927;
  --ink-2:#3f4459;
  --muted:#5b6076;
  --brand-ink:#3F51B5;
  --brand-fill:#3F51B5;
  --brand-soft:#e8eaf6;
  --brand-line:#9aa4dc;
  --on-brand:#ffffff;
  --box:#767b90;
}

@font-face{font-family:"PG Bold";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/titillium-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"PG Bold";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/titillium-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
html[data-theme]:root{--go:#43A047;--go-hover:#3B9440;--go-ink:#ffffff}

.btn-go{font-size:19px;font-family:"PG Bold",var(--ui);font-weight:700}

.brand .lock{width:17px;height:24px;flex:none}
.brand{gap:9px}

.top{position:sticky;top:calc(var(--hdr-h, 64px) * -1);z-index:40}
.top.is-pinned{top:0;box-shadow:0 2px 14px rgb(0 0 0 / .22);animation:hdr-in .2s ease-out}
@keyframes hdr-in{from{transform:translateY(-100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.top.is-pinned{animation:none}}

.guide section[id]{scroll-margin-top:-24px}   
@media (max-width:860px){ .guide section[id]{scroll-margin-top:-12px} }   

html[data-theme]:root{--s-strong:#689F38}
html[data-theme="dark"]:root{--s-strong:#9CCC65}

.after{align-items:center}
a.link-btn:not(.inline){text-decoration:none}

@media (min-width:1000px){
  .band-in:not(.bulk-in){max-width:var(--wide);padding-inline:calc(var(--gutter) + var(--rail, 154px))}
  .guide{max-width:var(--wide)}
  .guide section{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);column-gap:56px}
  .guide section>*{grid-column:2}
  .guide section>h2{grid-column:1;grid-row:1 / span 40;align-self:start}
  
  .band-in.flow-in,.guide.guide-flow{max-width:calc(72ch + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
  .guide.guide-flow section{display:block;max-width:none}
  
  .recipe{gap:6px}
  .recipe .chip{padding-inline:12px}
  .recipe .gap{width:4px}
}

@media (min-width:1000px){
  .recipe.compact{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-flow:row dense;gap:6px}
  .recipe.compact>li{grid-column:span 4}
  .recipe.compact .gap{display:none}
  .recipe.compact .r-len,.recipe.compact .r-am,.recipe.compact .r-ex{grid-column:span 4}
  .recipe.compact .r-set{grid-column:span 3}
  .recipe.compact .r-words,.recipe.compact .r-third{grid-column:span 5}
  .recipe.compact .r-sep,.recipe.compact .r-third2{grid-column:span 7}
  .recipe.compact .r-half{grid-column:span 6}
  .recipe.compact .r-wl,.recipe.compact .r-full{grid-column:span 12}
}
@media (min-width:1000px){
  
  .recipe.compact .r-len{order:1}.recipe.compact .r-am{order:2}.recipe.compact .r-ex{order:3}.recipe.compact .r-set{order:4}
}

@media (max-width:999px){
  .recipe .r-ex .chip{position:relative}
  .recipe .r-ex .chip .badge{position:absolute;top:-7px;right:-7px;min-width:18px;height:18px;line-height:18px;font-size:12px;padding:0 5px}
}

.tools.tight a .ico{display:none}
.tools.tight a{padding:0 10px}

.recipe .r-ex .chip{position:relative}
.recipe .r-ex .chip .badge{position:absolute;top:-7px;right:-7px;min-width:18px;height:18px;line-height:18px;font-size:12px;padding:0 5px;box-shadow:0 0 0 2px var(--band)}

@media (min-width:1000px){
  .recipe{gap:5px}
  .recipe .chip{padding-inline:10px}
  .recipe .gap{width:3px}
}
@media (min-width:1000px){
  
  .recipe .r-set .chip:not(.chip-more){padding-inline:24px}
  .recipe .gap{width:0}
  .recipe{gap:4px}
}
@media (min-width:1000px){
  
  .recipe:not(.compact){justify-content:space-between}
}

@media (min-width:1000px){
  :root.tool-wide .band-in:not(.bulk-in){padding-inline:var(--gutter)}
}

.tools.strip{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}
.tools.strip::-webkit-scrollbar{display:none}
[dir="rtl"] .tools.strip{-webkit-mask-image:linear-gradient(to left,#000 92%,transparent);mask-image:linear-gradient(to left,#000 92%,transparent)}
@media (min-width:1000px){
  
  .recipe:not(.compact){justify-content:flex-start}
  .recipe:not(.compact)>li>.chip{width:100%}
}

.sym-head{display:flex;justify-content:space-between;align-items:baseline;margin:14px 0 8px;padding-top:12px;border-top:1px solid var(--line);font-size:15px;color:var(--ink)}
.sym-reset{border:0;background:none;padding:0;font:inherit;font-size:14px;color:var(--brand-ink);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.sym-pick{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px}
.sym-pick button{height:36px;padding:0;border-radius:7px;border:1px solid var(--brand-line);background:var(--brand-soft);color:var(--brand-ink);font-family:var(--mono);font-size:18px;line-height:1;cursor:pointer;transition:background-color .12s,color .12s,border-color .12s}
.sym-pick button[aria-pressed="false"]{background:transparent;border:1px dashed var(--line-strong);color:var(--muted)}
.sym-pick button:focus-visible{outline:2px solid var(--brand-ink);outline-offset:1px}
.sym-pick.off button{opacity:.4;cursor:default}
#pop-ex .hint{margin-top:8px}

.sym-only{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-size:14px;color:var(--muted)}
.sym-only span{flex:none}
.sym-only input{flex:1;min-width:0;height:38px;padding:0 10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:17px}
.sym-only input::placeholder{font-family:var(--ui);font-size:14px;color:var(--muted);opacity:1}
.sym-only input:focus{outline:2px solid var(--brand-ink);outline-offset:0;border-color:transparent}
.sym-only input.bad{border-color:var(--s-weak)}
.sym-head-first{margin-top:0;padding-top:0;border-top:0;color:var(--muted);font-size:14px}
#pop-ex .sym-head:not(.sym-head-first) span{color:var(--muted);font-size:14px}

#pop-ex .grp-h{display:block;font-size:14px;color:var(--muted);margin:2px 0 2px;padding:0}
#pop-ex .grp{border:0;margin:14px 0 0;padding:12px 0 0;border-top:1px solid var(--line);min-width:0}
#pop-ex .grp .opt+.opt{border-top:0}
#pop-ex .grp .opt{padding:7px 0}
#pop-ex .grp .opt input[type=radio]{accent-color:var(--brand-fill)}
#pop-ex .grp.off .opt{opacity:.45;cursor:default}
.sym-custom{margin:6px 0 0 34px}
input.sym-only{display:block;width:100%;height:38px;margin:0 0 8px;padding:0 10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:17px;letter-spacing:.08em}
input.sym-only::placeholder{font-family:var(--ui);font-size:14px;letter-spacing:0;color:var(--muted);opacity:1}
input.sym-only:focus{outline:2px solid var(--brand-ink);outline-offset:0;border-color:transparent}
#pop-ex .sym-pick{grid-template-columns:repeat(8,minmax(0,1fr))}
#pop-sep .sep-c{display:flex;align-items:center;gap:12px;height:44px;margin-top:4px;padding:0 12px;border-radius:8px;color:var(--ink);cursor:text}
#pop-sep .sep-c:hover{background:var(--sunk)}
#pop-sep .sep-c.on{background:var(--brand-soft);color:var(--brand-ink)}
#pop-sep .sep-c input{width:2.4em;height:32px;padding:0;border:1px solid var(--line-strong);border-radius:6px;background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:18px;text-align:center}
#pop-sep .sep-c input:focus-visible{outline:2px solid var(--brand-ink);outline-offset:1px}
#pop-sep .sep-c .ex{margin-inline-start:auto;font-family:var(--mono);color:var(--muted)}
#pop-sep .sep-c.on .ex{color:var(--brand-ink)}
#pop-ex .grp{border:0;margin:0;padding:0}
#pop-ex .grp>legend.grp-h{float:left;width:100%;margin:14px 0 2px;padding:12px 0 0;border-top:1px solid var(--line)}
#pop-ex .grp>legend.grp-h+*{clear:both}

.recipe .split{display:flex;flex:1;min-width:0}
.recipe .split>.chip:first-child{flex:1;border-start-end-radius:0;border-end-end-radius:0}
.recipe .chip.chip-more{flex:none;position:relative;padding-inline:7px;margin-inline-start:-1px;border-start-start-radius:0;border-end-start-radius:0;color:var(--muted)}
.recipe .chip.chip-more.on{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.recipe .chip.chip-more[aria-expanded="true"] .chev{transform:rotate(180deg)}
.recipe .chip-more .dot{position:absolute;top:-4px;right:-4px;width:10px;height:10px;border-radius:50%;background:var(--brand-fill);box-shadow:0 0 0 2px var(--band)}
.recipe .chip.chip-more .chev{width:16px;height:16px;transition:transform .15s}
.after #c-am .chev{width:16px;height:16px;margin-inline-start:-4px}
.after #c-am[aria-expanded="true"] .chev{transform:rotate(180deg)}
#pop-sy .grp{margin:0;padding:0;border:0}
#pop-sy .grp .opt+.opt{border-top:0}
@media (min-width:1000px){
  .recipe.compact .r-len{grid-column:span 6;order:1}
  .recipe.compact .r-look{grid-column:span 6;order:2}
  .recipe.compact .r-set{grid-column:span 3;order:3}
}
@media (max-width:999px){
  .recipe>li.r-len{grid-column:span 6}
  .recipe>li.r-look{grid-column:span 6}
  .recipe>li.r-set{grid-column:span 3}
  .recipe .r-len{order:1}.recipe .r-look{order:2}.recipe .r-set{order:3}
}
.look-ch{font-family:var(--mono);font-size:16px;letter-spacing:.02em;margin-inline-start:2px}
.look-short{display:none}
@media (max-width:999px){.look-full{display:none}.look-short{display:inline}}

.recipe .chip.chip-info{padding-inline:9px}
.recipe .chip.chip-info .ico{width:18px;height:18px}
#pop-look{width:320px}
.look-why{margin:0 0 10px;color:var(--ink-2);font-size:15px;line-height:1.45}
.look-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px}
.look-list li{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--ink-2)}
.look-list .g{display:inline-grid;place-items:center;width:32px;height:32px;border:1px solid var(--line-strong);border-radius:7px;background:var(--bg);font-family:var(--mono);font-size:20px;color:var(--ink)}
@media (max-width:999px){
  .recipe.pw-row{grid-template-columns:repeat(24,minmax(0,1fr))}
  .recipe.pw-row>li.r-len,.recipe.pw-row>li.r-look{grid-column:span 12}
  .recipe.pw-row>li.r-set{grid-column:span 5}
  .recipe.pw-row>li.r-sy{grid-column:span 9}
  .recipe.pw-row .chip.chip-more{min-width:44px;justify-content:center}
  .recipe.pw-row .r-set .chip{padding-inline:6px;gap:6px}
}
@media (min-width:1000px){
  .recipe.pw-row .chip.chip-info{padding-inline:6px}
  .recipe.pw-row .chip.chip-more{padding-inline:5px}
  .recipe.pw-row .r-look .chip:first-child{padding-inline:8px;gap:7px}
  .recipe.pw-row .r-len .chip{padding-inline:10px}
}
@media (min-width:1000px){.recipe.pw-row{gap:3px}}
@media (max-width:999px){
  .recipe.pw-row.look-own>li.r-len{grid-column:span 24}
  .recipe.pw-row.look-own>li.r-look{grid-column:span 24;order:4}
}
@media (max-width:999px){
  .recipe.pw-row:not(.look-own)>li.r-len{grid-column:span 11}
  .recipe.pw-row:not(.look-own)>li.r-look{grid-column:span 13}
  .recipe.pw-row .r-look .chip:first-child{padding-inline:9px;gap:7px}
}

.sim-ch{letter-spacing:.06em;white-space:nowrap}
@media (max-width:999px){
  .recipe.pw-row:not(.look-own)>li.r-len{grid-column:span 12}
  .recipe.pw-row:not(.look-own)>li.r-look{grid-column:span 12}
}

.sim-ch .pr{white-space:nowrap}
.sim-ch i{font-style:normal;opacity:.6;margin:0 1px}
#c-look[aria-pressed="false"] .sim-ch .pr{text-decoration:line-through;text-decoration-thickness:1.5px}

.recipe .len-split{display:flex;flex:1;min-width:0}
.recipe .len-split>.chip{border-radius:0;margin-inline-start:-1px;justify-content:center}
.recipe .len-split>.chip:first-child{margin-inline-start:0;border-start-start-radius:var(--r);border-end-start-radius:var(--r)}
.recipe .len-split>.chip:last-child{border-start-end-radius:var(--r);border-end-end-radius:var(--r)}
.recipe .len-split .step{flex:none;width:38px;padding:0;color:var(--ink-2)}
.recipe .len-split .step .ico{width:16px;height:16px}
.recipe .len-split .step:disabled{color:var(--line-strong);cursor:default}
.recipe .len-split .len-num{flex:1;min-width:0;padding-inline:6px;cursor:default;font-variant-numeric:tabular-nums;font-size:17px;color:var(--ink)}
.recipe .len-split .len-num:hover{border-color:var(--line-strong)}
.recipe .len-split .chip-more{color:var(--ink-2)}
@media (max-width:999px){
  .recipe.pw-row:not(.look-own)>li.r-len{grid-column:span 13}
  .recipe.pw-row:not(.look-own)>li.r-look{grid-column:span 11}
  .recipe.pw-row .len-split .step{width:44px}
  .recipe.pw-row .len-split .chip-more{min-width:40px}
}
.recipe .len-split>.chip.step:first-child{flex:none}
.recipe .len-split>.chip.step{flex:none}
@media (max-width:999px){.recipe.pw-row .len-split .chip-more{min-width:44px}}

@media (max-width:359px){
  .recipe.pw-row>li.r-len,.recipe.pw-row.look-own>li.r-len{grid-column:span 24;order:1}
  .recipe.pw-row>li.r-set{grid-column:span 8;order:2}
  .recipe.pw-row>li.r-set.r-sy{grid-column:span 12;order:3}
  .recipe.pw-row>li.r-look,.recipe.pw-row.look-own>li.r-look{grid-column:span 12;order:4}
}
@media (max-width:359px){
  .recipe.pw-row:not(.look-own)>li.r-len{grid-column:span 24}
  .recipe.pw-row:not(.look-own)>li.r-look{grid-column:span 12}
}

.recipe .len-split input.len-num{width:auto;min-width:0;text-align:center;font:inherit;font-size:17px;color:var(--ink);background:var(--slab);cursor:text;outline:none}
.recipe .len-split input.len-num:focus{box-shadow:inset 0 0 0 2px var(--brand-ink);border-color:var(--brand-ink);position:relative;z-index:1}

@media (min-width:1000px){
  .recipe.pw-row{gap:6px}
  .recipe.pw-row .gap{width:10px}
}

.recipe .len-split .step.at-min{color:var(--line-strong)}

.pm-tip{position:relative;display:flex;align-items:center;gap:14px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);cursor:pointer;
  opacity:0;transform:translateY(10px);transition:opacity .32s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1)}
.pm-tip.on{opacity:1;transform:none}

.pm-tip.on .pm-tip-ic{animation:pm-tip-pop .45s cubic-bezier(.16,1,.3,1) .12s both}
@keyframes pm-tip-pop{from{transform:scale(.4);opacity:0}60%{transform:scale(1.1);opacity:1}to{transform:none;opacity:1}}
.pm-tip-ic{flex:none;width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--s-vstrong) 14%,var(--slab));color:var(--s-vstrong)}
.pm-tip-ic .ico{display:block;width:22px;height:22px}
.pm-tip-txt{flex:1 1 auto;min-width:0;margin:0;color:var(--ink-2);font-size:15px;line-height:1.45;text-wrap:pretty}
.pm-tip-txt b{display:block;margin-bottom:1px;color:var(--ink);font-family:"PG Bold",var(--ui);font-weight:700;font-size:16px}
.pm-tip-short{display:none}
.pm-tip-go{flex:none;display:inline-flex;align-items:center;height:40px;padding:0 16px;border:1px solid var(--brand-line);border-radius:var(--r);background:var(--slab);
  color:var(--brand-ink);font-family:"PG Bold",var(--ui);font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap}
.pm-tip-go::after{content:"";position:absolute;inset:0}
.pm-tip:hover .pm-tip-go{border-color:var(--brand-ink);background:var(--brand-soft)}
.pm-tip:hover .pm-tip-txt b{color:var(--brand-ink)}
.pm-tip-go:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px}
@media (max-width:699px){
  .pm-tip{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:6px 14px}
  .pm-tip-ic{width:36px;height:36px}.pm-tip-ic .ico{width:20px;height:20px}
  .pm-tip-go{grid-column:2;grid-row:2;justify-self:start;margin-top:4px}
    .pm-tip-long{display:none}.pm-tip-short{display:inline}
}
@media (prefers-reduced-motion:reduce){.pm-tip{transition:opacity .2s;transform:none}.pm-tip.on .pm-tip-ic{animation:none}}
.pin-hint{margin:8px 0 0;font-size:15px;color:var(--ink-2)}
.pin-hint a{color:var(--brand-ink)}
@media (max-width:999px){.recipe.pw-row .len-split input.len-num{padding-inline:1px;font-size:16px}}

@media (hover:hover) and (pointer:fine){
  .recipe .len-split input.len-num{cursor:ew-resize}
  :root.scrubbing,:root.scrubbing *{cursor:ew-resize !important;user-select:none}
}
.recipe .split>.chip:first-child{justify-content:center}

.recipe .look-tog .sim-ch{font-size:17px;letter-spacing:.08em}
.recipe .look-tog[aria-pressed="true"] .sim-ch{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:currentColor}
.recipe .look-tog[aria-pressed="false"]{color:var(--ink-2)}

.recipe.pw-row .chip .box{display:none}
.recipe.pw-row .r-set .chip,.recipe.pw-row .look-tog{gap:0}
.recipe.pw-row .r-set .chip>span:not(.sr),.recipe.pw-row .look-tog .sim-ch{font-size:17px;letter-spacing:.04em}
.recipe.pw-row .r-set .chip[aria-pressed="false"]>span:not(.sr),
.recipe.pw-row .look-tog[aria-pressed="false"] .sim-ch{text-decoration:line-through;text-decoration-thickness:2px;color:var(--muted)}
.recipe.pw-row .look-tog[aria-pressed="true"] .sim-ch{text-decoration:none}
.recipe.pw-row .look-tog[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.recipe.pw-row .look-tog[aria-pressed="false"]{background:var(--slab);border-color:var(--line-strong)}

@media (min-width:1000px){
  .recipe.pw-row .len-split .len-num{flex:0 0 auto;width:4.2ch;padding-inline:4px}
  .recipe.pw-row .len-split{flex:none}
}
@media (min-width:1000px){.recipe.pw-row .len-split .len-num{width:calc(4.2ch + 10px)}}

@media (min-width:1000px){
  .recipe.pw-row:not(.compact)>li:not(.gap):not(.r-len){flex:1 1 auto}
  .recipe.pw-row:not(.compact)>li.r-len{flex:none}
  .recipe.pw-row:not(.compact)>li.r-look:not(.gap){flex:4 1 auto}   
}

.btn-icon .ico{transition:none}
.btn-icon.spin .ico{transform:none;animation:pg-turn .5s cubic-bezier(.25,.8,.25,1)}
@keyframes pg-turn{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.btn-icon.spin .ico{animation:none}}

.recipe.pw-row .look-tog[aria-pressed="false"]{background:var(--slab);border-color:var(--line-strong);color:var(--ink-2)}
.recipe.pw-row .look-tog[aria-pressed="false"] .sim-ch{text-decoration:none;color:var(--ink-2)}
.recipe.pw-row .look-tog[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.recipe.pw-row .look-tog[aria-pressed="true"] .sim-ch{text-decoration:line-through;text-decoration-thickness:2px;color:var(--brand-ink)}
#pop-look{width:auto;max-width:calc(100vw - 24px)}
.look-grid{list-style:none;margin:2px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,58px);gap:8px}
.look-grid li{display:flex;flex-direction:column;align-items:center;gap:4px}
.look-grid .g{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line-strong);border-radius:8px;background:var(--bg);font-family:var(--mono);font-size:24px;color:var(--ink)}
.look-grid .n{font-size:12px;line-height:1.2;color:var(--muted);text-align:center}

.recipe.pp-row .opt-tog .opt-ch{font-size:17px;letter-spacing:.04em}
.recipe.pp-row .opt-tog[aria-pressed="false"]{background:var(--slab);border-color:var(--line-strong);color:var(--ink-2)}
.recipe.pp-row .len-split .len-num{flex:0 0 auto;width:3.4ch;padding-inline:4px;font-size:17px;color:var(--ink);cursor:default}
.recipe.pp-row .len-split .step.at-min{color:var(--line-strong)}
@media (min-width:1000px){
  .recipe.pp-row{gap:6px}
  .recipe.pp-row .gap{width:10px}
  .recipe.pp-row:not(.compact)>li:not(.gap):not(.r-words){flex:1 1 auto}
  .recipe.pp-row:not(.compact)>li.r-words{flex:none}
  .recipe.pp-row .len-split{flex:none}
}
@media (max-width:999px){
  .recipe.pp-row{grid-template-columns:repeat(24,minmax(0,1fr))}
  .recipe.pp-row>li.r-words{grid-column:span 10}
  .recipe.pp-row>li.r-sep{grid-column:span 14}
  .recipe.pp-row>li.r-opt{grid-column:span 6}
  .recipe.pp-row>li.r-wl{grid-column:span 12}
  .recipe.pp-row .len-split .step{width:44px}
  .recipe.pp-row .len-split .len-num{flex:1}
}

.stack{display:inline-grid;justify-items:center}
.stack>*{grid-area:1/1}
.stack>.sizer{visibility:hidden;white-space:nowrap}
.stack{justify-items:start}

.recipe .chip:has(>.stack):has(>.chev){justify-content:flex-start}
.recipe .chip:has(>.stack):has(>.chev)>.chev{margin-inline-start:auto}

.recipe.pp-row .len-split .len-num{width:auto;padding-inline:14px}
.recipe.pp-row .len-split .len-num .stack{justify-items:center}
@media (max-width:999px){
  .recipe.pp-row>li.r-words{grid-column:span 12}
  .recipe.pp-row>li.r-sep{grid-column:span 12}
  .recipe.pp-row .len-split .len-num{padding-inline:6px}
}

@media (max-width:359px){
  .recipe.pp-row>li.r-words,.recipe.pp-row>li.r-sep,.recipe.pp-row>li.r-wl{grid-column:span 24}
  .recipe.pp-row>li.r-opt{grid-column:span 12}
}

#pop-look{width:280px}
.look-list.plain{grid-template-columns:1fr 1fr;gap:8px 18px;margin-top:4px}
.look-list.plain li{gap:12px}
.look-list.plain .g{width:auto;min-width:18px;height:auto;border:0;background:none;border-radius:0;font-size:24px;line-height:1;color:var(--ink)}
.look-list.plain .n{font-size:15px;color:var(--ink-2)}
@media (max-width:860px){#pop-look{width:auto}}

.recipe.pw-row .r-set .chip[aria-pressed="false"],
.recipe.pw-row .look-tog[aria-pressed="false"],
.recipe.pp-row .opt-tog[aria-pressed="false"],
.recipe .chip.chip-more:not(.on):is(#c-sym, #c-look-i){background:transparent;border-color:var(--line-strong);box-shadow:none}
.recipe.pw-row .r-set .chip[aria-pressed="true"],
.recipe.pw-row .look-tog[aria-pressed="true"],
.recipe.pp-row .opt-tog[aria-pressed="true"],
.recipe .chip.chip-more.on{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.recipe.pw-row .r-set .chip[aria-pressed="false"]>span:not(.sr){color:var(--muted)}

.recipe.pw-row .r-set .chip[aria-pressed="true"],
.recipe.pw-row .look-tog[aria-pressed="true"],
.recipe.pp-row .opt-tog[aria-pressed="true"],
.recipe .chip.chip-more.on{background:color-mix(in srgb,var(--brand-fill) 17%,var(--slab));border-color:color-mix(in srgb,var(--brand-fill) 60%,var(--slab))}

.recipe.pin-row .look-tog[aria-pressed="false"]{background:transparent;border-color:var(--line-strong);color:var(--ink-2)}
.recipe.pin-row .look-tog[aria-pressed="false"] .sim-ch{text-decoration:none;color:var(--ink-2)}
.recipe.pin-row .look-tog[aria-pressed="true"]{background:color-mix(in srgb,var(--brand-fill) 17%,var(--slab));border-color:color-mix(in srgb,var(--brand-fill) 60%,var(--slab));color:var(--brand-ink)}
.recipe.pin-row .look-tog[aria-pressed="true"] .sim-ch{text-decoration:line-through;text-decoration-thickness:2px}
.recipe.pin-row .look-tog .sim-ch{font-size:17px;letter-spacing:.06em}
.recipe .chip.chip-more:not(.on)#c-skip-i{background:transparent;border-color:var(--line-strong)}
@media (min-width:1000px){ .recipe.pin-row:not(.compact)>li.r-look{flex:0 1 220px} }
@media (max-width:999px){ .recipe.pin-row>li.r-look{grid-column:span 12} }
@media (max-width:359px){ .recipe.pin-row>li.r-words,.recipe.pin-row>li.r-look{grid-column:span 24} }
.out.pin:not(.many){height:84px}
.skip-list{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:8px}
.skip-list li{display:grid;grid-template-columns:7.5em 1fr;gap:12px;align-items:baseline}
.skip-list .ex{font-family:var(--mono);font-size:17px;color:var(--ink)}
.skip-list .n{font-size:15px;color:var(--ink-2)}
#pop-skip{width:360px}
@media (max-width:860px){#pop-skip{width:auto}}
@media (min-width:1000px){ .recipe.pin-row:not(.compact)>li.r-look{flex:none} .recipe.pin-row .look-tog{padding-inline:22px} }
@media (min-width:1000px){ .recipe.pp-row.pin-row:not(.compact)>li.r-look:not(.gap):not(.r-words){flex:none} }

.recipe.pin-row .look-tog.skip-words{font-size:16px;letter-spacing:0;text-decoration:none}
.recipe.pin-row .look-tog.skip-words[aria-pressed="true"]{text-decoration:none}
@media (max-width:999px){ .recipe.pin-row.look-own>li.r-words,.recipe.pin-row.look-own>li.r-look{grid-column:span 24} }
@media (max-width:999px){ .recipe.pin-row:not(.look-own)>li.r-words{grid-column:span 11} .recipe.pin-row:not(.look-own)>li.r-look{grid-column:span 13} .recipe.pin-row .look-tog.skip-words{padding-inline:8px} }
@media (max-width:999px){ .recipe.pin-row .chip-more{min-width:44px;justify-content:center} .recipe.pin-row .look-tog.skip-words{padding-inline:6px;font-size:15px} }
@media (max-width:359px){ .recipe.pin-row:not(.look-own)>li.r-words,.recipe.pin-row:not(.look-own)>li.r-look{grid-column:span 24} }

.recipe .r-set .chip[aria-pressed="true"],
.recipe .look-tog[aria-pressed="true"],
.recipe .opt-tog[aria-pressed="true"],
.recipe .chip.chip-more.on,
.recipe.pw-row .r-set .chip[aria-pressed="true"],
.recipe.pw-row .look-tog[aria-pressed="true"],
.recipe.pp-row .opt-tog[aria-pressed="true"],
.recipe.pin-row .look-tog[aria-pressed="true"]{background:var(--slab);border-color:var(--line-strong);color:var(--brand-ink);box-shadow:inset 0 -3px 0 var(--brand-fill)}
.recipe .r-set .chip[aria-pressed="true"]>span:not(.sr),
.recipe .opt-tog[aria-pressed="true"] .opt-ch{color:var(--brand-ink)}

.recipe .r-set .chip[aria-pressed="true"],
.recipe .look-tog[aria-pressed="true"],
.recipe .opt-tog[aria-pressed="true"],
.recipe .chip.chip-more.on,
.recipe.pw-row .r-set .chip[aria-pressed="true"],
.recipe.pw-row .look-tog[aria-pressed="true"],
.recipe.pp-row .opt-tog[aria-pressed="true"],
.recipe.pin-row .look-tog[aria-pressed="true"]{background:var(--slab);border-color:var(--line-strong);color:var(--brand-ink);box-shadow:none}
.recipe .r-set .chip>span:not(.sr):not(.box)::before,
.recipe .opt-tog .opt-ch::before,
.recipe .look-tog.skip-words::before{content:"✓";display:inline-block;width:.9em;margin-inline-end:5px;font-family:var(--ui);font-weight:400;color:transparent;text-decoration:none}
.recipe .r-set .chip[aria-pressed="true"]>span:not(.sr):not(.box)::before,
.recipe .opt-tog[aria-pressed="true"] .opt-ch::before,
.recipe .look-tog.skip-words[aria-pressed="true"]::before{color:var(--brand-fill)}

.recipe .r-set .chip>span:not(.sr):not(.box),.recipe .opt-tog .opt-ch{position:relative}
.recipe .look-tog.skip-words{position:relative}
.recipe .r-set .chip>span:not(.sr):not(.box)::before,
.recipe .opt-tog .opt-ch::before{position:absolute;right:100%;top:50%;transform:translateY(-50%);width:auto;margin:0 6px 0 0}
.recipe .look-tog.skip-words::before{position:static}
.recipe .r-set .chip[aria-pressed="true"]>span:not(.sr):not(.box)::before,
.recipe .opt-tog[aria-pressed="true"] .opt-ch::before,
.recipe .look-tog.skip-words[aria-pressed="true"]::before{color:var(--brand-ink)}

.recipe.pp-row .opt-tog{padding-inline:26px}
.recipe .look-tog.skip-words{padding-inline:30px}
.recipe .look-tog.skip-words::before{position:absolute;left:12px;top:50%;transform:translateY(-50%);margin:0}
@media (max-width:999px){ .recipe.pin-row .look-tog.skip-words{padding-inline:24px} .recipe.pin-row .look-tog.skip-words::before{left:7px} }

.recipe .r-set .chip>span:not(.sr):not(.box)::before,
.recipe .opt-tog .opt-ch::before{right:auto;inset-inline-end:100%;margin:0;margin-inline-end:6px}
.recipe .look-tog.skip-words::before{left:auto;inset-inline-start:12px}
@media (max-width:999px){ .recipe.pin-row .look-tog.skip-words::before{left:auto;inset-inline-start:7px} }

.recipe .chip-more .dot{top:7px;right:auto;inset-inline-end:5px;width:6px;height:6px;box-shadow:none;background:var(--brand-ink)}

.recipe .r-set .chip.chip-more>span.dot{position:absolute;top:8px;inset-inline-end:6px}
.recipe .r-set .chip.chip-more>span.dot::before{content:none}
.sy-stack{justify-items:center;font-family:var(--mono);letter-spacing:.02em}
.sy-stack{justify-items:start}

.top-in .brand{font-size:19px;gap:8px}
.top-in .brand .lock{width:15px;height:21px}
@media (max-width:999px){ .top-in .brand{font-size:18px} .top-in .brand .lock{width:14px;height:20px} }

@media (min-width:1000px){ :root{--rail:154px} }
@media (hover:hover) and (pointer:fine){
  .recipe.recipe.recipe :is(.r-set .chip,.look-tog,.opt-tog,.chip-more):hover{border-color:var(--brand-line);color:var(--brand-ink);background:color-mix(in srgb,var(--brand-fill) 7%,var(--slab))}
  .recipe.recipe.recipe :is(.r-set .chip,.look-tog,.opt-tog)[aria-pressed="false"]:hover,
  .recipe.recipe.recipe :is(.r-sy,.r-look) .chip-more:not(.on):hover{background:transparent;border-color:var(--brand-line)}
  .recipe.recipe.recipe :is(.r-set .chip,.look-tog,.opt-tog)[aria-pressed="false"]:hover :is(span:not(.sr):not(.box),.sim-ch,.opt-ch){color:var(--ink-2)}
  
  .recipe.recipe.recipe :is(.r-set .chip,.look-tog,.opt-tog)[aria-pressed="true"]:hover{background:var(--slab)}
  .recipe.recipe .len-split .step:hover,.recipe.recipe .len-split input.len-num:hover{border-color:var(--brand-line);color:var(--brand-ink);background:color-mix(in srgb,var(--brand-fill) 7%,var(--slab));position:relative;z-index:1}
  .recipe.recipe .len-split input.len-num:focus{background:var(--slab)}
  .guide .job:hover{background:color-mix(in srgb,var(--brand-fill) 5%,transparent)}
  .top-in .brand:hover{opacity:.85}
}
.guide .job{border-radius:8px;transition:background-color .15s}
@media (max-width:999px){ .recipe.pp-row .r-wl .chip{padding-inline:8px;gap:6px} }

@media (max-width:999px){
  .recipe.pp-row:not(.pin-row)>li.r-opt{grid-column:span 12}
  .recipe.pp-row:not(.pin-row)>li.r-wl{grid-column:span 24}
}

.out:has(#phrase){min-height:79px}
@media (max-width:860px){ .out:has(#phrase){min-height:100px} }
.slab-foot:has(.verdict):is(#strength){min-height:50px}

.out:not(.phrase) .out-text{word-break:break-all;overflow-wrap:anywhere;line-break:anywhere}

#pop-sy .opt-note{grid-column:2;font-size:13px;color:var(--muted);margin-top:2px}
#pop-sy .sym-term{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
#pop-sy .sym-term p{margin:0 0 6px;font-size:14px;line-height:1.45;color:var(--ink-2)}
#pop-sy .sym-term code{font-family:var(--mono);font-size:15px;color:var(--ink)}
#pop-sy .sym-term-btn{height:34px;margin-inline-start:-10px;font-size:15px}

.sy-stack{justify-items:center}
.recipe .r-set .chip>span.sy-stack::before{content:none}
#sy-lbl{position:relative}
#sy-lbl::before{content:"✓";position:absolute;inset-inline-end:100%;top:50%;transform:translateY(-50%);margin-inline-end:6px;font-family:var(--ui);color:transparent;text-decoration:none;display:inline-block}
.recipe .r-set .chip[aria-pressed="true"] #sy-lbl::before{color:var(--brand-ink)}
.recipe.recipe .r-set .chip>span.sy-stack:not(.sr):not(.box)::before{content:none}
#pop-sy .sym-term .nw{white-space:nowrap}

@media (max-width:999px){ .recipe.un-row>li.r-max{grid-column:span 12} }

@media (min-width:1000px){ .bulk{grid-template-columns:300px minmax(0,1fr)} }
.recipe.pp-row.bk-row{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin:0}
.recipe.pp-row.bk-row>li{grid-column:1/-1;flex:none}
.recipe.pp-row.bk-row .len-split{flex:1}
.recipe.pp-row.bk-row .len-split .len-num{flex:1}
.bulk-note .count{color:var(--ink-2)}
@media (max-width:999px){ .recipe.pp-row.bk-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .recipe.pp-row.bk-row>li.r-sep,.recipe.pp-row.bk-row>li.r-words{grid-column:auto} }
.recipe.pp-row.bk-row .chip{justify-content:center}
.recipe.pp-row.bk-row .r-sep .chip{justify-content:space-between}
.recipe.pp-row.bk-row .len-split .step{width:42px}
.recipe.pp-row.bk-row .len-split .len-num{padding-inline:10px}
.recipe.pp-row.bk-row .opt-tog .opt-ch{font-size:16px;letter-spacing:0}

.recipe.pp-row.wf-row{display:flex;flex-wrap:wrap;gap:8px}
.recipe.pp-row.wf-row>li,.recipe.pp-row.wf-row:not(.compact)>li:not(.gap):not(.r-words){flex:none}
.wf-input{color:var(--ink)}
.wf-input.mono::placeholder{font-family:var(--ui);font-size:18px;letter-spacing:0}
.wf-slab .slab-foot{flex-wrap:nowrap;align-items:center}
.recipe.pp-row.wf-row .opt-tog{padding-inline:30px 22px}
.recipe.pp-row.wf-row .opt-tog .opt-ch{font-size:16px;letter-spacing:0}
.wf-main{display:grid;grid-template-columns:minmax(0,1fr) 264px;gap:28px;padding:20px 24px 22px;align-items:start}
.wf-fields .field:first-child{margin-top:0}
.wf-fields .field:last-child{margin-bottom:0}
.wf-input{height:52px;font-size:18px;background:var(--slab)}
.wf-input.mono{font-family:var(--mono);font-size:20px;letter-spacing:.02em}
.wf-pw{display:grid;grid-template-columns:minmax(0,1fr) 52px 52px 52px;gap:8px}
.wf-pw .btn-icon{width:52px;height:52px}
.wf-pw.wf-long{grid-template-columns:52px 52px 52px minmax(0,1fr)}
.wf-pw.wf-long .wf-input{grid-column:1/-1}
.wf-note{margin-top:4px}
.link-btn.inline{display:inline;height:auto;padding:0;font-size:inherit;text-decoration:underline;text-underline-offset:2px}
.link-btn.inline:hover{background:none}
.wf-qr .qr-box{padding:12px;aspect-ratio:1}
.wf-qr .qr-box canvas{width:100%;height:auto;max-width:240px}
.wf-qr .qr-box.is-empty{background:var(--sunk);border-style:dashed;border-color:var(--line-strong)}
.qr-empty{margin:0;padding:0 18px;text-align:center;color:var(--ink-2);font-size:15px;line-height:1.45}
.wf-slab .slab-foot{gap:8px;color:var(--ink-2)}
.wf-slab .slab-foot .ico{width:16px;height:16px;flex:none;color:var(--s-vstrong)}   
.after .link-btn:disabled,.link-btn:disabled{color:var(--muted);cursor:default;background:none}
.link-btn:disabled .ico{opacity:.6}

.link-btn[hidden]{display:none}
.qr-more{margin:-10px 22px 20px;text-align:center}
.qr-more a{color:var(--brand-ink)}
@media (max-width:760px){
  .wf-main{grid-template-columns:minmax(0,1fr);gap:18px;padding:16px}
  .wf-qr{max-width:260px;width:100%;justify-self:center}
  .wf-qr .qr-box.is-empty{aspect-ratio:auto;min-height:96px}
  .wf-input.mono{font-size:17px;letter-spacing:0;padding-inline:10px}
  .wf-pw{grid-template-columns:48px 48px 48px minmax(0,1fr);gap:6px}
  .wf-pw .wf-input{grid-column:1/-1}   
  .wf-pw .btn-icon{width:48px}
}
.bulk-bar .split{display:inline-flex}
.bulk-bar .foot-sp{display:none}   
.bulk-bar .btn-icon{width:44px;height:44px}

.bulk-bar #dl{gap:8px;padding-inline:14px 10px;color:var(--brand-ink);border-color:var(--brand-line)}
.bulk-bar #dl>span{font-family:"PG Bold",var(--ui);font-weight:700}
.bulk-bar #dl .chev{width:16px;height:16px;margin-inline-start:2px;transition:transform .15s}
.bulk-bar #dl[aria-expanded="true"] .chev{transform:rotate(180deg)}
.bulk-bar #dl.alone .chev{display:none}
.bulk-bar #dl:hover:not(:disabled){background:var(--brand-soft);border-color:var(--brand-ink);color:var(--brand-ink)}
.bulk-bar #dl:disabled{color:var(--muted);border-color:var(--line-strong)}

@media (max-width:999px){
  .bulk-bar{flex-wrap:wrap;row-gap:8px}
  .bulk-bar #dl{order:1;flex:1 1 100%}
  .bulk-bar #print{order:2;padding-inline:14px}
  .bulk-bar #regen{order:3;flex:none}
  .bulk-bar #copyall{order:4;flex:1}
}
@media (max-width:360px){ .bulk-bar #print{font-size:0;gap:0;width:44px;padding:0;flex:none} }
.bulk-bar.tight #print{font-size:0;gap:0;width:44px;padding:0;flex:none}

@media (max-width:999px){
  .bulk-bar .foot-sp{display:none}
  .bulk-note .count{white-space:nowrap}
  .recipe.pw-row .r-set .chip{padding-inline:2px}
  .recipe.pw-row .r-set .chip>span:not(.sr):not(.box)::before,
  .recipe.pw-row #sy-lbl::before{position:static;transform:none;display:inline-block;width:auto;margin:0;margin-inline-end:5px}
  .bulk .tbl.bulk-tbl td{white-space:normal}   
}

@media (min-width:861px){   
  .bulk-tbl{width:100%}
  .tbl.bulk-tbl td.c-name,.tbl.bulk-tbl td.c-user{max-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .bulk-tbl td.c-name{width:45%}
  .bulk-tbl td.c-user{width:55%}
  .bulk-tbl td.c-copy,.bulk-tbl th:nth-child(4){width:1%}
  .bulk-tbl td.c-pw,.bulk-tbl th:nth-child(3){width:1%;white-space:nowrap}
  .bulk .tbl.bulk-tbl td.c-pw{white-space:nowrap;word-break:normal;overflow-wrap:normal}   
}
@media (min-width:1000px) and (max-width:1199px){ .bulk{grid-template-columns:270px minmax(0,1fr)} }

@media (min-width:1000px){ .band-in.bulk-in{max-width:var(--wide);margin-inline:auto;padding-inline:var(--gutter)} }

@media (min-width:1000px){
  .bulk{grid-template-columns:minmax(0,9fr) minmax(0,11fr);align-items:stretch}
  .bulk-form{padding:20px 22px;align-content:start}
  .bulk-form>.mode-count .input{max-width:200px}
  .recipe.pp-row.bk-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .recipe.pp-row.bk-row>li.r-sep,.recipe.pp-row.bk-row>li.r-words{grid-column:auto}
  .bulk-out{display:flex;flex-direction:column}
  .bulk-out .tbl-wrap{flex:1 1 0;min-height:240px;max-height:none;overflow:auto}
}
@media (min-width:1000px) and (max-width:1199px){ .bulk{grid-template-columns:minmax(0,2fr) minmax(0,3fr)} }   
.bulk .hl-field textarea{min-height:calc(10 * 15px * 1.55 + 22px)}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--slab);color:var(--ink);padding:10px 14px;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.2);text-decoration:none}
.skip:focus{top:12px}
main:focus{outline:none}
@media (max-width:860px){ .bulk .tbl-wrap{max-height:none;overflow:visible} }
.bulk-form .hint.warn{color:var(--s-weak)}
.bulk-form .input[aria-invalid="true"]{border-color:var(--s-weak)}
.bulk .tbl.bulk-tbl tr.empty-row td{white-space:normal;color:var(--muted);padding-block:24px}
.reasons .link-btn{margin-inline-start:-10px;text-decoration:none}

.check-slab .check-res{padding:0 24px}
.check-slab .meter{align-self:center;gap:4px}
.check-slab .meter i{width:28px;height:6px}
.check-slab .vrow{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;padding:4px 0 10px}
.check-slab .vrow:has(.verdict:empty){display:none}
.check-slab .verdict{font-size:30px;font-weight:600;line-height:1.15;color:var(--ink)}
.check-slab .check-res:has(.meter[data-l="1"]) .verdict{color:var(--s-weak)}
.check-slab .check-res:has(.meter[data-l="2"]) .verdict{color:var(--s-fair)}
.check-slab .check-res:has(.meter[data-l="3"]) .verdict{color:var(--s-strong)}
.check-slab .check-res:has(.meter[data-l="4"]) .verdict{color:var(--s-vstrong)}
.check-slab .ttc{font-size:17px;color:var(--ink-2)}
a.ttc{color:inherit;text-decoration:underline dotted;text-underline-offset:3px}   
a.ttc:hover{color:var(--brand-ink)}
.check-slab .bits{margin-inline-start:auto;font-size:14px;color:var(--muted)}
.check-slab .reasons{min-height:0;padding:0 24px 18px;gap:6px}
.check-slab .check-res:has(.verdict:empty)+.reasons{padding-top:4px}
.check-slab .reasons li:not(.muted){padding-inline-start:24px}
.check-slab .reasons li.bad::before,.check-slab .reasons li.good::before{width:auto;height:auto;top:0;border-radius:0;background:none;font-weight:700}
.check-slab .reasons li.bad::before{content:"✕";color:var(--s-weak)}
.check-slab .reasons li.good::before{content:"✓";color:var(--s-vstrong)}
.check-slab .breach{align-items:center;margin:0;padding:12px 24px;border-top:1px solid var(--line);background:var(--sunk);border-radius:0 0 13px 13px}
.check-slab .breach[hidden]{display:none}
@media (max-width:860px){
  .check-slab .check-res,.check-slab .breach{padding-inline:16px}
  .check-slab .reasons{padding:0 16px 16px}
  .check-slab .verdict{font-size:26px}
  .check-slab .ttc{flex-basis:100%}   
  .check-slab .bits{display:none}
}
.hl-field{position:relative}
.hl-field textarea{position:relative;z-index:1;display:block;background:transparent;color:transparent;caret-color:var(--ink)}
.hl-field textarea::selection{background:color-mix(in srgb,var(--brand-ink) 28%,transparent);color:transparent}
.hl-field .hl{position:absolute;inset:0;margin:0;border:1px solid transparent;border-radius:var(--r);background:var(--sunk);padding:10px 12px;font:15px/1.55 var(--mono);white-space:pre;overflow:hidden;color:var(--ink);pointer-events:none}
.hl .e,.lab .hl-e{color:var(--brand-ink)}
.hl .s{color:var(--muted)}
.hl .x{color:var(--s-weak);text-decoration:underline wavy var(--s-weak);text-underline-offset:3px}
.lab .hl-n,.lab .hl-e{font-family:"PG Bold",var(--ui);font-weight:700}

.hl .h,.hl .i{color:var(--muted)}
.hl .h{font-style:italic}
.hl-field .hl-tags{position:absolute;inset:0;z-index:2;margin:0;border:1px solid transparent;padding:10px 12px;font:15px/1.55 var(--mono);white-space:pre;overflow:hidden;pointer-events:none;text-align:end}
.hl-tags .tag{padding:1px 7px;border-radius:999px;font:13px/1 "Titillium Web",system-ui,sans-serif;color:var(--muted);background:color-mix(in srgb,var(--muted) 16%,var(--sunk));box-shadow:-10px 0 8px -2px var(--sunk)}
.hl-tags .tag.bad{color:var(--s-weak);background:color-mix(in srgb,var(--s-weak) 13%,var(--sunk))}

.people-sum{overflow:hidden}
.people-sum .sum-in{display:flex;flex-wrap:wrap;row-gap:2px;margin-inline-start:-18px}
.people-sum .sum-in>span::before{content:"·";display:inline-block;width:18px;text-align:center;color:var(--muted)}
.people-sum .warn{color:var(--s-weak)}
.recipe.pp-row.bk-row>li[hidden]{display:none}

@media (max-width:520px){ .recipe.pp-row.bk-row{grid-template-columns:minmax(0,1fr)} }
.bk-notes .hint{margin:0}
.bk-notes .hint+.hint{margin-top:6px}
.bulk-tbl tr.bad td.c-user{color:var(--s-weak)}
.bulk-tbl tr.bad td.c-user .ico{display:inline-block;width:16px;height:16px;vertical-align:-3px;margin-inline-end:6px}

#exp-choice button{flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;height:auto;min-height:52px;padding:7px 12px}
#exp-choice button .ex{font-family:inherit;font-size:14px;line-height:1.3}

.cc{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:45;width:min(760px,calc(100% - 32px));display:flex;align-items:center;gap:16px;padding:14px 16px 14px 20px;background:var(--slab);color:var(--ink);border:1px solid var(--line-strong);border-radius:14px;box-shadow:var(--pop-shadow)}
.cc[hidden]{display:none}
.cc-text{margin:0;flex:1;font-size:15px;line-height:1.45;color:var(--ink-2)}
.cc-text a{color:var(--brand-ink);white-space:nowrap}
.cc-btns{display:flex;gap:8px;flex:none}
.cc-btns .btn{height:42px;padding:0 18px;font-size:16px;min-width:96px}

.cc{border-top:4px solid var(--brand-fill);box-shadow:0 10px 32px rgb(20 30 90 / .28)}
.cc .cc-yes{background:var(--brand-fill);border-color:var(--brand-fill);color:var(--on-brand);font-weight:700}
.cc .cc-yes:hover{filter:brightness(1.08)}
.cc .cc-no{background:var(--slab);border-color:var(--line-strong);color:var(--ink)}
body.cc-on .fb-fab{display:none}
@media (max-width:640px){ .cc{flex-direction:column;align-items:stretch;bottom:0;width:100%;border-radius:14px 14px 0 0;padding:16px} .cc-btns .btn{flex:1} }
@media print{ .cc{display:none!important} }

.fb-fab{position:fixed;right:20px;bottom:20px;z-index:40;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--slab);color:var(--brand-ink);border:1px solid var(--line-strong);box-shadow:0 4px 14px rgb(0 0 0 / .14);cursor:pointer}
.fb-fab:hover{border-color:var(--brand-ink)}
.top-fab{position:fixed;left:20px;bottom:calc(20px + var(--lift,0px));z-index:40;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--slab);color:var(--brand-ink);border:1px solid var(--line-strong);box-shadow:0 4px 14px rgb(0 0 0 / .14);cursor:pointer;transition:opacity .2s,transform .2s}
.top-fab:hover{border-color:var(--brand-ink)}
.top-fab .ico{width:22px;height:22px;transform:rotate(-90deg)}
.top-fab.off{opacity:0;transform:translateY(12px);pointer-events:none}
body.cc-on .top-fab{display:none}
@media (max-width:860px){.top-fab{left:12px;bottom:calc(12px + var(--lift,0px));width:44px;height:44px}}
@media (prefers-reduced-motion:reduce){.top-fab{transition:none}}
.fb-fab .ico{width:22px;height:22px}
#pop-fb{width:360px}
@media (min-width:861px){ #pop-fb{position:fixed;inset:auto 20px 80px auto} }
#pop-fb .fb-msg{height:auto;min-height:110px;padding:10px 12px;resize:vertical;font:16px/1.45 var(--ui)}
#pop-fb .fb-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
#pop-fb .hint{margin-top:8px}

#pop-fb .fb-done{display:none}
#pop-fb.sent > :not(.pop-head):not(.fb-done){display:none}
#pop-fb.sent .fb-done{display:flex;flex-direction:column;align-items:center;gap:12px;padding:18px 8px 6px;text-align:center}
#pop-fb .fb-done .ico{width:44px;height:44px;color:var(--s-strong)}
#pop-fb .fb-done-t{margin:0;font-size:17px;line-height:1.45}
#pop-fb .fb-size{width:36px;height:36px;border-color:transparent;background:none;color:var(--muted)}
#pop-fb .fb-size:hover{color:var(--brand-ink);border-color:var(--line-strong)}
#pop-fb .fb-size .ico{width:18px;height:18px}
#pop-fb.big{width:min(680px,calc(100vw - 40px))}
#pop-fb.big .fb-msg{min-height:min(340px,calc(100dvh - 430px))}

@media (min-width:861px){ #pop-fb{max-height:calc(100dvh - 100px);overflow-y:auto} }
#pop-fb .fb-left{text-align:end;margin-top:4px}
@media (max-width:860px){ #pop-fb{width:100%} #pop-fb .fb-size{display:none} #pop-fb .fb-msg{min-height:34vh} }   
#pop-fb label[for=fb-email]{margin-top:16px}
#pop-fb .fb-status{color:var(--ink)}
#pop-fb .fb-send{margin-top:12px;width:100%}
@media (max-width:860px){ .fb-fab{right:12px;bottom:12px;width:44px;height:44px;transition:transform .2s ease-out,opacity .2s} .fb-fab.away{transform:translateY(72px);opacity:0;pointer-events:none} }
@media (prefers-reduced-motion:reduce){ .fb-fab{transition:none} }

.wf-raw{margin-top:10px;font-size:14px;color:var(--muted)}
.wf-raw summary{cursor:pointer;width:max-content;max-width:100%}
.wf-raw code{display:block;margin-top:6px;padding:8px 10px;border-radius:8px;background:var(--sunk);color:var(--ink);font:14px/1.45 var(--mono);overflow-wrap:anywhere}
.wf-raw .hint{margin-top:6px;font-size:13px}
#pop-wprint .lab{margin-top:12px}
#pop-wprint .input,#pop-wprint .select{width:100%}
#pop-wprint .select option{background:var(--slab);color:var(--ink)}
#pop-wprint .hint{margin-top:12px}
#pop-wprint #sg-go{margin-top:14px;width:100%}
#pop-print .lab{margin-top:12px}
#pop-print .input{width:100%}
#pop-print .hint{margin-top:10px}
#pop-print #print-go{margin-top:14px;width:100%}
.check-private{margin:14px 0 0;font-size:15px;line-height:1.5;color:var(--ink-2)}
.check-private .ico{display:inline-block;width:16px;height:16px;vertical-align:-3px;margin-inline-end:8px;color:var(--s-vstrong)}
.check-private a{color:var(--brand-ink);white-space:nowrap}

.title:has(+.check-private){margin-bottom:12px}
.title+.check-private{margin:-8px 0 22px;font-size:16px;line-height:1.45}
.title+.check-private+.tray{margin-top:0}
@media (max-width:640px){.title+.check-private{font-size:15px;margin:-4px 0 18px}}
.breach-status{flex:1 1 320px;margin:0;max-width:62ch;font-size:14px;line-height:1.5;color:var(--muted)}
.breach-status .res:not(:empty){margin-inline-end:.35em;font-weight:600;color:var(--ink)}
.breach-status .res.good{color:var(--s-vstrong)}
.breach-status .res.bad{color:var(--s-weak)}

.check-slab .breach .btn.done,.check-slab .breach .btn.done:disabled{opacity:1;cursor:default;background:var(--slab);font-weight:600}
.check-slab .breach .btn.done{color:var(--ink);border-color:var(--line-strong)}
.check-slab .breach .btn.done.good{color:var(--s-vstrong);border-color:var(--s-vstrong)}
.check-slab .breach .btn.done.bad{color:var(--s-weak);border-color:var(--s-weak)}
.breach-status .how{color:var(--brand-ink);white-space:nowrap}

.check-slab .breach .enter-key{display:none;margin-inline-start:4px;min-width:22px;height:20px;padding:0 5px;align-items:center;justify-content:center;border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:5px;font:600 13px/1 var(--ui);color:var(--muted);background:var(--slab)}
@media (hover:hover) and (pointer:fine){ .check-slab .breach .enter-key{display:inline-flex;visibility:hidden} .check-slab .breach.typing .enter-key{visibility:visible} }   
#qr-dialog .qr-box:has(canvas[hidden]){display:none}
.qr-cap.qr-problem{color:var(--ink);font-size:15px;text-align:start;background:var(--sunk);border-radius:10px;padding:12px 14px;margin:0 0 16px}

.recipe.th-row{gap:6px;margin-bottom:8px}
.recipe.th-row>li{flex:none}
.recipe.th-row .chip{padding-inline:18px 9px;justify-content:center}
.recipe.th-row .chip.chip-more{padding-inline:8px 6px;gap:4px}
.recipe.th-row .th[aria-pressed="false"]{background:transparent;border-color:var(--line-strong);color:var(--ink-2)}
.recipe.th-row .th[aria-pressed="true"]{background:var(--slab);border-color:var(--line-strong);color:var(--brand-ink)}
.recipe.th-row .chip.chip-more:not(.on){background:transparent;border-color:var(--line-strong)}
.recipe.th-row .chip.chip-more.on{background:var(--slab);border-color:var(--line-strong);color:var(--brand-ink)}
.recipe.th-row .th-l{position:relative}
.recipe.th-row .th-l::before{content:"✓";position:absolute;inset-inline-end:100%;top:50%;transform:translateY(-50%);margin-inline-end:6px;font-family:var(--ui);color:transparent}
.recipe.th-row .th[aria-pressed="true"] .th-l::before{color:var(--brand-ink)}
.recipe.th-row .split{flex:none}
@media (hover:hover) and (pointer:fine){
  .recipe.th-row .chip:hover,.recipe.th-row .th[aria-pressed="false"]:hover{border-color:var(--brand-line);color:var(--brand-ink);background:var(--slab)}
}
@media (max-width:999px){
  .recipe.th-row{display:flex;flex-wrap:wrap;gap:6px}
  .recipe.th-row>li{grid-column:auto}
  .recipe.th-row .chip{padding-inline:22px 11px;font-size:15px}
  .recipe.th-row .chip.chip-more{min-width:44px;padding-inline:8px 6px}
}

.recipe.un-row .r-word{min-width:0}
.un-word{display:flex;align-items:center;gap:6px;flex:1;min-width:0;height:42px;padding-inline:12px 4px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--slab);color:var(--muted);transition:border-color .15s}
.un-word:focus-within{border-color:var(--brand-fill);box-shadow:0 0 0 1px var(--brand-fill)}
.un-word .ico{width:16px;height:16px;flex:none}
.un-word input{flex:1;min-width:0;width:100%;height:100%;border:0;background:none;color:var(--ink);font:inherit;font-size:16px;outline:none;padding:0}
.un-word input::placeholder{color:var(--muted);opacity:1}
.un-word-x{flex:none;width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:8px;background:none;color:var(--muted)}
.un-word-x[hidden]{display:none}
.un-word-x:hover{color:var(--ink);background:var(--sunk)}
@media (hover:hover) and (pointer:fine){ .un-word:hover{border-color:var(--brand-line)} }
@media (min-width:1000px){
  .recipe.un-row:not(.compact)>li.r-word{flex:1 1 200px}
}
@media (max-width:999px){
  .recipe.pp-row.un-row:not(.pin-row)>li.r-lang{grid-column:span 8}
  .recipe.pp-row.un-row:not(.pin-row)>li.r-sep{grid-column:span 9}
  .recipe.pp-row.un-row:not(.pin-row)>li.r-opt{grid-column:span 7}
  .recipe.pp-row.un-row:not(.pin-row)>li.r-max{grid-column:span 10}
  .recipe.pp-row.un-row:not(.pin-row)>li.r-word{grid-column:span 14}
}
@media (max-width:599px){
  .recipe.pp-row.un-row:not(.pin-row)>li.r-lang{grid-column:span 7}
  .recipe.pp-row.un-row:not(.pin-row)>li.r-sep{grid-column:span 10}
}
@media (max-width:359px){
  .recipe.pp-row.un-row:not(.pin-row)>li.r-lang,.recipe.pp-row.un-row:not(.pin-row)>li.r-opt{grid-column:span 8}
  .recipe.pp-row.un-row:not(.pin-row)>li.r-sep,.recipe.pp-row.un-row:not(.pin-row)>li.r-max{grid-column:span 16}
  .recipe.pp-row.un-row:not(.pin-row)>li.r-word{grid-column:span 24}
}

.names>li{display:flex;align-items:center;min-width:0}
.names .name{flex:1;min-width:0}
.names .star{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:10px;background:none;color:var(--muted);margin-inline-end:4px}
.names .star .ico{width:20px;height:20px}
.names .star:hover{background:var(--sunk);color:var(--ink)}
.names .star[aria-pressed="true"]{color:var(--brand-ink)}

.names:not(:has(li)){min-height:234px}
@media (max-width:860px){.names:not(:has(li)){min-height:454px}}

.names:not(:has(li)):not([data-ready])::before{content:"";grid-column:1/-1;align-self:stretch;margin:6px 10px;
  background:repeating-linear-gradient(180deg,transparent 0 22px,var(--line-strong) 22px 34px,transparent 34px 58px);
  -webkit-mask:repeating-linear-gradient(90deg,#000 0 13%,transparent 13% 33.333%);mask:repeating-linear-gradient(90deg,#000 0 13%,transparent 13% 33.333%);
  border-radius:6px;opacity:0;animation:un-sk-in .25s .3s forwards,un-sk-pulse 1.1s .55s ease-in-out infinite alternate}
@media (max-width:860px){.names:not(:has(li)):not([data-ready])::before{background:repeating-linear-gradient(180deg,transparent 0 21px,var(--line-strong) 21px 33px,transparent 33px 56px);-webkit-mask:linear-gradient(90deg,#000 0 42%,transparent 42%);mask:linear-gradient(90deg,#000 0 42%,transparent 42%)}}
@keyframes un-sk-in{to{opacity:.9}}
@keyframes un-sk-pulse{from{opacity:.9}to{opacity:.4}}
@media (prefers-reduced-motion:reduce){.names:not(:has(li)):not([data-ready])::before{animation:un-sk-in .25s .3s forwards}}

@media (max-width:860px){ html.pg-bip main .after .install-link[hidden]{display:inline-flex;visibility:hidden} }
#un-count:empty::before{content:"\00a0"}   
.un-foot{flex-wrap:wrap;gap:8px 12px}
.un-info{flex:1 1 260px;min-width:0}
#un-count{color:var(--ink-2)}
#un-count.un-none{color:var(--s-weak)}
.un-foot .btn-quiet{flex:none}
.un-foot .btn-quiet .ico{width:18px;height:18px}
.un-foot .btn-quiet:disabled{opacity:.5;cursor:default}
#regen.spin .ico{animation:pg-turn .5s cubic-bezier(.25,.8,.25,1)}
@media (prefers-reduced-motion:reduce){#regen.spin .ico{animation:none}}
@media (max-width:860px){
  .un-foot{padding:10px 12px}
  .un-info{flex-basis:100%}
  .un-foot .foot-sp{display:none}
  .un-foot .btn-quiet{flex:1;justify-content:center}
}

.shortlist{margin-top:16px}
.sl-head{display:flex;align-items:center;gap:12px;padding:12px 16px 8px 24px;padding-inline:24px 16px}
.sl-h{display:flex;align-items:center;gap:8px;margin:0;font-size:17px;font-weight:400;color:var(--ink)}
.sl-h .ico{width:18px;height:18px;color:var(--brand-ink)}
.sl-n{color:var(--muted)}
.sl-list{list-style:none;margin:0;padding:0 8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 8px}
.sl-list li{display:flex;align-items:center;gap:2px;min-width:0;padding-inline:16px 4px;height:48px;border-radius:10px}
.sl-list li:hover{background:var(--sunk)}
.sl-t{flex:1;min-width:0;font-family:var(--mono);font-size:20px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;unicode-bidi:isolate}
.sl-note{margin:6px 0 0;padding:0 24px 14px;font-size:14px;color:var(--muted)}
@media (max-width:860px){
  .sl-head{padding-inline:16px 10px}
  .sl-list{grid-template-columns:1fr;padding:0 4px}
  .sl-list li{padding-inline:12px 2px}
  .sl-t{font-size:18px}
  .sl-note{padding-inline:16px}
}

.pop h3.h-gap{margin-top:16px}
.pf-choice button{height:38px}
#pop-max,#pop-rw{width:320px}
@media (max-width:860px){ #pop-max,#pop-rw{width:auto} }

.range{-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer}
.range::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:linear-gradient(var(--brand-fill),var(--brand-fill)) 0/var(--fill,0%) 100% no-repeat,var(--line-strong)}
.range::-moz-range-track{height:6px;border-radius:3px;background:var(--line-strong)}
.range::-moz-range-progress{height:6px;border-radius:3px;background:var(--brand-fill)}
.range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;background:var(--brand-fill);border:3px solid var(--slab);box-shadow:0 0 0 1px var(--brand-fill)}
.range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--brand-fill);border:3px solid var(--slab);box-shadow:0 0 0 1px var(--brand-fill)}
.range:focus-visible{outline:none}
.range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--slab),0 0 0 4px var(--brand-ink)}

.recipe.th-row{display:flex;flex-wrap:wrap;gap:6px}
.recipe.th-row>li{flex:0 0 auto;min-width:0}
.recipe.th-row .chip.th{justify-content:center;gap:7px;padding-inline:14px}
.recipe.th-row .th-ic,.recipe.th-row .th-tk{width:17px;height:17px;flex:none}
.recipe.th-row .th-l::before{content:none}
.recipe.th-row .th .th-tk{display:none}
.recipe.th-row .th[aria-pressed="true"] .th-tk{display:block;color:var(--brand-ink)}
.recipe.th-row .th[aria-pressed="true"] .th-ic{display:none}
.names .name-t{font-family:var(--ui);font-size:22px;letter-spacing:0;font-weight:600}
.names .name{padding-inline:16px 6px;justify-content:flex-start}
.names .name-t{flex:1 1 auto;min-width:0}
.names .star{margin-inline-end:6px}
.un-info{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
#un-count{white-space:nowrap}
.names .nm-w1{color:var(--brand-ink)}
@media (min-width:861px){
  .names{grid-template-columns:repeat(3,minmax(0,1fr))}
  .names.cols2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .names .name{height:54px;padding-inline:14px 2px;gap:8px}
  .names .name-t{font-size:20px}
  .names .name-l{display:none}
  .names .star{width:40px;height:40px;margin-inline-end:4px}
}
.names .nm-sep,.names .nm-n{color:var(--muted)}
.names .name.ok .nm-w1{color:inherit}
@media (max-width:860px){
  .recipe.th-row .chip.th{padding-inline:12px}
  .names .name-t{font-size:20px}
}

@media (min-width:1000px){
  .band-in:not(.bulk-in):has(.phr-row){padding-inline:var(--gutter)}
  .recipe.pp-row.phr-row.compact{grid-template-columns:repeat(24,minmax(0,1fr))}
}
@media (min-width:1000px){
  .recipe.pp-row.phr-row.compact{grid-template-columns:repeat(24,minmax(0,1fr))}
  .recipe.pp-row.phr-row.compact>li.r-words{grid-column:span 8}
  .recipe.pp-row.phr-row.compact>li.r-sep{grid-column:span 8}
  .recipe.pp-row.phr-row.compact>li.r-max{grid-column:span 8}
  .recipe.pp-row.phr-row.compact>li.r-opt{grid-column:span 4}
  .recipe.pp-row.phr-row.compact>li.r-wl{grid-column:span 10}
  .recipe.pp-row.phr-row.compact>li.r-xinfo{grid-column:span 2}
}

@media (max-width:999px){
  .recipe.pp-row.phr-row>li.r-opt{grid-column:span 7}
  .recipe.pp-row.phr-row>li.r-xinfo{grid-column:span 3}
  .recipe.pp-row.phr-row>li.r-max{grid-column:span 9}
  .recipe.pp-row.phr-row>li.r-wl{grid-column:span 15}
  .recipe.pp-row.phr-row .opt-tog{padding-inline:20px}
}
@media (max-width:374px){
  .recipe.pp-row.phr-row>li.r-max,.recipe.pp-row.phr-row>li.r-wl{grid-column:span 24}
}
@media (max-width:999px){ .recipe.pp-row.phr-row.max-own>li.r-max,.recipe.pp-row.phr-row.max-own>li.r-wl,.recipe.pp-row.phr-row.sep-own>li.r-words,.recipe.pp-row.phr-row.sep-own>li.r-sep{grid-column:span 24} }

#result{--pp-sym:#b91c1c;--pp-sel:#dadef3;--pp-sym-sel:#b91c1c;--pp-dig:#b91c1c;--pp-dig-sel:#b91c1c;--pp-warn:#c62828;--pp-alt:var(--brand-ink)}
:root[data-theme="dark"] #result{--pp-dig:#ff9e9e;--pp-dig-sel:#ff9e9e;--pp-sym:#ff9e9e;--pp-sel:#2f3b80;--pp-sym-sel:#ff9e9e;--pp-warn:#ff7b74;--pp-alt:var(--brand-ink)}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) #result{--pp-dig:#ff9e9e;--pp-dig-sel:#ff9e9e;--pp-sym:#ff9e9e;--pp-sel:#2f3b80;--pp-sym-sel:#ff9e9e;--pp-warn:#ff7b74;--pp-alt:var(--brand-ink)} }

#result{--pw-dig:#3F51B5;--pw-sym:#317000;--pw-sym-sel:#317000}
:root[data-theme="dark"] #result{--pw-dig:#82b1ff;--pw-sym:#81c784;--pw-sym-sel:#81c784}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) #result{--pw-dig:#82b1ff;--pw-sym:#81c784;--pw-sym-sel:#81c784} }
#out .pw-in.all-sel{background:var(--pp-sel)}
#out .pw-d{color:var(--pw-dig)}
#out .pw-s{color:var(--pw-sym)}
#out .out-text .pw-d::selection{color:var(--pw-dig)}
#out .out-text .pw-s::selection{color:var(--pw-sym-sel)}
#out .out-text .pw-d::-moz-selection{color:var(--pw-dig)}
#out .out-text .pw-s::-moz-selection{color:var(--pw-sym-sel)}
#out .pc-d{color:var(--pp-dig)}
#out .pc-s,#out .pc-p{color:var(--pp-sym)}
#out .pw-alt{color:var(--pp-alt)}
#out.phrase #phrase{overflow-wrap:anywhere}
#out .pp-nb{white-space:nowrap}

#out .out-text::selection,#out .out-text *::selection{background:var(--pp-sel);color:var(--ink)}
#out .pc-d::selection{color:var(--pp-dig-sel)}
#out .pc-s::selection,#out .pc-p::selection{color:var(--pp-sym-sel)}
#out .pw-alt::selection{color:var(--pp-alt)}
#out .out-text::-moz-selection,#out .out-text *::-moz-selection{background:var(--pp-sel);color:var(--ink)}
#out .pc-d::-moz-selection{color:var(--pp-dig-sel)}
#out .pc-s::-moz-selection,#out .pc-p::-moz-selection{color:var(--pp-sym-sel)}
#out .pw-alt::-moz-selection{color:var(--pp-alt)}
#phrase .pw-w[data-i]{cursor:pointer;border-radius:4px;outline-offset:1px}
#phrase .pw-w[data-i]:focus-visible{outline:2px solid var(--brand-ink)}

@media (hover:hover) and (pointer:fine){ #phrase .pw-w[data-i]:hover{text-decoration:underline 2px var(--brand-fill);text-underline-offset:5px;text-decoration-skip-ink:none} }
#out.none{align-items:center}
#out.none .pp-none{font-family:var(--ui);font-size:18px;line-height:1.4;color:var(--pp-warn);white-space:normal}
#strength.none .meter{visibility:hidden}
.pp-list .out-text.pp-line{white-space:normal;word-break:normal;overflow-wrap:anywhere;font-size:22px;line-height:1.3;padding-block:6px}
@media (max-width:860px){ .pp-list .out-text.pp-line{font-size:19px} }

#strength:has(.pp-note){flex-wrap:wrap;row-gap:4px;align-content:start}
.slab-foot:has(.pin-foot){align-items:flex-start;flex-wrap:nowrap}
.slab-foot:has(.pin-foot)>.ico{display:none}   
.pin-foot{display:flex;flex-direction:column;gap:2px;min-width:0}
.slab-foot:has(.pin-foot){min-height:77px}   
@media (min-width:861px){ .slab-foot:has(.pin-foot){min-height:81px} }
@media (max-width:439px){ .slab-foot:has(.pin-foot){min-height:92px} .slab:has(.pin-foot)~.after{min-height:84px} }   
@media (max-width:499px){
  #strength:not(:has(.pp-note)) .ttc{flex-basis:100%;text-align:start}   
  #strength:not(:has(.pp-note)) .foot-sp{display:none}   
  .slab-foot#strength:not(:has(.pp-note)):has(.verdict){min-height:75px}
  
  #strength:has(.pp-note) .ttc{flex-basis:100%;text-align:start;min-height:23px}   
  #strength:has(.pp-note) .foot-sp{display:none}
}
#pin-odds{font-size:14px;line-height:1.5}
.pp-note{flex:1 0 100%;min-height:21px;font-size:14px;line-height:1.5;color:var(--muted)}
.pp-chars{color:var(--ink-2);font-variant-numeric:tabular-nums}
.pp-chars:not(:empty)+.pp-msg:not(:empty)::before{content:" · "}
.pp-note.short .pp-chars,.pp-note.short .pp-msg{color:var(--pp-warn)}
@media (max-width:860px){ .pp-note{min-height:42px} }

.slab-foot#strength:has(.pp-note):has(.verdict){min-height:78px}
@media (max-width:860px){ .slab-foot#strength:has(.pp-note):has(.verdict){min-height:107px} }
@media (max-width:499px){ .slab-foot#strength:has(.pp-note):has(.verdict){min-height:120px} }   
#strength:has(.pp-note) .verdict{min-height:24px}
#copy:disabled,#qr:disabled{opacity:.5;cursor:default}

.after .am-stack{justify-items:start}
.after .am-cur{display:inline-flex;align-items:center;gap:8px}
.after .am-stack>.sizer{padding-inline-end:20px}

.recipe.pp-row>li.r-xinfo{flex:none!important;display:flex}
.recipe.pp-row>li.r-xinfo .chip.chip-info{width:44px;min-width:44px;justify-content:center;padding:0;margin-inline-start:0;border-radius:var(--r);background:transparent;border-color:var(--line-strong);color:var(--muted)}
@media (max-width:999px){ .recipe.pp-row>li.r-xinfo{justify-content:flex-end} .recipe.pp-row>li.r-xinfo .chip.chip-info{width:100%;min-width:40px} }
#pop-extras{max-width:min(360px,calc(100vw - 24px))}
@media (max-width:374px){ .recipe.pp-row>li.r-xinfo .chip.chip-info{min-width:0} }

@media (min-width:861px) and (max-width:947px){[data-lang="ar"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to left,#000 92%,transparent);mask-image:linear-gradient(to left,#000 92%,transparent)}[data-lang="ar"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:934px){[data-lang="bg"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="bg"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:896px){[data-lang="bn"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="bn"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:945px){[data-lang="ca"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="ca"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:904px){[data-lang="cs"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="cs"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:972px){[data-lang="cy"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="cy"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:926px){[data-lang="da"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="da"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:995px){[data-lang="de"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="de"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:983px){[data-lang="el"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="el"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:974px){[data-lang="es"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="es"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:944px){[data-lang="et"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="et"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:925px){[data-lang="eu"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="eu"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:918px){[data-lang="fa"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to left,#000 92%,transparent);mask-image:linear-gradient(to left,#000 92%,transparent)}[data-lang="fa"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:908px){[data-lang="fi"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="fi"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:917px){[data-lang="fr"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="fr"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:958px){[data-lang="ga"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="ga"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:981px){[data-lang="gd"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="gd"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:921px){[data-lang="he"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to left,#000 92%,transparent);mask-image:linear-gradient(to left,#000 92%,transparent)}[data-lang="he"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:878px){[data-lang="hi"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="hi"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:929px){[data-lang="hr"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="hr"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:916px){[data-lang="hu"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="hu"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:921px){[data-lang="id"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="id"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:906px){[data-lang="it"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="it"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:949px){[data-lang="ja"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="ja"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:944px){[data-lang="ko"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="ko"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:973px){[data-lang="lt"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="lt"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:965px){[data-lang="lv"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="lv"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:922px){[data-lang="ms"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="ms"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:988px){[data-lang="nl"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="nl"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:963px){[data-lang="no"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="no"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:929px){[data-lang="pl"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="pl"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:906px){[data-lang="pt"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="pt"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:865px){[data-lang="ro"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="ro"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:932px){[data-lang="ru"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="ru"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:887px){[data-lang="sk"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="sk"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:951px){[data-lang="sl"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="sl"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:983px){[data-lang="sv"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="sv"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:905px){[data-lang="th"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="th"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:868px){[data-lang="tr"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="tr"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:918px){[data-lang="uk"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="uk"] .tools::-webkit-scrollbar{display:none}}
@media (min-width:861px) and (max-width:954px){[data-lang="vi"] .tools{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);mask-image:linear-gradient(to right,#000 92%,transparent)}[data-lang="vi"] .tools::-webkit-scrollbar{display:none}}

#pop-fb .fb-ts:empty{display:none}
#pop-fb .fb-ts{margin:4px 0 10px}

.guide section[id][tabindex="-1"]:focus{outline:none}

.lang-grid{grid-auto-flow:column;grid-template-rows:repeat(15,auto);max-height:none}
.lang-grid.lang-suggest{grid-auto-flow:row;grid-template-rows:none;padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid var(--line)}
.lang-pop{max-height:calc(100dvh - 90px);overflow:auto}
@media (max-width:860px){ .lang-grid{grid-template-rows:repeat(22,auto)} .lang-grid.lang-suggest{grid-template-rows:none} .lang-pop{max-height:none} }

.recipe.pw-row .look-tog[aria-pressed="true"] .sim-ch{text-decoration:none;color:var(--brand-ink)}
.recipe.pw-row .look-tog[aria-pressed="false"] .sim-ch{text-decoration:line-through;text-decoration-thickness:2px;color:var(--muted)}
.recipe.pw-row .look-tog .sim-ch{position:relative}
@media (max-width:999px){ .recipe.pw-row .look-tog .sim-ch{inset-inline-start:7px} }

@media (min-width:1000px){ .recipe.pw-row .look-tog .sim-ch{inset-inline-start:8px} }
.recipe.pw-row .look-tog .sim-ch::before{content:"\2713";position:absolute;top:50%;transform:translateY(-50%);inset-inline-end:100%;margin-inline-end:6px;font-family:var(--ui);font-weight:400;letter-spacing:0;text-decoration:none;color:transparent}
.recipe.pw-row .look-tog[aria-pressed="true"] .sim-ch::before{color:var(--brand-ink)}

@media (min-width:1000px){.recipe.pp-row[data-fit]:not(.compact)>li.r-wl{max-width:300px}}   

@media (min-width:1121px){html .tools>a:first-child{padding-inline-start:13px}}
@media (min-width:1000px) and (max-width:1120px){:root{--rail:151px}}   

.recipe.snug{column-gap:4px}.recipe.snug>li.gap{width:2px}

@media (min-width:1121px){html[data-sug] .tools a .ico{display:none}}

@media (min-width:861px){.tools[data-fade="s"],.tools[data-fade=""]{-webkit-mask-image:none;mask-image:none}}

.r-word{flex-wrap:wrap}
.un-word-hint{flex-basis:100%;margin:4px 2px 0;font-size:13.5px;color:var(--ink-2)}.guide ul.presets{padding-inline-start:0}
.guide .presets li{margin:0}
.presets a{flex-direction:column;align-items:flex-start;gap:3px}
.presets .p-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.presets .p-why{color:var(--muted);font-size:15px}
.presets .p-spec{font-size:14px;white-space:normal}
.guide ul,.guide ol{padding-inline-start:1.2em;margin:0 0 14px}
.guide li{margin:0 0 8px}
.guide li strong,.guide p strong{color:var(--ink);font-weight:400}
.guide code{font-family:var(--mono);font-size:.92em;background:var(--sunk);border:1px solid var(--line);border-radius:5px;padding:1px 5px}

.guide .nw{white-space:nowrap}
.guide pre{margin:10px 0 4px;padding:12px 14px;background:var(--sunk);border:1px solid var(--line);border-radius:var(--r);overflow-x:auto;font-size:14px;line-height:1.55}
.guide pre code{background:none;border:0;padding:0;font-size:inherit;white-space:pre}
.j-sample[data-kind="phrase"] .j-line{overflow-wrap:normal;word-break:normal}

.install .install-prompt,.install .install-ios,.install .install-installed{display:none}
.install{margin-top:6px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--sunk)}
.install p:last-child{margin-bottom:0}

.tbl td:nth-child(-n+3),.tbl th:nth-child(-n+3){white-space:nowrap}
.tbl.tint td:nth-child(n+2),.tbl.tint th:nth-child(n+2){white-space:normal}   
.guide .scroll-x+p{margin-top:16px}

.tbl.tint .lv i{display:none}
.tbl.tint td:has(.lv){border-bottom:2px solid var(--bg)}
.tbl.tint td:has(.lv-1){background:#fde7e7}.tbl.tint td:has(.lv-2){background:#fdf0d7}
.tbl.tint td:has(.lv-3){background:#edf5d6}.tbl.tint td:has(.lv-4){background:#d7eed9}
.tbl.tint .lv span{color:var(--ink)}
.lv-key{display:flex;flex-wrap:wrap;gap:6px 16px;margin:4px 0 10px;font-size:14px;color:var(--ink-2)}
.lv-key .k{display:inline-flex;align-items:center;gap:7px}
.lv-key .k::before{content:"";width:14px;height:14px;border-radius:4px}
.k-1::before{background:#fde7e7;box-shadow:inset 0 0 0 1px #f3b9b9}.k-2::before{background:#fdf0d7;box-shadow:inset 0 0 0 1px #ecd09a}
.k-3::before{background:#edf5d6;box-shadow:inset 0 0 0 1px #c5dd98}.k-4::before{background:#d7eed9;box-shadow:inset 0 0 0 1px #9fd0a4}
:root[data-theme="dark"] .tbl.tint td:has(.lv-1),:root[data-theme="dark"] .k-1::before{background:#4a2426;box-shadow:none}
:root[data-theme="dark"] .tbl.tint td:has(.lv-2),:root[data-theme="dark"] .k-2::before{background:#4a3a1c;box-shadow:none}
:root[data-theme="dark"] .tbl.tint td:has(.lv-3),:root[data-theme="dark"] .k-3::before{background:#35411f;box-shadow:none}
:root[data-theme="dark"] .tbl.tint td:has(.lv-4),:root[data-theme="dark"] .k-4::before{background:#1f3d24;box-shadow:none}

.install[data-mode="prompt"] .install-default{display:none}
.install[data-mode="prompt"] .install-prompt{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.install-prompt p{margin:0;color:var(--ink-2)}

.install[data-mode="ios"] .install-default,.install[data-mode="installed"] .install-default{display:none}
.install[data-mode="ios"] .install-ios,.install[data-mode="installed"] .install-installed{display:block}
.install-button{height:46px;padding:0 20px;border:0;border-radius:var(--r);background:var(--brand-fill);color:var(--on-brand);font-size:17px;cursor:pointer}
.install-button:hover{filter:brightness(1.08)}

.guide p.jump{font-size:15px;color:var(--muted);margin-top:4px}
.guide p.jump a{white-space:nowrap}

.guide details.tech{border:1px solid var(--line);border-radius:var(--r);background:var(--sunk);margin-top:8px}
.guide details.tech>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;cursor:pointer;color:var(--brand-ink)}
.guide details.tech>summary::-webkit-details-marker{display:none}
.guide details.tech>summary .ico{width:18px;height:18px;transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.guide details.tech[open]>summary .ico{transform:rotate(180deg)}
.guide details.tech>ul{margin:0;padding:0 18px 16px 38px}

.guide ul.presets.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.presets.cards li{border:0}
.presets .p-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:14px;padding:16px 16px 16px 14px;border:1px solid var(--line);border-radius:12px;background:var(--slab);color:var(--ink);text-decoration:none;transition:border-color .15s,background-color .15s,box-shadow .15s}
.presets .p-card:hover{border-color:var(--brand-line);background:var(--brand-soft);box-shadow:0 2px 10px rgb(23 27 60 / .08)}
.presets .p-card:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px}
.presets .p-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--brand-soft);color:var(--brand-ink)}
.presets .p-ic .ico{width:21px;height:21px}
.presets .p-name{font-size:17px;color:var(--ink)}
.presets .p-card:hover .p-name{color:var(--brand-ink)}
.presets .p-why{display:block;margin-top:2px;color:var(--muted);font-size:15px;line-height:1.45}
.presets .p-spec{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:9px;padding:0}
.presets .p-size{font-size:14px;color:var(--ink-2);margin-right:2px}
.presets .p-types{font-size:13px;line-height:1;padding:5px 8px;border-radius:6px;border:1px solid var(--brand-line);color:var(--brand-ink);background:var(--slab);white-space:nowrap;letter-spacing:.02em}
.presets .p-flag{flex-basis:100%;font-size:13px;color:var(--muted);margin-top:-1px}
.presets .p-go{align-self:center;color:var(--muted);transition:transform .15s,color .15s}
.presets .p-go .ico{width:18px;height:18px}
.presets .p-card:hover .p-go{color:var(--brand-ink);transform:translateX(3px)}
@media (max-width:700px){.guide ul.presets.cards{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.presets .p-card:hover .p-go{transform:none}}

.guide ul.presets.cards{align-items:stretch}
.presets.cards li{display:flex}
.presets .p-card{flex:1;align-items:stretch}
.presets .p-main{display:flex;flex-direction:column}
.presets .p-spec{margin-top:auto;padding-top:9px}
.presets .p-ic,.presets .p-go{align-self:start}
.presets .p-go{align-self:center}
.guide ul.tool-list{list-style:none;padding:0;margin:4px 0 18px;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.guide ul.tool-list li{margin:0;display:flex}
.guide ul.tool-list a{flex:1;display:grid;grid-template-columns:24px 1fr;column-gap:12px;row-gap:2px;align-items:start;padding:12px 14px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink-2);background:var(--slab);transition:border-color .15s,background-color .15s}
.guide ul.tool-list a:hover{border-color:var(--brand-line);background:var(--brand-soft)}
.guide ul.tool-list a:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px}
.guide ul.tool-list .ico{width:22px;height:22px;grid-row:span 2;color:var(--brand-ink);margin-top:2px}
.guide ul.tool-list .t-name{color:var(--ink);font-size:17px}
.guide ul.tool-list a:hover .t-name{color:var(--brand-ink)}
.guide ul.tool-list .t-why{font-size:15px;line-height:1.45;color:var(--muted)}
.p-tool{font-size:13px;line-height:1;padding:5px 8px;border-radius:6px;color:var(--brand-ink);background:var(--brand-soft);white-space:nowrap}
.jobs-wrap{--j-font:16px;--ch:calc(var(--j-font) * .5);--j-col:calc(var(--ch) * 34);--j-sym:#317000;--j-pp-d:#b91c1c;--j-pp-s:#b91c1c;margin:14px 0 18px}
:root[data-theme="dark"] .jobs-wrap{--j-sym:#81c784;--j-pp-d:#ff9e9e;--j-pp-s:#ff9e9e}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .jobs-wrap{--j-sym:#81c784;--j-pp-d:#ff9e9e;--j-pp-s:#ff9e9e}}
.j-axis{display:grid;grid-template-columns:minmax(0,1fr) var(--j-col);column-gap:28px;align-items:end;padding:0 2px 8px;border-bottom:1px solid var(--line-strong)}
.j-key{font-size:13px;color:var(--muted)}
.j-key b{font-weight:400;font-family:var(--mono);font-size:15px}
.j-key b.d{color:var(--brand-ink)}
.j-key b.s{color:var(--j-sym)}
.j-axis-in{grid-column:2;position:relative;height:1.1em;font-family:var(--mono);font-size:var(--j-font);color:var(--muted)}
.j-axis-in i{position:absolute;left:calc(var(--n) * var(--ch));transform:translateX(-50%);font-style:normal;font-size:12px;line-height:1}
.j-axis-in i::after{content:"";position:absolute;left:50%;top:calc(100% + 3px);width:1px;height:5px;background:var(--line-strong)}
.guide ul.jobs{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.guide ul.jobs li{margin:0;border-bottom:1px solid var(--line)}
.job{display:grid;grid-template-columns:minmax(0,1fr) var(--j-col);column-gap:28px;align-items:start;padding:16px 2px 15px;color:inherit;text-decoration:none}
.job:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px}
.j-text{position:relative;display:block;padding-inline-start:44px}
.j-name{display:block;color:var(--ink);font-size:17px}
.j-name .ico{position:absolute;inset-inline-start:0;top:-1px;width:30px;height:30px;color:var(--brand-ink);stroke-width:1.5}
.job:hover .j-name,.job:focus-visible .j-name{color:var(--brand-ink)}
.j-why{display:block;color:var(--ink-2);font-size:15px;line-height:1.5;margin:4px 0 0}
.j-detail{display:block;color:var(--muted);font-size:14px;margin:5px 0 0}
.j-tool{color:var(--brand-ink)}
.j-tool::after{content:" \2192"}
.j-sample{position:relative;align-self:stretch;font-family:var(--mono);font-size:var(--j-font);line-height:1.5;color:var(--ink);direction:ltr;unicode-bidi:isolate;padding-top:2px;}
.j-line{display:block;overflow-wrap:anywhere;width:max-content;max-width:100%;padding-bottom:5px;background:linear-gradient(var(--brand-line),var(--brand-line)) 0 100%/100% 3px no-repeat;border-radius:0}
.j-line+.j-line{margin-top:4px}
.j-sample{background:linear-gradient(var(--line),var(--line)) 0 calc(1.5em + 4px)/calc(var(--ch) * 32) 3px no-repeat}
.j-sample[data-kind="bulk"],.j-sample[data-kind="check"],.j-sample[data-kind="phrase"]{background:none}
.j-line b{font-weight:400}
.j-line b.d{color:var(--brand-ink)}
.j-line b.s{color:var(--j-sym)}
.j-sample[data-kind="phrase"] .j-line b.d{color:var(--j-pp-d)}
.j-sample[data-kind="phrase"] .j-line b.s{color:var(--j-pp-s)}
.j-bad{background:none;padding-bottom:0;text-decoration:line-through;text-decoration-color:var(--s-weak);text-decoration-thickness:2px;color:var(--muted)}
.j-note{display:block;font-family:var(--ui);font-size:13px;color:var(--muted);margin-top:2px}
@media (max-width:700px){.j-axis,.job{grid-template-columns:minmax(0,1fr)}.j-axis-in{grid-column:1}.job{row-gap:10px}.j-sample{min-height:1.5em}}

.guide .scroll-x .tbl.fit{min-width:0}
.guide .tbl.fit th,.guide .tbl.fit td{white-space:normal}
.guide .keypads{display:flex;flex-wrap:wrap;gap:16px 48px;margin:20px 0 14px}
.keypads figure{margin:0;text-align:center}
.kp{display:block;width:120px;height:auto;margin:0 auto 10px;overflow:visible}
@media (max-width:520px){.guide .keypads{gap:12px;justify-content:space-between;flex-wrap:nowrap}.kp{width:min(96px,26vw)}.keypads figcaption{font-size:14px}.keypads figcaption b{display:block;font-size:16px;margin:0}}
.kp .k{fill:none;stroke:var(--line-strong);stroke-width:1.5}
.kp .k.on{fill:var(--brand-ink);stroke:none}
.kp text{font:500 15px var(--ui);fill:var(--muted);text-anchor:middle;dominant-baseline:central}
.kp text.on{fill:var(--slab);font-weight:600}
.kp .trail{fill:none;stroke:var(--brand-ink);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.kp .ring{fill:none;stroke:var(--brand-ink);stroke-width:2}
.kp .r2{opacity:.5}.kp .r3{opacity:.22}
.keypads figcaption{font-size:15px;color:var(--ink-2)}
.keypads figcaption b{font-family:var(--mono);font-weight:400;font-size:17px;color:var(--ink);margin-inline-end:4px}
.guide ol.ladder{list-style:none;margin:18px 0 14px;padding:0}
.guide ol.ladder li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 22px;margin:0 0 14px}
.ld-ph{font-family:var(--mono);font-size:17px;color:var(--ink-2);overflow-wrap:anywhere}
.ld-ph b{font-weight:400;color:var(--brand-ink)}
.ld-t{font-weight:600;color:var(--ink);white-space:nowrap;display:inline-flex;align-items:center;gap:8px}
.ld-t::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--s-weak)}
.lv-2 .ld-t::before{background:var(--s-fair)}.lv-3 .ld-t::before{background:var(--s-strong)}.lv-4 .ld-t::before{background:var(--s-vstrong)}
.ld-for{flex:1 0 100%;font-size:14px;color:var(--muted)}
.ladder.short .ld-ph{font-size:20px}
@media (max-width:520px){.guide ol.ladder.short li{gap:2px 16px}.ladder.short .ld-ph{flex:0 0 auto;font-size:17px}}
@media (max-width:520px){.guide ol.ladder li{gap:2px 10px}.ld-ph{flex:1 0 100%;font-size:14px}.ld-t{font-size:15px}.ld-for{flex:1 1 auto;font-size:13px}}
.guide ul.verdicts{list-style:none;margin:18px 0 16px;padding:0;display:grid;grid-template-columns:max-content max-content minmax(0,1fr);gap:12px 18px;align-items:baseline}
.guide ul.verdicts li{display:contents}
.guide .verdicts code{font-family:var(--mono);font-size:17px;background:none;border:0;padding:0;color:var(--ink)}
.vd{display:inline-flex;align-items:center;gap:7px;font-weight:600;color:var(--ink);white-space:nowrap}
.vd::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--s-weak)}
.vd.lv-4::before{background:var(--s-vstrong)}
.vd-why{font-size:15px;color:var(--ink-2)}
@media (max-width:640px){.guide ul.verdicts{display:block}.guide ul.verdicts li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;margin:0 0 14px}.vd-why{flex:1 0 100%;font-size:14px}}
.guide ol.hashflow{list-style:none;margin:18px 0 16px;padding:0;counter-reset:hf}
.guide ol.hashflow li{position:relative;margin:0;padding:0 0 18px 40px;counter-increment:hf}
.hashflow li::before{content:counter(hf);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:600;color:var(--brand-ink);box-shadow:inset 0 0 0 1.5px var(--brand-ink)}
.hashflow li:not(:last-child)::after{content:"";position:absolute;left:11.5px;top:28px;bottom:4px;width:1.5px;background:var(--line-strong)}
.hf-k{display:block;color:var(--ink)}
.guide .hashflow code.hf-v{display:inline-block;margin:4px 10px 0 0;font-family:var(--mono);font-size:16px;background:none;border:0;padding:0;color:var(--muted);overflow-wrap:anywhere}
@media (max-width:520px){.guide .hashflow code.hf-v{font-size:13px}}
.hf-v b{font-weight:700;color:var(--brand-ink);text-decoration:underline 2px;text-underline-offset:4px}
.hf-n{display:inline-block;margin-top:4px;font-size:14px;color:var(--muted)}
.hashflow li:nth-child(3) .hf-n{color:var(--brand-ink);font-weight:600}
.guide p.last-sent{font-family:var(--mono);font-size:16px;color:var(--brand-ink)}
.guide .sign-wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:32px;align-items:start;margin:18px 0 6px}
.guide .sign-wrap ul{margin-top:0}
.sign-demo{margin:0}
.sd-paper{aspect-ratio:210 / 297;background:#fff;color:#000;border-radius:3px;box-shadow:0 1px 3px rgb(0 0 0 / .18),0 8px 24px rgb(0 0 0 / .08);padding:18px 16px;display:flex;flex-direction:column;align-items:center;text-align:center;font-family:var(--ui)}
.sd-head{font-size:21px;font-weight:700;line-height:1.1}
.sd-scan{font-size:14px;font-weight:700;margin:10px 0 6px}
.sd-qr{display:block;width:112px;height:112px}
.sd-lab{font-size:10px;color:#444;margin-top:9px}
.sd-val{font-size:13px;line-height:1.2}
.sd-mono{font-family:var(--mono);font-size:11.5px;white-space:nowrap}
.sd-tip{font-size:9.5px;color:#444;margin-top:auto;padding-top:8px}
.sign-demo figcaption{margin-top:10px;font-size:14px;color:var(--muted)}
@media (max-width:640px){.guide .sign-wrap{grid-template-columns:1fr;gap:18px}.sign-demo{max-width:240px}}
.guide p.anat{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px 1px;margin:16px 0;font-family:var(--mono);font-size:17px;color:var(--ink)}
.anat .an-part{display:inline-flex;flex-direction:column}
.anat .an-part.on>span{color:var(--brand-ink)}
.anat .an-part i{font-style:normal;font-family:var(--ui);font-size:13px;color:var(--muted);border-top:2px solid var(--brand-line);margin:3px 2px 0;padding-top:3px;text-align:center}
@media (max-width:520px){.guide p.anat{font-size:14px}}
.guide .flow2{display:grid;grid-template-columns:max-content 40px minmax(0,1fr);gap:0 14px;align-items:start;margin:20px 0 18px}
.f-cap{display:block;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.guide .flow2 pre{margin:0;padding:10px 14px;background:var(--sunk);border:1px solid var(--line);border-radius:6px;font-family:var(--mono);font-size:15px;line-height:1.6;color:var(--ink)}
.f-arrow{align-self:center;height:2px;background:var(--brand-ink);position:relative;margin-top:22px}
.f-arrow::after{content:"";position:absolute;right:-1px;top:-5px;border:6px solid transparent;border-left:9px solid var(--brand-ink);border-right:0}
.guide .tbl.mini{margin:0;font-size:14px}
.guide .tbl.mini th,.guide .tbl.mini td{padding:6px 10px;white-space:nowrap}
.guide .tbl.mini code{background:none;border:0;padding:0;font-size:15px;color:var(--ink)}
@media (max-width:760px){.guide .flow2{grid-template-columns:minmax(0,1fr);gap:0}.f-arrow{width:2px;height:28px;margin:10px 0 10px 24px;justify-self:start}.f-arrow::after{right:-5px;top:auto;bottom:-2px;border:6px solid transparent;border-top:9px solid var(--brand-ink);border-bottom:0}.f-out{overflow-x:auto}}
@media (max-width:460px){.guide .tbl.mini th:first-child,.guide .tbl.mini td:first-child{display:none}.guide .tbl.mini th,.guide .tbl.mini td{padding:6px 8px}}
.guide ul.styles{list-style:none;margin:16px 0;padding:0;display:grid;grid-template-columns:max-content minmax(0,1fr);gap:14px 24px;align-items:baseline}
.guide ul.styles li{display:contents}
.guide .styles code{grid-row:span 2;background:none;border:0;padding:0;font-family:var(--mono);font-size:17px;color:var(--ink)}
.st-name{font-weight:600;color:var(--ink)}
.st-why{grid-column:2;margin-top:-12px;font-size:15px;color:var(--ink-2)}
@media (max-width:640px){.guide ul.styles{display:block}.guide ul.styles li{display:block;margin:0 0 16px}.guide .styles code{display:block;margin-bottom:2px}.st-why{display:block;margin:0}}
.slip-demo{margin:0}
.sl-paper{background:#fff;color:#000;border:1.5px dashed #999;border-radius:2px;padding:14px 16px;font-family:var(--ui)}
.sl-title{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#333}
.sl-name{font-size:18px;margin-top:2px}
.sl-small{font-size:13px;color:#333;margin-top:3px}
.sl-pw{font-family:var(--mono);font-size:19px;margin:6px 0 2px}
.sl-tiny{font-size:11px;color:#333;margin-top:6px}
.slip-demo figcaption{margin-top:10px;font-size:14px;color:var(--muted)}
.guide ul.themes{grid-template-columns:max-content minmax(0,1fr);gap:10px 28px}
.th-ex{font-family:var(--mono);font-size:16px;color:var(--brand-ink)}
.guide ul.themes .st-name{font-weight:600}
@media (max-width:640px){.guide ul.themes li{display:block;margin:0 0 12px}.th-ex{display:block;font-size:15px}}
.guide ul.namestyles{list-style:none;margin:16px 0;padding:0;display:grid;grid-template-columns:max-content max-content minmax(0,1fr);gap:12px 28px;align-items:baseline}
.guide ul.namestyles li{display:contents}
.ns-ex{font-family:var(--mono);font-size:19px;color:var(--brand-ink)}
.ns-name{font-weight:600;color:var(--ink)}
.ns-where{font-size:15px;color:var(--ink-2)}
@media (max-width:560px){.guide ul.namestyles{grid-template-columns:max-content minmax(0,1fr);gap:2px 16px}.ns-where{grid-column:1 / -1;margin-bottom:10px;font-size:14px}}
.guide ol.bars{list-style:none;margin:18px 0 8px;padding:0;display:grid;gap:5px;max-width:440px}
.guide ol.bars li{display:grid;grid-template-columns:5ch 1fr 4.5ch;align-items:center;gap:12px;margin:0;font-variant-numeric:tabular-nums}
.bars .b-pin{font-family:var(--mono);font-size:17px;color:var(--ink)}
.bars .b-bar{display:block;height:10px;width:calc(var(--v) / 9 * 100%);min-width:3px;border-radius:2px;background:var(--brand-ink)}
.bars .b-pct{text-align:end;font-size:14px;color:var(--muted)}
.bars li.dim .b-bar{background:var(--line-strong)}
.bars li.dim .b-pin{color:var(--muted)}
.guide ol.bars.syms{gap:3px;max-width:400px}
.syms .b-pin{font-size:18px}
.guide .odds{display:flex;flex-wrap:wrap;gap:12px 48px;margin:18px 0 6px}
.guide .odds p{margin:0;max-width:22ch}
.odds .big{display:block;margin-bottom:4px;font-size:34px;line-height:1.1;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.odds .big.good{color:var(--s-vstrong)}
.odds span:not(.big){font-size:15px;color:var(--ink-2)}.guide h2{font-family:"PG Bold",var(--ui);font-weight:700;font-size:34px;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}
.guide p strong,.guide li strong{font-family:"PG Bold",var(--ui);font-weight:700;color:var(--ink)}
.guide section>p,.guide section>ul:not(.jobs):not(.presets),.guide section>ol:not(.ladder):not(.bars){max-width:65ch}

.guide{padding-block:0}
.guide section{padding-block:64px}
@media (min-width:1000px){.guide section[id]{scroll-margin-top:-40px}}
@media (max-width:999px){.guide section[id]{scroll-margin-top:-28px}}
:root[data-theme="dark"] .guide section:nth-of-type(even){--band:#1b1d29}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .guide section:nth-of-type(even){--band:#1b1d29}}
.guide section:nth-of-type(even){background:var(--band);box-shadow:0 0 0 100vmax var(--band);clip-path:inset(0 -100vmax)}

@media (min-width:1000px){
  .guide section.g-top{display:block}
  .guide section.g-top>h2{margin-bottom:18px}
  .guide section>.g-head{grid-column:1;grid-row:1 / span 40;align-self:start;position:sticky;top:96px}
  .g-head .spec{margin-top:14px}

}
@media (max-width:999px){
  .guide h2{font-size:27px}
  .guide section{padding-block:44px}
  .spec{margin:4px 0 20px}
}

.spec{user-select:none;-webkit-user-select:none}
.spec-out{margin:0 0 12px;padding:0;border:0;background:none;font-family:var(--mono);font-size:26px;line-height:1.3;letter-spacing:.02em;color:var(--ink);overflow-wrap:anywhere}
.guide .cd{color:#3F51B5}.guide .cs{color:#317000}
:root[data-theme="dark"] .guide .cd{color:#82b1ff} :root[data-theme="dark"] .guide .cs{color:#81c784}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .guide .cd{color:#82b1ff}:root:not([data-theme="light"]) .guide .cs{color:#81c784}}
.spec-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.spec-chips span{display:inline-flex;align-items:center;height:28px;padding:0 10px;border:0;border-radius:6px;background:var(--band);font-size:15px;color:var(--ink-2)}
.spec-sym{display:grid;grid-template-columns:repeat(8,minmax(0,34px));gap:10px 4px}   
.spec-sym span{display:grid;place-items:center;aspect-ratio:1;border-radius:8px;border:1px solid var(--brand-line);background:var(--slab);font-family:var(--mono);font-size:20px;color:var(--brand-ink)}
.spec-sym span.off{border:1px dashed var(--line-strong);background:transparent;color:var(--muted)}
@media (max-width:999px){.spec-sym{grid-template-columns:repeat(8,minmax(0,40px))}.spec-sym span{font-size:22px}.spec-out{font-size:21px}}
@media (max-width:380px){.spec-sym{grid-template-columns:repeat(8,minmax(0,32px))}.spec-sym span{font-size:18px}}

.guide ol.ladder.short{display:grid;grid-template-columns:max-content max-content 1fr;column-gap:28px;margin:24px 0 28px;padding:0;border-top:1px solid var(--line)}
.guide ol.ladder.short li{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;align-items:center;margin:0;padding:12px 0;border-bottom:1px solid var(--line)}
.ladder.short .ld-ph{font-size:24px;letter-spacing:.02em;color:var(--ink)}
.ladder.short .ld-ph u{text-decoration:underline 2px var(--brand-line);text-underline-offset:5px}   
.ladder.short .ld-t{font-family:"PG Bold",var(--ui);font-weight:700;font-size:17px}
.ladder.short .ld-t::before{display:none}
.ladder.short .meter i{width:28px}
@media (max-width:640px){
  .guide ol.ladder.short{grid-template-columns:max-content 1fr;column-gap:14px}
  .guide ol.ladder.short li{grid-template-columns:subgrid;row-gap:6px}
  .ladder.short .ld-ph{grid-column:1 / -1;font-size:19px}
  .ladder.short .meter i{width:22px}
  .ladder.short .ld-t{font-size:15px}
}
.vis-demo{position:fixed;inset-inline-start:16px;bottom:16px;z-index:60;display:flex;gap:4px;padding:4px;border:1px solid var(--line-strong);border-radius:10px;background:var(--slab);font:14px var(--ui)}
.vis-demo a{padding:6px 10px;border-radius:7px;color:var(--ink-2);text-decoration:none}
.vis-demo a[aria-current]{background:var(--brand-fill);color:var(--on-brand)}

@media (min-width:1000px){
  .guide section.g-feat{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);column-gap:64px}
  .guide section.g-feat>*{grid-column:1}
  .guide section.g-feat>h2{grid-column:1;grid-row:auto}
  .guide section.g-feat>.g-scene{grid-column:2;grid-row:1 / span 20;align-self:center;justify-self:center;margin:0;max-width:440px;width:100%}
  .guide section.g-feat.rev{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
  .guide section.g-feat.rev>*{grid-column:2}
  .guide section.g-feat.rev>.g-scene{grid-column:1}
}
.g-scene svg{display:block;width:100%;height:auto;filter:drop-shadow(0 12px 18px rgb(31 34 53 / .12))}
@media (max-width:999px){.guide section.g-feat{display:flex;flex-direction:column}.g-feat>.g-scene{order:1;max-width:320px;margin:4px 0 22px}.g-feat>h2{order:0}.g-feat>:not(h2):not(.g-scene){order:2}
  .g-feat>.g-scene.g-after{order:3;margin:22px 0 0}}

.g-scene .a-paper{fill:#fff}.g-scene .a-line{stroke:#c5cae9}.g-scene .a-bar{fill:#f1f3fb}.g-scene .a-dot{fill:#c5cae9}.g-scene .a-mute{fill:#dfe2ee}
.g-scene .a-ink{fill:#1f2235}.g-scene .a-dig{fill:#3F51B5}.g-scene .a-sym{fill:#317000}.g-scene .a-red{fill:#e53935}
:root[data-theme="dark"] .g-scene .a-paper{fill:#272a37}:root[data-theme="dark"] .g-scene .a-line{stroke:#484c62}:root[data-theme="dark"] .g-scene .a-bar{fill:#2f3240}
:root[data-theme="dark"] .g-scene .a-dot{fill:#5a5f78}:root[data-theme="dark"] .g-scene .a-mute{fill:#373a4a}:root[data-theme="dark"] .g-scene .a-ink{fill:#eceef3}
:root[data-theme="dark"] .g-scene .a-dig{fill:#82b1ff}:root[data-theme="dark"] .g-scene .a-sym{fill:#81c784}:root[data-theme="dark"] .g-scene .a-red{fill:#ff8a80}
:root[data-theme="dark"] .g-scene svg{filter:none}
.g-scene .a-mark{fill:#ffe7a8}.g-scene .a-btn{fill:#1f2235}
:root[data-theme="dark"] .g-scene .a-mark{fill:#6b5212}:root[data-theme="dark"] .g-scene .a-btn{fill:#5b6070}
.g-scene .a-base{fill:#c5cae9}.g-scene .a-cloud{fill:#e3e8ff}
:root[data-theme="dark"] .g-scene .a-base{fill:#484c62}:root[data-theme="dark"] .g-scene .a-cloud{fill:#353a55}

[data-amber="off"] .amb{display:none}

.jobs-wrap{--j-font:19px}
.guide .job{grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:8px 40px;align-items:center;padding:20px 14px;margin-inline:-14px;border-radius:12px;transition:background-color .15s}
.guide .job:hover{background:var(--slab)}
.guide section:nth-of-type(odd) .job:hover{background:var(--band)}
.guide .j-name{font-family:"PG Bold",var(--ui);font-weight:700;font-size:18px;color:var(--ink)}
.guide .j-name .ico{width:26px;height:26px;color:var(--brand-ink)}
.guide .j-sample{position:relative;display:block;padding:12px 16px 12px;border:1px solid var(--line);border-radius:12px;background:var(--slab);box-shadow:0 1px 2px rgb(31 34 53 / .06),0 6px 16px -8px rgb(31 34 53 / .16);font-size:20px;line-height:1.4}
.guide .j-sample .j-line{background:none;padding-bottom:0}
.guide .j-sample{min-width:0;align-self:center;box-shadow:none}
.guide .job>*{min-width:0}
.guide .j-sample .j-line,.guide .j-sample[data-kind="phrase"] .j-line{overflow-wrap:anywhere;word-break:normal}
.guide .j-sample .j-line{width:auto}
@media (max-width:999px){.guide .j-sample{background:var(--sunk);border-color:transparent}.guide .job{grid-template-columns:minmax(0,1fr);padding:18px 0;margin-inline:0}.guide .job:hover{background:none}.guide .j-sample{font-size:17px}}

@media (min-width:1000px){.guide #rejected.g-feat>.g-scene{align-self:start;margin-top:96px}.guide #technical.g-feat>.g-code{align-self:start;margin-top:104px}}
:root:not([data-theme="dark"]) .bars li.dim .b-bar{box-shadow:inset 0 0 0 1px #c77c00}

:root:not([data-theme="dark"]) .guide .mini[data-l="2"] i:nth-child(-n+2),:root:not([data-theme="dark"]) .guide .tbl.tint .lv .mini[data-l="2"] i:nth-child(-n+2),
:root:not([data-theme="dark"]) .guide .meter[data-l="2"] i:nth-child(-n+2){background:#c77c00}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .guide .mini[data-l="2"] i:nth-child(-n+2),:root:not([data-theme="light"]) .guide .tbl.tint .lv .mini[data-l="2"] i:nth-child(-n+2),:root:not([data-theme="light"]) .guide .meter[data-l="2"] i:nth-child(-n+2){background:#ffb300}}
.bars li.dim .b-bar{background:#ffb300}
.bars li.dim .b-pin{color:var(--ink)}

.hs-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 64px;align-items:center;margin-bottom:40px}
.hs-top>p{grid-column:1}
.hs-top>.hs-card{grid-column:2;grid-row:1 / span 2}
.hs-card{padding:8px 24px;border:1px solid var(--line);border-radius:14px;background:var(--slab);box-shadow:0 1px 2px rgb(31 34 53 / .06),0 18px 40px -18px rgb(31 34 53 / .28)}
.guide .hs-card ol.ladder.short{margin:0;border-top:0;column-gap:22px}
.guide .hs-card ol.ladder.short li:last-child{border-bottom:0}
.hs-card .ladder.short .ld-ph{font-size:21px}
.hs-card .ladder.short .meter i{width:24px}
@media (max-width:999px){.hs-top{grid-template-columns:1fr;margin-bottom:28px}.hs-top>.hs-card{grid-column:1;grid-row:auto;margin-top:8px;padding:4px 16px}
  .hs-card .ladder.short .ld-ph{font-size:18px}}
span.mini{display:inline-flex;gap:3px;flex:none}
span.mini i{width:12px;height:5px;border-radius:2.5px;background:var(--s-empty)}
span.mini[data-l="1"] i:nth-child(-n+1){background:var(--s-weak)}
span.mini[data-l="2"] i:nth-child(-n+2){background:var(--s-fair)}
span.mini[data-l="3"] i:nth-child(-n+3){background:var(--s-strong)}
span.mini[data-l="4"] i:nth-child(-n+4){background:var(--s-vstrong)}
.lv-key.meters .k::before{display:none}
.lv-key.meters{gap:8px 22px;margin:10px 0 14px}
.lv-key.meters .k{gap:9px}
.guide .tbl.tint td:has(.lv){background:none!important;border-bottom:1px solid var(--line)}
.tbl.tint .lv{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.tbl.tint .lv>i{display:none}
.guide .tbl.tint .lv .mini i{display:block;width:12px;height:5px;border-radius:2.5px;background:var(--s-empty)}
.guide .tbl.tint .lv .mini[data-l="1"] i:nth-child(-n+1){background:var(--s-weak)}
.guide .tbl.tint .lv .mini[data-l="2"] i:nth-child(-n+2){background:var(--s-fair)}
.guide .tbl.tint .lv .mini[data-l="3"] i:nth-child(-n+3){background:var(--s-strong)}
.guide .tbl.tint .lv .mini[data-l="4"] i:nth-child(-n+4){background:var(--s-vstrong)}

.guide .tbl.tint{border-collapse:collapse;width:100%}
.guide .tbl.tint thead td,.guide .tbl.tint thead th{font-family:"PG Bold",var(--ui);font-weight:700;font-size:15px;color:var(--ink);border-bottom:2px solid var(--ink)}
.guide .tbl.tint tbody td:first-child{font-family:"PG Bold",var(--ui);font-weight:700;font-size:24px;color:var(--ink);vertical-align:top}
.guide .tbl.tint td,.guide .tbl.tint th{padding:14px 16px 14px 0}

.g-code{--c-bg:#1f2235;--c-bar:#2a2e48;--c-ink:#d7daf0;--c-k:#9fb4ff;--c-f:#ffcc4d;--c-n:#8fd694;border-radius:14px;background:var(--c-bg);box-shadow:0 18px 40px -18px rgb(31 34 53 / .45);overflow:hidden;text-align:start}
:root[data-theme="dark"] .g-code{--c-bg:#212330;--c-bar:#2a2d3b}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .g-code{--c-bg:#212330;--c-bar:#2a2d3b}}
.code-bar{display:flex;gap:7px;padding:12px 16px;background:var(--c-bar)}
.code-bar i{width:11px;height:11px;border-radius:50%;background:#ef5350}
.code-bar i+i{background:#ffb300}.code-bar i+i+i{background:#66bb6a}
.g-code pre{margin:0;padding:20px 22px 24px;border:0;background:none;color:var(--c-ink);font-family:var(--mono);font-size:15px;line-height:1.6;overflow-x:auto;tab-size:2}
.g-code .k{color:var(--c-k)}.g-code .f{color:var(--c-f)}.g-code .n{color:var(--c-n)}
@media (max-width:999px){.guide section.g-feat>.g-code{max-width:none;width:100%}.g-code pre{font-size:13.5px;padding:16px 16px 18px}}
.guide section#technical>p:first-of-type{font-size:19px;color:var(--ink)}

.g-faq-art{max-width:220px;margin:26px 0 0}
.g-faq-art svg{filter:none}
@media (max-width:999px){.g-faq-art{display:none}}
.guide .faq summary{align-items:center;padding:20px 0;font-family:"PG Bold",var(--ui);font-weight:700;font-size:18px}
.guide .faq summary .ico{flex:none;width:30px;height:30px;padding:6px;margin:0;border:1.5px solid var(--brand-line);border-radius:50%;color:var(--brand-ink);transition:transform .2s cubic-bezier(.2,.8,.2,1),background-color .15s}
.guide .faq summary:hover .ico{background:var(--brand-soft)}
.guide .faq details[open] summary{color:var(--brand-ink)}
.guide .faq details[open] summary .ico{background:var(--brand-fill);border-color:var(--brand-fill);color:var(--on-brand)}
.guide .faq details p{max-width:65ch;margin:0 0 22px}

[data-hero="blue"] main>section.band:first-child{background:#3F51B5;border-bottom:0}
[data-hero="blue"] main>section.band:first-child .band-in{padding-bottom:56px}
[data-hero="blue"] main>section.band:first-child h1{color:#fff;font-family:"PG Bold",var(--ui);font-weight:700}
[data-hero="blue"] main>section.band:first-child .after .link-btn{color:#fff}
[data-hero="blue"] main>section.band:first-child .after .link-btn:hover{background:rgb(255 255 255 / .14)}
[data-hero="blue"] main>section.band:first-child #result{border-color:transparent;box-shadow:0 22px 44px -20px rgb(10 14 50 / .55)}
[data-hero="blue"][data-theme="dark"] main>section.band:first-child{background:#23284a}

[data-foot="charcoal"] .foot,[data-foot="navy"] .foot{--band:#1d1e23;--line:#33363f;--ink:#eceef3;--ink-2:#c6c9d4;--muted:#a3a7b6;--brand-ink:#9fb4ff;color:var(--muted);border-top:0}
[data-foot="navy"] .foot{--band:#1f2235}
[data-foot="charcoal"][data-theme="dark"] .foot,[data-foot="navy"][data-theme="dark"] .foot{--band:#0f1013}
[data-foot] .foot .brand{color:var(--ink)}
[data-foot="charcoal"] .foot,[data-foot="navy"] .foot{--slab:#2a2c33;--line-strong:#4d515e}
[data-foot="navy"] .foot{--slab:#2b2f4a}

.tray{display:block}
[data-ctl="tray"] main>section.band:first-child .tray{margin-top:20px;padding:18px 20px 20px;border-radius:20px;background:#f2f3f9;box-shadow:0 26px 50px -26px rgb(10 14 50 / .6)}
[data-ctl="tray"] main>section.band:first-child .tray .recipe{margin-top:0}
[data-ctl="tray"] main>section.band:first-child .tray #result{box-shadow:0 1px 2px rgb(31 34 53 / .06);border-color:var(--line)}
[data-ctl="tray"][data-theme="dark"] main>section.band:first-child .tray{background:#1b1c21}
@media (max-width:640px){[data-ctl="tray"] main>section.band:first-child .tray{margin-inline:-6px;padding:12px 10px 12px;border-radius:16px}}

[data-ctl="blue"] main>section.band:first-child .chip[aria-pressed="false"],
[data-ctl="blue"] main>section.band:first-child .split:has(>.chip[aria-pressed="false"]) .chip-more{background:transparent;border-color:rgb(255 255 255 / .7);color:#fff}
[data-ctl="blue"] main>section.band:first-child .chip[aria-pressed="false"] *{color:#fff}
[data-ctl="blue"] main>section.band:first-child #c-look[aria-pressed="false"]{background:rgb(255 255 255 / .16)}
[data-ctl="blue"] main>section.band:first-child .chip[aria-pressed="false"]:hover{border-color:#fff}
[data-ctl="blue"] main>section.band:first-child .chip-more .ico{color:inherit}

:root[data-theme="dark"] .top{--band:#1a1c26;--line:rgb(255 255 255 / .1);border-bottom-color:transparent}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .top{--band:#1a1c26;--line:rgb(255 255 255 / .1);border-bottom-color:transparent}
  :root:not([data-theme="light"]) main>section.band:first-child{background:#1a1c26}}
[data-ctl="tray"][data-theme="dark"] main>section.band:first-child .tray{background:#1b1e36;box-shadow:0 26px 50px -26px rgb(0 0 0 / .7)}
[data-theme="dark"] main>section.band:first-child .tray{--slab:#1c1e29;--sunk:#191b25;--line:#363a4c;--line-strong:#484c62;--band:#15161e;--brand-soft:#262d4d}
[data-theme="dark"] main>section.band:first-child .tray #result{border-color:#363a4c}

main>section.band:first-child :is(.chip,.link-btn,.btn,a):focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 5px #1a237e}
main>section.band:first-child #result :is(.btn,a):focus-visible,[data-ctl="tray"] main>section.band:first-child .tray .chip:focus-visible{outline:2px solid #3F51B5;box-shadow:none}

.g-tech-art,.g-faq-art{}
.g-tech-art svg{max-width:420px}

.jobs-2{display:grid;gap:8px 64px;margin:18px 0 10px}
@media (min-width:1000px){.jobs-2{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
.jg>h3{display:flex;align-items:center;gap:10px;margin:0 0 4px;padding-bottom:12px;border-bottom:2px solid var(--ink);font-family:"PG Bold",var(--ui);font-weight:700;font-size:20px;color:var(--ink)}
.jg>h3 .ico{width:22px;height:22px;color:var(--brand-ink)}
.guide .jg .jobs{display:block;margin:0}
.guide .jg .job{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:5px;padding:18px 0;padding-inline-start:44px;margin:0;border-radius:0}
.guide .jg .job:hover{background:none}
.guide .jg .j-name .ico{top:15px}
.guide .jg .j-text{display:contents}
.guide .jg .j-name{order:0}
.guide .jg .j-sample{order:1;align-self:stretch;margin:2px 0 3px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;font-size:18px;line-height:1.45}
.guide .jg .j-why{order:2;margin:0}
.guide .jg .j-detail{order:3;margin:0}
.guide .jg-tools .j-sample{display:none}
.guide .jg-tools .job{padding-block:14px}
@media (max-width:999px){.jg+.jg{margin-top:26px}}

@media (min-width:1000px){
  [data-jobs^="grid"] .guide .jobs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px}
}
[data-jobs^="grid"] .guide .job{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:22px 0;padding-inline-start:44px;margin:0;border-radius:0}
[data-jobs^="grid"] .guide .j-name .ico{top:19px}
[data-jobs^="grid"] .guide .job:hover{background:none}
[data-jobs^="grid"] .guide .j-text{display:contents}
[data-jobs^="grid"] .guide .j-name{order:0}
[data-jobs^="grid"] .guide .j-sample{order:1;align-self:stretch;margin:2px 0 4px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;font-size:17px;line-height:1.45}
[data-jobs^="grid"] .guide .j-why{order:2;margin:0}
[data-jobs^="grid"] .guide .j-detail{order:3;margin:0}
[data-jobs="grid-plain"] .guide .j-sample{display:none}
@media (max-width:999px){[data-jobs^="grid"] .guide .j-sample{background:none}}

.guide ol.bars.syms{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:6px;max-width:560px;align-items:end;margin:24px 0 16px}
.guide ol.bars.syms li{display:flex;flex-direction:column;align-items:center;gap:6px;grid-template-columns:none}
.guide ol.bars.syms .b-pct{order:0;text-align:center;font-size:12px}
.guide ol.bars.syms li>span:nth-child(2){order:1;display:flex;align-items:flex-end;width:100%;height:112px}
.guide ol.bars.syms .b-bar{width:100%;min-width:0;height:calc(var(--v) / 9 * 100%);border-radius:5px 5px 0 0}
.guide ol.bars.syms .b-pin{order:2;font-size:19px;line-height:1}
@media (max-width:640px){.guide ol.bars.syms{gap:3px}.guide ol.bars.syms .b-pct{font-size:10.5px}.guide ol.bars.syms li>span:nth-child(2){height:90px}.guide ol.bars.syms .b-pin{font-size:16px}}

.guide details.fold{margin:8px 0 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.guide details.fold>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;cursor:pointer;color:var(--ink)}
.guide details.fold>summary::-webkit-details-marker{display:none}
.guide details.fold>summary .ico,.guide .tq>summary .ico{flex:none;width:30px;height:30px;padding:6px;border:1.5px solid var(--brand-line);border-radius:50%;color:var(--brand-ink);transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.guide details[open].fold>summary .ico,.guide .tq[open]>summary .ico{transform:rotate(180deg);background:var(--brand-fill);border-color:var(--brand-fill);color:var(--on-brand)}
.guide details.fold>summary:hover .ico,.guide .tq>summary:hover .ico{background:var(--brand-soft)}
.guide details.fold>.lv-key{margin-top:0}
.guide details.fold>.scroll-x{margin-bottom:18px}

.tech-list{margin-top:14px;border-top:1px solid var(--line)}
.guide .tq{border-bottom:1px solid var(--line)}
.guide .tq>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;cursor:pointer;font-family:"PG Bold",var(--ui);font-weight:700;font-size:17px;color:var(--ink)}
.guide .tq>summary::-webkit-details-marker{display:none}
.guide .tq[open]>summary{color:var(--brand-ink)}
.guide .tq>p{max-width:65ch;margin:0 0 18px}
@media (min-width:1000px){.guide #technical.g-feat>.g-scene{align-self:start;position:sticky;top:120px;margin-top:40px}}

.v3-demo{position:fixed;inset-inline-start:12px;bottom:12px;z-index:60;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;max-width:calc(100vw - 24px);padding:6px 8px;border:1px solid var(--line-strong);border-radius:10px;background:var(--slab);font:13px var(--ui);color:var(--muted);box-shadow:0 8px 24px -10px rgb(0 0 0 / .3)}
.v3-demo span{display:inline-flex;gap:2px;align-items:center}
.v3-demo button,.v3-demo a{padding:4px 8px;border:0;border-radius:6px;background:none;color:var(--ink-2);font:inherit;text-decoration:none;cursor:pointer}
.v3-demo [aria-pressed="true"]{background:var(--brand-fill);color:var(--on-brand)}
.vis-demo{display:none}
[data-faqart="off"] .g-faq-art{display:none}

.guide{interpolate-size:allow-keywords}
::selection{background:#c5cae9;color:#171927}
:root[data-theme="dark"] ::selection{background:#3a4280;color:#fff}

.guide h2{font-size:40px;line-height:1.1;letter-spacing:-.015em}
@media (max-width:999px){.guide h2{font-size:30px}}
@media (min-width:1000px){.guide section.g-feat>.g-scene{max-width:480px}}

.guide details::details-content{transition:height .32s cubic-bezier(.16,1,.3,1),content-visibility .32s allow-discrete;height:0;overflow:clip}
.guide details[open]::details-content{height:auto}

@media (min-width:1000px){.hs-top{grid-template-rows:auto auto 1fr;align-items:start}.hs-top>.hs-card{grid-row:1 / span 3}}
.x-live{padding:22px 24px 10px}
.xl-head{padding-bottom:18px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.x-live{container-type:inline-size}
.xl-out{margin:0 0 12px;font-family:var(--mono);font-size:min(30px,7.6cqi);line-height:1.25;letter-spacing:.02em;color:var(--ink);white-space:nowrap;overflow-wrap:normal;min-height:1.25em}
.xl-t{flex-basis:100%}
@container (max-width:400px){.xl-t{min-height:2lh}}
[dir="rtl"] .xl-range::-webkit-slider-runnable-track{background:linear-gradient(270deg,var(--brand-fill) var(--p),var(--s-empty) var(--p))}
.xl-meta .meter i{transition:background-color .15s}
.xl-out .new{text-decoration:underline 3px var(--brand-line);text-underline-offset:6px}
.xl-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-bottom:18px}
.xl-meta .meter i{width:30px;height:7px}
.xl-v{font-family:"PG Bold",var(--ui);font-weight:700;font-size:17px}
.xl-v.lv-1{color:var(--s-weak)}.xl-v.lv-2{color:#a86400}.xl-v.lv-3{color:#4e7f24}.xl-v.lv-4{color:var(--s-vstrong)}
:root[data-theme="dark"] .xl-v.lv-2{color:#ffb300}:root[data-theme="dark"] .xl-v.lv-3{color:#9ccc65}
.xl-t{color:var(--ink-2);font-size:16px}
.xl-slide{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;color:var(--muted);font-size:14px;font-variant-numeric:tabular-nums}
.xl-range{--p:55.6%;-webkit-appearance:none;appearance:none;width:100%;height:28px;margin:0;background:transparent;cursor:pointer}
.xl-range::-webkit-slider-runnable-track{height:8px;border-radius:4px;background:linear-gradient(90deg,var(--brand-fill) var(--p),var(--s-empty) var(--p))}
.xl-range::-moz-range-track{height:8px;border-radius:4px;background:var(--s-empty)}
.xl-range::-moz-range-progress{height:8px;border-radius:4px;background:var(--brand-fill)}
.xl-range::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-9px;border-radius:50%;background:var(--slab);border:3px solid var(--brand-fill);box-shadow:0 2px 6px rgb(31 34 53 / .25);transition:transform .15s cubic-bezier(.16,1,.3,1)}
.xl-range::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--slab);border:3px solid var(--brand-fill);box-shadow:0 2px 6px rgb(31 34 53 / .25)}
.xl-range:active::-webkit-slider-thumb{transform:scale(1.15)}
.xl-range:focus-visible{outline:none}
.xl-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--slab),0 0 0 6px var(--brand-ink)}
.xl-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--slab),0 0 0 6px var(--brand-ink)}
.xl-ready ol.ladder.short li{cursor:pointer}
.x-live ol.ladder.short li{margin-inline:-12px;padding-inline:12px;border-radius:8px;transition:background-color .2s}
.x-live ol.ladder.short li.on{background:var(--brand-soft)}
@media (hover:hover){.xl-ready ol.ladder.short li:hover{background:var(--band)}.xl-ready ol.ladder.short li.on:hover{background:var(--brand-soft)}}
@media (max-width:640px){.x-live{padding:16px 16px 8px}.x-live ol.ladder.short li{margin-inline:-8px;padding-inline:8px}}

.x-cloudl{stroke-width:3px;stroke-linejoin:round}

:is(.x-ptr,.x-try1,.x-try2,.x-tick,.x-cut,.x-shield,.x-die,.x-chip,.x-copy,.x-done,.x-cpico,.x-seg,.x-scan,.x-caret,.x-cloud,.x-arrow,.x-pw){transform-box:fill-box}
.x-ptr,.x-tick,.x-cut,.x-shield,.x-die,.x-chip,.x-copy,.x-done,.x-cpico{transform-origin:center}
.x-seg{transform-origin:left center}
.x-done{opacity:0}
.x-scan{opacity:0}
@media (prefers-reduced-motion:no-preference){
.x-js .x-anim:not(.x-play) :is(.x-ptr,.x-try2,.x-tick,.x-cut,.x-shield,.x-die,.x-pw,.x-arrow){opacity:0}
.x-js .x-anim:not(.x-play) .x-seg{transform:scaleX(0)}
.x-js .x-anim:not(.x-play) .x-type tspan{fill-opacity:0}
.x-js .x-anim:not(.x-play) .x-caret{transform:translateX(-160px)}
.x-js .x-anim:not(.x-play) .x-cloud{transform:translateX(-26px);opacity:.6}
.x-js .x-anim:not(.x-play) .x-line{opacity:0}
}
.x-play .x-ptr{animation:x-ptr-in .75s cubic-bezier(.16,1,.3,1) both,x-press .2s ease-out .8s}
@keyframes x-ptr-in{from{opacity:0;transform:translate(46px,40px)}to{opacity:1;transform:none}}
@keyframes x-press{50%{transform:scale(.84)}}
.x-play .x-copy{animation:x-press .22s ease-out .85s}
.x-play .x-cpico{animation:x-out .2s ease-out .9s both}
.x-play .x-done{animation:x-pop .4s cubic-bezier(.16,1,.3,1) 1s both}
@keyframes x-out{to{opacity:0;transform:scale(.6)}}
@keyframes x-pop{from{opacity:0;transform:scale(.3)}60%{opacity:1;transform:scale(1.12)}to{opacity:1;transform:none}}
.x-play .x-seg{animation:x-grow .45s cubic-bezier(.16,1,.3,1) calc(1.05s + var(--i) * .1s) both}
@keyframes x-grow{from{transform:scaleX(0)}to{transform:none}}
#rejected .x-play .x-try1{animation:x-shake .5s cubic-bezier(.36,.07,.19,.97) .25s}
@keyframes x-shake{20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
#rejected .x-play .x-try2{animation:x-rise .7s cubic-bezier(.16,1,.3,1) .9s both}
@keyframes x-rise{from{opacity:0;transform:translate(16px,22px)}to{opacity:1;transform:none}}
#rejected .x-play .x-tick{animation:x-pop .45s cubic-bezier(.16,1,.3,1) 1.85s both}
#rejected .x-play .x-ptr{animation:x-ptr-in .55s cubic-bezier(.16,1,.3,1) 1.1s both,x-press .2s ease-out 1.7s}
#safe .x-play .x-line{animation:x-fade .35s ease-out .55s both}
#safe .x-play .x-cut{animation:x-pop .45s cubic-bezier(.16,1,.3,1) .5s both}
#safe .x-play .x-cloud{animation:x-drift .9s cubic-bezier(.16,1,.3,1) .7s both}
#safe .x-play .x-shield{animation:x-drop .8s cubic-bezier(.16,1,.3,1) 1s both}
@keyframes x-fade{from{opacity:0}to{opacity:1}}
@keyframes x-drift{from{transform:translateX(-26px);opacity:.6}to{transform:none;opacity:1}}
@keyframes x-drop{from{opacity:0;transform:translateY(-26px) scale(.92)}to{opacity:1;transform:none}}
#phone .x-play .x-arrow{animation:x-slide .6s cubic-bezier(.16,1,.3,1) .15s both}
@keyframes x-slide{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:none}}
#phone .x-play .x-scan{animation:x-scan 1s cubic-bezier(.45,0,.55,1) .6s both}
@keyframes x-scan{0%{opacity:0;transform:translateY(0)}15%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translateY(50px)}}
#phone .x-play .x-pw{animation:x-rise .55s cubic-bezier(.16,1,.3,1) 1.55s both}
#phone .x-play .x-tick{animation:x-pop .45s cubic-bezier(.16,1,.3,1) 1.95s both}
#technical .x-play .x-chip{animation:x-glow .5s ease-out .05s}
@keyframes x-glow{50%{transform:scale(1.06)}}
#technical .x-play .x-die{animation:x-tumble .9s cubic-bezier(.16,1,.3,1) calc(.35s + var(--i) * .16s) both}
@keyframes x-tumble{from{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(-220deg) scale(.3)}to{opacity:1;transform:none}}
#technical .x-play .x-type tspan{animation:x-type .01s linear calc(1.45s + var(--i) * .07s) both}
@keyframes x-type{from{fill-opacity:0}to{fill-opacity:1}}
#technical .x-play .x-caret{animation:x-walk 1.12s steps(16,jump-start) 1.45s both,x-blink 1s steps(1) 2.6s 3}
@keyframes x-walk{from{transform:translateX(-160px)}to{transform:none}}
@keyframes x-blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}
@media (prefers-reduced-motion:reduce){.x-anim *{animation:none!important}.guide details::details-content,.guide .jg .j-name .ico,.xl-range::-webkit-slider-thumb,.x-live ol.ladder.short li,.xl-meta .meter i{transition:none}.xl-range:active::-webkit-slider-thumb{transform:none}}

.x-demo{position:fixed;inset-inline-start:12px;bottom:12px;z-index:60;display:flex;gap:4px;align-items:center;padding:6px 8px;border:1px solid var(--line-strong);border-radius:10px;background:var(--slab);font:13px var(--ui);color:var(--muted);box-shadow:0 8px 24px -10px rgb(0 0 0 / .3)}
.x-demo a,.x-demo button{padding:4px 9px;border:0;border-radius:6px;background:none;color:var(--ink-2);font:inherit;text-decoration:none;cursor:pointer}
.x-demo button{background:var(--brand-fill);color:var(--on-brand)}
.v3-demo{display:none}

[data-tbpos="under"] .tb-after,[data-tbpos="after"] .tb-under{display:none}
.tools-band{--tb:#eef1fd;padding-block:48px 52px;background:var(--tb);box-shadow:0 0 0 100vmax var(--tb);clip-path:inset(0 -100vmax)}
:root[data-theme="dark"] .tools-band{--tb:#13141c}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tools-band{--tb:#13141c}}

:root[data-theme="dark"] :is(.guide>.tools-band+section:nth-of-type(odd),.guide>section:nth-of-type(odd)+.tools-band){border-top:1px solid var(--line)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.guide>.tools-band+section:nth-of-type(odd),.guide>section:nth-of-type(odd)+.tools-band){border-top:1px solid var(--line)}}
.tools-band>h2{margin:0 0 22px;font-family:"PG Bold",var(--ui);font-weight:700;font-size:28px;color:var(--ink)}
.tb-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 40px}
.guide .tb-list{padding:0}   
.tb-list>li{margin:0;border-top:1px solid rgb(63 81 181 / .18)}
:root[data-theme="dark"] .tb-list>li{border-top-color:rgb(255 255 255 / .1)}
.tb-item{display:grid;grid-template-rows:auto auto 1fr;gap:8px;height:100%;padding:18px 0 20px;color:inherit;text-decoration:none}
.tb-name{display:flex;align-items:center;gap:10px;font-family:"PG Bold",var(--ui);font-weight:700;font-size:18px;color:var(--ink);transition:color .15s}
.tb-name .ico{width:22px;height:22px;color:var(--brand-ink)}
.tb-pic{display:block;min-height:1.5em;padding-inline-start:32px}
.tb-line{padding-inline-start:32px}
.guide .tb-sample{display:block;padding:0;border:0;background:none;box-shadow:none;font-size:18px;line-height:1.45}
.guide .tb-sample .j-line{width:auto;background:none;padding:0;overflow-wrap:anywhere}
.guide .tb-sample[data-kind="bulk"] .j-line{font-size:15px;line-height:1.35}
.guide .tb-sample[data-kind="bulk"] .j-line+.j-line{margin-top:1px}
.guide .tb-sample .j-note{display:none}
.tb-qr{display:block;width:62px;height:62px;border-radius:6px}
.tb-line{color:var(--ink-2);font-size:15px;line-height:1.45}
@media (hover:hover){.tb-item:hover .tb-name{color:var(--brand-ink)}}
.tb-item:focus-visible{outline:2px solid var(--brand-ink);outline-offset:4px;border-radius:6px}
@media (max-width:999px){.tb-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 24px}.tools-band{padding-block:36px 40px}.tools-band>h2{font-size:24px}}
@media (max-width:520px){.tb-list{grid-template-columns:minmax(0,1fr)}.tb-item{grid-template-columns:minmax(0,1fr);gap:6px;padding:14px 0 16px}}
@media (prefers-reduced-motion:reduce){.tb-name{transition:none}}
.x2-new{outline:2px dashed #ffb300;outline-offset:6px;border-radius:4px}

@media (min-width:1000px){.jobs-2{grid-template-columns:minmax(0,1fr)}.guide .jg .jobs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px}}
.jg .jobs{border-top:1px solid var(--line)}
.x2-demo{position:fixed;inset-inline-start:12px;bottom:12px;z-index:61;display:flex;gap:4px;align-items:center;padding:6px 8px;border:1px solid var(--line-strong);border-radius:10px;background:var(--slab);font:13px var(--ui);color:var(--muted);box-shadow:0 8px 24px -10px rgb(0 0 0 / .3)}
.x2-demo a,.x2-demo button{padding:4px 9px;border:0;border-radius:6px;background:none;color:var(--ink-2);font:inherit;text-decoration:none;cursor:pointer}
.x2-demo [aria-pressed="true"]{background:var(--brand-fill);color:var(--on-brand)}
.x-demo{display:none}

.x-lab{container-type:inline-size;padding:24px 24px 22px}
.x-lab .xl-head{padding:0;margin:0;border:0}
.x-lab .xl-meta{margin-bottom:20px}
.xl-sets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 0 18px}
.xl-sets .chip{justify-content:center;height:42px;padding:0 8px;font-size:16px}

.xl-sets .chip .box{display:none}
.xl-sets .chip{gap:0}
.xl-sets .chip[aria-pressed="true"]{background:var(--slab);border-color:var(--line-strong);color:var(--brand-ink)}
.xl-sets .chip[aria-pressed="false"]{background:transparent;border-color:var(--line-strong)}
.xl-sets .chip>span:not(.sr){position:relative;font-size:17px;letter-spacing:.04em}
.xl-sets .chip[aria-pressed="true"]>span:not(.sr){color:var(--brand-ink)}
.xl-sets .chip[aria-pressed="false"]>span:not(.sr){color:var(--muted);text-decoration:line-through;text-decoration-thickness:2px}
.xl-sets .chip>span:not(.sr):not(.box)::before{content:"\2713";position:absolute;inset-inline-end:100%;top:50%;transform:translateY(-50%);margin-inline-end:6px;font-family:var(--ui);color:transparent;text-decoration:none}
.xl-sets .chip[aria-pressed="true"]>span:not(.sr):not(.box)::before{color:var(--brand-ink)}
.xl-sets .chip.nope{animation:nope .32s cubic-bezier(.36,.07,.19,.97)}
.x-lab .xl-out{transition:color .2s}
@media (max-width:640px){.x-lab{padding:18px 16px 16px}.xl-sets .chip{padding:0 4px}.xl-sets .chip>span:not(.sr){font-size:15px;letter-spacing:.02em}
  .xl-sets .chip>span:not(.sr):not(.box)::before{position:static;transform:none;margin-inline-end:4px}}
@media (min-width:1000px){.hs-top{align-items:center;margin-bottom:0}.hs-top>.hs-card{align-self:center}}
@media (max-width:999px){.hs-top{margin-bottom:0}.hs-top>.hs-card{margin-bottom:22px}}

button.ttc{padding:0;border:0;background:none;font:inherit;color:inherit;text-decoration:underline dotted;text-underline-offset:3px;cursor:pointer}
button.ttc:hover{color:var(--ink)}
#pop-ttc{width:min(380px,calc(100vw - 24px))}
#pop-ttc .ttc-body p{margin:0 0 12px;font-size:15px;line-height:1.55;color:var(--ink-2)}
.ttc-more{display:inline-flex;align-items:center;gap:6px;min-height:24px;font-family:"PG Bold",var(--ui);font-weight:700;font-size:15px;color:var(--brand-ink);text-decoration:none}
.ttc-more:hover{text-decoration:underline}
.ttc-more .ico{width:16px;height:16px;transform:rotate(90deg)}

:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip{border-top-color:rgb(255 255 255 / .28)}
:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip-txt{color:rgb(255 255 255 / .88)}
:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip-txt b{color:#fff}
:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip:hover .pm-tip-txt b{color:#fff;text-decoration:underline;text-underline-offset:3px}
:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip-ic{background:#fff}
:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip-go{border-color:#fff}
:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip-x{color:#fff}
:root:not([data-theme="dark"]) main>section.band:first-child .pm-tip-x:hover{background:rgb(255 255 255 / .14);color:#fff}

@media (min-width:1000px){
  .guide section#faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);column-gap:72px;align-items:start}
  .guide section#faq>h2{grid-column:1 / -1;grid-row:1;margin-bottom:12px}
  .guide section#faq>details{grid-column:2;grid-row:auto}
  .guide section#faq>.g-faq-art{grid-column:1;grid-row:2 / span 11;align-self:start;justify-self:center;position:sticky;top:140px;width:100%;max-width:300px;margin:12px 0 0}
}

.tools-band{--c-hy:#a86400;--c-pin:#3F51B5;--c-un:#a86400;--c-chk:#ffb300;--c-glow:rgb(255 179 0 / .5);--c-bk1:#3F51B5;--c-bk2:#ffb300;--c-bk3:#7986cb;--c-d:#3F51B5;--c-s:#a86400}
:root[data-theme="dark"] .tools-band{--c-hy:#ffb300;--c-pin:#82b1ff;--c-un:#ffb300;--c-bk1:#82b1ff;--c-bk3:#9fa8da;--c-d:#82b1ff;--c-s:#ffb300}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tools-band{--c-hy:#ffb300;--c-pin:#82b1ff;--c-un:#ffb300;--c-bk1:#82b1ff;--c-bk3:#9fa8da;--c-d:#82b1ff;--c-s:#ffb300}}
.tools-band .j-line b.d{color:var(--c-d)}
.tools-band .j-line b.s{color:var(--c-s)}
.tools-band .j-sample[data-kind="phrase"] .j-line :is(b.s,b.d){color:var(--c-hy)}
.tb-item{grid-template-rows:auto 1fr auto;gap:12px}
.tb-pic{display:flex;align-items:center;min-height:80px;margin-inline-start:32px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--slab);
  box-shadow:0 1px 2px rgb(31 34 53 / .06),0 12px 26px -18px rgb(31 34 53 / .35);transition:border-color .15s,box-shadow .2s,translate .2s cubic-bezier(.16,1,.3,1)}
:root[data-theme="dark"] .tb-pic{box-shadow:0 12px 26px -18px rgb(0 0 0 / .7)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tb-pic{box-shadow:0 12px 26px -18px rgb(0 0 0 / .7)}}
@media (hover:hover){.tb-item:hover .tb-pic{border-color:var(--brand-line);box-shadow:0 1px 2px rgb(31 34 53 / .06),0 16px 30px -16px rgb(31 34 53 / .42);translate:0 -2px}}
@media (prefers-reduced-motion:reduce){.tb-pic{transition:none}.tb-item:hover .tb-pic{translate:none}}
@media (max-width:520px){.tb-pic{min-height:64px}}
.guide .tools-band .tb-sample{font-size:16px;line-height:1.5;color:var(--ink)}
.tb-sample[data-kind="pin"] .j-line{white-space:nowrap}
.tb-sample[data-kind="pin"] .j-line b.d{display:inline-grid;place-items:center;width:27px;height:34px;margin-inline-end:5px;border:1px solid var(--line);border-radius:7px;
  background:linear-gradient(var(--slab),var(--sunk));box-shadow:0 2px 3px -1px rgb(31 34 53 / .16);font-family:"PG Bold",var(--ui);font-weight:700;font-size:18px;color:var(--c-pin)}
.tb-sample[data-kind="user"]{font-family:var(--ui);font-size:20px}
.tb-sample[data-kind="user"] .tb-u2{color:var(--c-un)}
.guide .tools-band .tb-sample[data-kind="bulk"] .j-line{display:block;position:relative;padding-inline-start:19px;font-size:14px;line-height:1.5}
.tb-sample[data-kind="bulk"] .j-line::before{content:"";position:absolute;inset-inline-start:0;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--c-bk1)}
.tb-sample[data-kind="bulk"] .j-line:nth-child(2)::before{background:var(--c-bk2)}
.tb-sample[data-kind="bulk"] .j-line:nth-child(3)::before{background:var(--c-bk3)}
.tb-sample[data-kind="check"] .j-bad{position:relative;display:inline-block;margin-inline-start:9px;text-decoration:none}
.tb-sample[data-kind="check"] .j-bad::after{content:"";position:absolute;inset:-4px -9px;pointer-events:none;
  background:
    linear-gradient(var(--c-chk),var(--c-chk)) left top / 9px 2.5px no-repeat, linear-gradient(var(--c-chk),var(--c-chk)) left top / 2.5px 9px no-repeat,
    linear-gradient(var(--c-chk),var(--c-chk)) right top / 9px 2.5px no-repeat, linear-gradient(var(--c-chk),var(--c-chk)) right top / 2.5px 9px no-repeat,
    linear-gradient(var(--c-chk),var(--c-chk)) left bottom / 9px 2.5px no-repeat, linear-gradient(var(--c-chk),var(--c-chk)) left bottom / 2.5px 9px no-repeat,
    linear-gradient(var(--c-chk),var(--c-chk)) right bottom / 9px 2.5px no-repeat, linear-gradient(var(--c-chk),var(--c-chk)) right bottom / 2.5px 9px no-repeat}
.tb-sample[data-kind="check"] .j-bad::before{content:"";position:absolute;top:-2px;bottom:-2px;inset-inline-start:-5px;width:2.5px;border-radius:2px;background:var(--c-chk);box-shadow:0 0 8px 2px var(--c-glow);opacity:0;pointer-events:none}
@media (prefers-reduced-motion:no-preference){.tb-sample[data-kind="check"] .j-bad.tb-scan::before{animation:tb-scan 1.4s cubic-bezier(.45,0,.55,1)}}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.tb-item:hover .tb-sample[data-kind="check"] .j-bad::before{animation:tb-scan 1.4s cubic-bezier(.45,0,.55,1)}}
@keyframes tb-scan{0%{opacity:0;translate:0}8%{opacity:1}50%{translate:calc(var(--tb-dir, 1) * var(--tb-w, 120px))}92%{opacity:1}100%{opacity:0;translate:0}}
[dir="rtl"] .tb-sample[data-kind="check"] .j-bad{--tb-dir:-1}
.tb-qr .m{transition:opacity .06s}

@media (hover:hover) and (prefers-reduced-motion:no-preference){.x-js .x-anim{cursor:pointer}}

:is(.x-q,.x-a,.x-ln){transform-box:fill-box}
.x-q{transform-origin:20% 100%}.x-a{transform-origin:70% 100%}.x-ln{transform-origin:left center}
@media (prefers-reduced-motion:no-preference){
  .x-js .x-anim:not(.x-play) :is(.x-q,.x-a){opacity:0}
  .x-js .x-anim:not(.x-play) .x-ln{transform:scaleX(0)}
}
#faq .x-play .x-q{animation:x-bubble .6s cubic-bezier(.16,1,.3,1) .1s both}
#faq .x-play .x-a{animation:x-rise .65s cubic-bezier(.16,1,.3,1) .6s both}
#faq .x-play .x-ln{animation:x-grow .45s cubic-bezier(.16,1,.3,1) calc(1s + var(--i) * .1s) both}
#faq .x-play .x-tick{animation:x-pop .45s cubic-bezier(.16,1,.3,1) 1.45s both}
@keyframes x-bubble{from{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.04)}to{opacity:1;transform:none}}

.x-js .x-anim{cursor:auto}

.guide .jg .j-name .ico{top:18px}

.guide .faq details p,.guide .tq>p{margin:0;padding-bottom:22px}

.guide .tq>summary{padding:20px 0;font-size:18px}
.guide .tq>summary .ico{width:30px;height:30px;padding:6px;margin:0;border:1.5px solid var(--brand-line);border-radius:50%;color:var(--brand-ink);transition:transform .2s cubic-bezier(.2,.8,.2,1),background-color .15s}
.guide .tq>summary:hover .ico{background:var(--brand-soft)}
.guide .tq[open]>summary{color:var(--brand-ink)}
.guide .tq[open]>summary .ico{transform:rotate(180deg);background:var(--brand-fill);border-color:var(--brand-fill);color:var(--on-brand)}
.guide .faq details[open] summary .ico{transform:rotate(180deg)}
.tech-list{border-top:0}

@media (prefers-reduced-motion:no-preference){
  .x-js .rv{transition:opacity .75s cubic-bezier(.16,1,.3,1) calc(var(--rv,0) * 70ms),transform .75s cubic-bezier(.16,1,.3,1) calc(var(--rv,0) * 70ms)}
  .x-js .rv:not(.rv-in){opacity:0;transform:translateY(14px)}
}

[data-tool="card"] main>section.band:first-child .tray{background:var(--slab);padding:16px 16px 0;overflow:hidden}
[data-tool="card"] main>section.band:first-child .tray #result{margin:16px -16px 0;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent}
[data-tool="card"][data-theme="dark"] main>section.band:first-child .tray{background:#272b48}
@media (max-width:640px){[data-tool="card"] main>section.band:first-child .tray{padding:10px 10px 0}
  [data-tool="card"] main>section.band:first-child .tray #result{margin:12px -10px 0}}

[data-tool="card-grey"] main>section.band:first-child .tray{background:var(--slab);padding:0;overflow:hidden}
[data-tool="card-grey"] main>section.band:first-child .tray .recipe{margin:0;padding:14px 16px;background:#f2f3f9}
[data-tool="card-grey"] main>section.band:first-child .tray #result{margin:0;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent}
[data-tool="card-grey"][data-theme="dark"] main>section.band:first-child .tray{background:#272b48}
[data-tool="card-grey"][data-theme="dark"] main>section.band:first-child .tray .recipe{background:#1f2340}
@media (max-width:640px){[data-tool="card-grey"] main>section.band:first-child .tray .recipe{padding:10px}}

[data-tool^="card"] main>section.band:first-child .tray{box-shadow:0 10px 24px -14px rgb(10 14 50 / .5)}
[data-tool^="card"] main>section.band:first-child .after{margin-top:18px}
[data-tool^="card"][data-theme="dark"] main>section.band:first-child .tray{background:#2f355e;box-shadow:none;outline:1px solid rgb(255 255 255 / .07);outline-offset:-1px;
  --slab:#252a4b;--sunk:#22274a;--line:#41477a;--line-strong:#525994}
[data-tool="card-grey"][data-theme="dark"] main>section.band:first-child .tray .recipe{background:#2a3058}
[data-tool^="card"][data-theme="dark"] main>section.band:first-child .tray #result{border-top-color:#41477a}

.ts-demo{position:fixed;inset-inline-start:12px;bottom:12px;z-index:61;display:flex;gap:4px;align-items:center;padding:6px 8px;border:1px solid var(--line-strong);border-radius:10px;background:var(--slab);font:13px var(--ui);color:var(--muted);box-shadow:0 8px 24px -10px rgb(0 0 0 / .3)}
.ts-demo button,.ts-demo a{padding:4px 9px;border:0;border-radius:6px;background:none;color:var(--ink-2);font:inherit;text-decoration:none;cursor:pointer}
.ts-demo [aria-pressed="true"]{background:var(--brand-fill);color:var(--on-brand)}

.guide details.snap::details-content{transition:none}

.hs-art{grid-column:2;grid-row:1 / span 3;align-self:center;justify-self:center;width:100%;max-width:400px;margin:0}
.hs-art svg{display:block;width:100%;height:auto}
@media (max-width:999px){.hs-art{grid-column:1;grid-row:auto;max-width:320px;margin:4px auto 22px}}
.sg-n{stroke:#1f2235}
:root[data-theme="dark"] .sg-n{stroke:#eceef3}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sg-n{stroke:#eceef3}}
.sg-needle{transform-box:view-box;transform-origin:160px 150px;transform:rotate(-24deg)}
@media (prefers-reduced-motion:no-preference){
  .x-js .hs-art:not(.x-play) .sg-needle{transform:rotate(-180deg)}
  .x-js .hs-art:not(.x-play) .sg-pw{opacity:0}
}
.x-play .sg-needle{animation:sg-sweep 1.1s cubic-bezier(.34,1.3,.5,1) .2s both}
@keyframes sg-sweep{from{transform:rotate(-180deg)}to{transform:rotate(-24deg)}}
.x-play .sg-pw{animation:x-rise .55s cubic-bezier(.16,1,.3,1) .9s both}

:root{--dk-text:#8b96d4;--dk-dot:#5c6bc0;--dk-btn:#3F51B5;--dk-part:#3F51B5}
:root[data-theme="dark"]{--dk-text:#6f7bbd;--dk-dot:#8f9be0;--dk-btn:#4a5fd0;--dk-part:#82b1ff}
:root[data-theme] .guide svg rect.a-ink{fill:var(--dk-text)}
:root[data-theme] .guide svg circle.a-ink{fill:var(--dk-dot)}
:root[data-theme] .guide svg .a-btn{fill:var(--dk-btn)}
:root[data-theme] .guide svg .p-hole{fill:var(--dk-text);opacity:1}
:root[data-theme] .guide svg :is(.p-lockl,.sg-n,.wf-ant){stroke:var(--dk-part)}
:root[data-theme] .guide svg .ck-lens [stroke="#1f2235"]{stroke:var(--dk-part)}
:root[data-theme] .guide svg :is(.p-try,.p-bad,.u-bad,.ck-bad,.n-try,.x-cut) [stroke="#1f2235"]{stroke:#fff}
:root[data-theme] .guide svg text[fill="#1f2235"]{fill:#fff}
:root[data-theme] .guide .th-flower .th-tile{color:#fff}

@media (max-width:999px){.guide #phone .x-pw text{font-size:13px}}

.guide>section{content-visibility:auto;contain-intrinsic-size:auto 900px}

[dir="rtl"] svg text{direction:ltr;unicode-bidi:isolate}

@media (min-width:1000px){
  .guide section.rev .hs-top>*{grid-column:2}
  .guide section.rev .hs-top>.hs-art{grid-column:1}
  .guide section#faq.rev{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
  .guide section#faq.rev>details{grid-column:1}
  .guide section#faq.rev>.g-faq-art{grid-column:2}
}:is(.p-ptr,.p-hl,.p-old,.p-new,.p-seg,.p-try,.p-lock,.p-ok,.p-db,.p-out,.p-bad,.p-tr,.p-weak,.p-w,.p-bub,.p-wal,.p-glow,.p-globe,.p-tile,.p-die,.p-row,.p-arrow,.p-word,.p-caret){transform-box:fill-box}
:is(.p-ptr,.p-old,.p-new,.p-try,.p-lock,.p-ok,.p-bad,.p-globe,.p-tile,.p-die,.p-glow){transform-origin:center}
.p-seg{transform-origin:left center}
.p-bub{transform-origin:0 100%}
.p-old,.p-hl{opacity:0}
.p-weak{fill:var(--s-weak)}
.p-hole{fill:#1f2235;opacity:.85}
:root[data-theme="dark"] .p-hole{fill:#0f1013}
:root[data-theme="dark"] .p-tl{fill:#82b1ff}
.p-lockl{stroke:#1f2235}
:root[data-theme="dark"] .p-lockl{stroke:#5b6070}
:root[data-theme="dark"] .p-hl,:root[data-theme="dark"] .p-row{fill:#6b5212}
@media (prefers-reduced-motion:no-preference){
  .x-js .x-anim:not(.x-play) :is(.p-new,.p-try,.p-lock,.p-ok,.p-bad,.p-w,.p-tile,.p-die,.p-row,.p-arrow,.p-word){opacity:0}
  .x-js .x-anim:not(.x-play) .p-old{opacity:1}
  .x-js .x-anim:not(.x-play) .p-ptr{opacity:0}
  .x-js .x-anim:not(.x-play) .p-seg{transform:scaleX(0)}
  .x-js .x-anim:not(.x-play) .p-out{opacity:0;transform:translateY(30px)}
  .x-js .x-anim:not(.x-play) .p-bub{opacity:0;transform:scale(.6)}
  .x-js .x-anim:not(.x-play) .p-wal{opacity:0;transform:translateY(24px)}
  .x-js .x-anim:not(.x-play) .p-glow{opacity:0}
}
@keyframes pp-flipout{from{opacity:1;transform:none}to{opacity:0;transform:scaleY(0)}}
@keyframes pp-flipin{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:none}}
@keyframes pp-hl{0%{opacity:0}15%{opacity:1}70%{opacity:1}100%{opacity:0}}
@keyframes pp-up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@keyframes pp-drop{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
@keyframes pp-flicker{0%,100%{opacity:1}25%,75%{opacity:.25}50%{opacity:1}}
@keyframes pp-glow{0%{opacity:0}40%{opacity:1}65%{opacity:.6}100%{opacity:1}}
.x-play .p-seg{animation:x-grow .45s cubic-bezier(.16,1,.3,1) calc(var(--d,1.25s) + var(--i) * .1s) both}

.x-play .p-ptr{animation:x-ptr-in .6s cubic-bezier(.16,1,.3,1) both,x-press .2s ease-out .62s}
.x-play .p-hl{animation:pp-hl 1.2s ease-out .66s both}
.x-play .p-old{animation:pp-flipout .16s ease-in .72s both}
.x-play .p-new{animation:pp-flipin .26s cubic-bezier(.16,1,.3,1) .88s both}

.x-play .p-try{animation:x-pop .4s cubic-bezier(.16,1,.3,1) calc(.2s + var(--i) * .32s) both}
.x-play .p-lock{animation:x-pop .4s cubic-bezier(.16,1,.3,1) .9s both}
.x-play .p-ok{animation:x-pop .45s cubic-bezier(.16,1,.3,1) 1.2s both}
.x-play .p-db{animation:x-shake .5s cubic-bezier(.36,.07,.19,.97) 1.55s}
.x-play .p-out{animation:pp-up .6s cubic-bezier(.16,1,.3,1) 1.8s both}
.x-play .p-bad{animation:x-pop .45s cubic-bezier(.16,1,.3,1) 2.2s both}

.x-play .p-tr{animation:x-shake .5s cubic-bezier(.36,.07,.19,.97) .2s}
.x-play .p-weak{animation:pp-flicker .7s ease-in-out .25s}
.x-play .p-w{animation:pp-drop .35s cubic-bezier(.16,1,.3,1) calc(.75s + var(--i) * .11s) both}
#xkcd .p-seg{--d:1.5s}

.x-play .p-bub{animation:x-bubble .6s cubic-bezier(.16,1,.3,1) .1s both}
.x-play .p-wal{animation:pp-up .7s cubic-bezier(.16,1,.3,1) .5s both}
.x-play .p-glow{animation:pp-glow 1.4s ease-out 1.05s both}

.x-play .p-globe{animation:x-glow .5s ease-out .05s}
.x-play .p-tile{animation:x-pop .45s cubic-bezier(.16,1,.3,1) calc(.25s + var(--i) * .13s) both}

.x-play .p-die{animation:x-tumble .8s cubic-bezier(.16,1,.3,1) calc(.15s + var(--i) * .12s) both}
.x-play .p-row{animation:x-fade .3s ease-out 1.05s both}
.x-play .p-arrow{animation:x-slide .45s cubic-bezier(.16,1,.3,1) 1.3s both}
.x-play .p-word{animation:x-rise .5s cubic-bezier(.16,1,.3,1) 1.6s both}
.x-play .p-caret{animation:x-blink 1s steps(1) 2.1s 2}

.guide ol.pp-ladder{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) max-content;column-gap:28px;margin:26px 0 32px;padding:6px 28px;border:1px solid var(--line);border-radius:14px;background:var(--slab);box-shadow:0 1px 2px rgb(31 34 53 / .06),0 18px 40px -18px rgb(31 34 53 / .28)}
.guide ol.pp-ladder li{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;align-items:center;row-gap:3px;margin:0;padding:16px 0;border-bottom:1px solid var(--line)}
.guide ol.pp-ladder li:last-child{border-bottom:0}
.pp-ladder .ld-ph{grid-column:1;grid-row:1;font-size:19px;color:var(--ink)}
.pp-ladder .ld-ph b{font-weight:700;color:var(--brand-ink)}
.pp-ladder .ld-for{grid-column:1;grid-row:2;flex:none;font-size:15px;color:var(--muted)}
.pp-ladder .ld-t{grid-column:3;grid-row:1 / span 2;font-family:"PG Bold",var(--ui);font-weight:700;font-size:17px;text-align:end}
.pp-ladder .ld-t::before{display:none}
.pp-ladder li::before,.pp-ladder li::after{content:"";grid-column:2;grid-row:1 / span 2;align-self:center;height:12px;border-radius:6px}
.pp-ladder li::before{background:var(--s-empty)}
.pp-ladder li::after{justify-self:start;width:var(--w);background:var(--c)}
.pp-ladder li.lv-1{--c:var(--s-weak)}.pp-ladder li.lv-2{--c:#ffb300}.pp-ladder li.lv-3{--c:var(--s-strong)}.pp-ladder li.lv-4{--c:var(--s-vstrong)}
.pp-ladder li:nth-child(1){--w:7%;--k:0}.pp-ladder li:nth-child(2){--w:25%;--k:1}.pp-ladder li:nth-child(3){--w:44%;--k:2}
.pp-ladder li:nth-child(4){--w:62%;--k:3}.pp-ladder li:nth-child(5){--w:81%;--k:4}.pp-ladder li:nth-child(6){--w:100%;--k:5}
@keyframes pp-fill{from{width:0}}
@media (prefers-reduced-motion:no-preference){
  .x-js .pp-ladder:not(.x-play) li::after{width:0}
  .x-play.pp-ladder li::after{animation:pp-fill .9s cubic-bezier(.16,1,.3,1) calc(.15s + var(--k) * .12s) both}
}
@media (max-width:640px){
  .guide ol.pp-ladder{grid-template-columns:minmax(0,1fr) max-content;column-gap:14px;padding:4px 16px}
  .guide ol.pp-ladder li{row-gap:6px;padding:14px 0}
  .pp-ladder .ld-ph{grid-column:1 / -1;font-size:17px}
  .pp-ladder li::before,.pp-ladder li::after{grid-column:1;grid-row:2;height:10px}
  .pp-ladder .ld-t{grid-column:2;grid-row:2;font-size:15px}
  .pp-ladder .ld-for{grid-column:1 / -1;grid-row:3;font-size:14px}
}

.guide table.pp-lists{width:100%;table-layout:auto}
.guide table.pp-lists :is(th,td){white-space:normal;vertical-align:top}
.guide table.pp-lists td:nth-child(2){white-space:nowrap;font-variant-numeric:tabular-nums;text-align:end;padding-inline-end:18px}
.guide table.pp-lists th:nth-child(2){text-align:end;padding-inline-end:18px}
.guide table.pp-lists td:nth-child(3){color:var(--ink-2);font-size:15px;overflow-wrap:anywhere}
.guide table.pp-lists .lic{white-space:nowrap}
@media (max-width:640px){
  .guide table.pp-lists thead{display:none}
  .guide table.pp-lists tr{display:grid;grid-template-columns:minmax(0,1fr) max-content;column-gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
  .guide table.pp-lists td{display:block;padding:0;border:0}
  .guide table.pp-lists td:nth-child(2){padding:0}
  .guide table.pp-lists td:nth-child(3){grid-column:1 / -1;margin-top:3px;font-size:14px}
}main>section.band:first-child{background:#3F51B5;border-bottom:0}
main>section.band:first-child .band-in{padding-bottom:56px}
main>section.band:first-child h1{color:#fff;font-family:"PG Bold",var(--ui);font-weight:700}
main>section.band:first-child .title,main>section.band:first-child .title *:not(a){color:#fff}
main>section.band:first-child .after .link-btn{color:#fff}
main>section.band:first-child .after .link-btn:hover{background:rgb(255 255 255 / .14)}
main>section.band:first-child .after{margin-top:18px}
main>section.band:first-child>.band-in>.check-private,main>section.band:first-child>.band-in>p{color:rgb(255 255 255 / .9)}
main>section.band:first-child>.band-in>.check-private a,main>section.band:first-child>.band-in>p a{color:#fff}
main>section.band:first-child>.band-in>.check-private .ico{color:#fff}
:root[data-theme="dark"] main>section.band:first-child{background:#1a1c26}
:root[data-theme="dark"] .top{--band:#1a1c26;--line:rgb(255 255 255 / .1);border-bottom-color:transparent}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) main>section.band:first-child{background:#1a1c26}
  :root:not([data-theme="light"]) .top{--band:#1a1c26;--line:rgb(255 255 255 / .1);border-bottom-color:transparent}
}

main>section.band:first-child>.band-in>.slab,main>section.band:first-child .bulk .slab{border-color:transparent;box-shadow:0 10px 24px -14px rgb(10 14 50 / .5)}

.tray{margin-top:20px;border-radius:20px;background:var(--slab);overflow:hidden;box-shadow:0 10px 24px -14px rgb(10 14 50 / .5)}
.tray>.recipe{margin:0;padding:14px 16px;background:#f2f3f9}
.tray>.recipe+.recipe{padding-top:0}
.tray>.slab{margin:0;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent}
:root[data-theme="dark"] .tray{background:#232633;box-shadow:none;outline:1px solid rgb(255 255 255 / .07);outline-offset:-1px;--slab:#1c1e29;--sunk:#191b25;--line:#363a4c;--line-strong:#484c62}
:root[data-theme="dark"] .tray>.recipe{background:#1f212d}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .tray{background:#232633;box-shadow:none;outline:1px solid rgb(255 255 255 / .07);outline-offset:-1px;--slab:#1c1e29;--sunk:#191b25;--line:#363a4c;--line-strong:#484c62}
  :root:not([data-theme="light"]) .tray>.recipe{background:#1f212d}
}
@media (max-width:640px){.tray{margin-inline:-6px;border-radius:16px}.tray>.recipe{padding:10px}}

main>section.band:first-child :is(.chip,.link-btn,.btn,a):focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 5px #1a237e}
main>section.band:first-child :is(.tray,.slab,.bulk) :is(.chip,.btn,a,button):focus-visible{outline:2px solid #3F51B5;box-shadow:none}   
:root[data-theme="dark"] main>section.band:first-child :is(.tray,.slab,.bulk) :is(.chip,.btn,a,button):focus-visible,:root[data-theme="dark"] main>section.band:first-child #result :is(.btn,a):focus-visible{outline-color:var(--brand-ink)}   
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) main>section.band:first-child :is(.tray,.slab,.bulk) :is(.chip,.btn,a,button):focus-visible,:root:not([data-theme="light"]) main>section.band:first-child #result :is(.btn,a):focus-visible{outline-color:var(--brand-ink)}}

.foot{--band:#1f2235;--line:#33363f;--line-strong:#4d515e;--ink:#eceef3;--ink-2:#c6c9d4;--muted:#a3a7b6;--brand-ink:#9fb4ff;--slab:#2b2f4a;color:var(--muted);border-top:0}
.foot .brand{color:var(--ink)}
:root[data-theme="dark"] .foot{--band:#0d0e15;--slab:#212330;--line:#292b38;--line-strong:#40435a}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .foot{--band:#0d0e15;--slab:#212330;--line:#292b38;--line-strong:#40435a}}

main>section.band:first-child .check-slab:focus-within{border-color:transparent;box-shadow:0 10px 24px -14px rgb(10 14 50 / .5)}
main>section.band:first-child .check-slab .check-input:focus,main>section.band:first-child .check-slab .check-input:focus-visible{outline:none;box-shadow:none}
main>section.band:first-child .check-slab>.check-in{transition:background-color .2s}
main>section.band:first-child .check-slab:focus-within>.check-in{background:#f3f5fd}
:root[data-theme="dark"] main>section.band:first-child .check-slab:focus-within{border-color:rgb(255 255 255 / .07)}
:root[data-theme="dark"] main>section.band:first-child .check-slab:focus-within>.check-in{background:#272b3c}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) main>section.band:first-child .check-slab:focus-within{border-color:rgb(255 255 255 / .07)}
  :root:not([data-theme="light"]) main>section.band:first-child .check-slab:focus-within>.check-in{background:#272b3c}}

:root{--head:#3F51B5}
:root[data-theme="dark"]{--head:var(--ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--head:var(--ink)}}
main .guide h2,main .tools-band>h2{color:var(--head)}

dialog.qr-full{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#0f1124;color:#fff;overflow:auto}
dialog.qr-full[open]{display:block}
dialog.qr-full::backdrop{background:#0f1124}
.qf-in{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,3vh,28px);width:100%;min-height:100%;padding:72px 20px 24px;box-sizing:border-box;text-align:center}
.qf-code canvas[hidden],.qf-img[hidden]{display:none}
.qf-code canvas,.qf-code .qf-img{display:block;width:min(86vw,calc(100dvh - 330px),560px);min-width:160px;height:auto;aspect-ratio:1;border-radius:16px;background:#fff;image-rendering:pixelated}
.qf-info{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0;max-width:min(560px,100%)}
.qf-cap{margin:0;font-size:clamp(16px,2.4vh,20px);line-height:1.4;color:#c9cdea}
.qf-cap.qr-problem{color:#ffd166}
.qf-pw{margin:0;max-width:100%;font-family:var(--mono);font-size:clamp(19px,3.2vh,30px);letter-spacing:.04em;overflow-wrap:anywhere}
.qf-wifi{display:inline-flex;align-items:center;gap:10px;margin-top:8px;padding:11px 18px;border:1px solid rgb(255 255 255 / .3);border-radius:999px;color:#fff;font-size:16px;text-decoration:none;transition:background-color .15s,border-color .15s}
.qf-wifi:hover{background:rgb(255 255 255 / .1);border-color:rgb(255 255 255 / .55)}
.qf-wifi:focus-visible{outline:3px solid #fff;outline-offset:2px}
.qf-wifi[hidden]{display:none}
button.qf-wifi{background:none;font:inherit;font-size:16px;cursor:pointer}   
.qf-wifi .ico{flex:none;width:18px;height:18px}
.qf-wifi .qf-arr{width:16px;height:16px}
[dir="rtl"] .qf-wifi .qf-arr{transform:scaleX(-1)}
.qf-x{position:fixed;top:16px;inset-inline-end:16px;display:grid;place-items:center;width:48px;height:48px;border:0;border-radius:50%;background:rgb(255 255 255 / .12);color:#fff;cursor:pointer}
.qf-x:hover{background:rgb(255 255 255 / .22)}
.qf-x:focus-visible{outline:3px solid #fff;outline-offset:2px}
.qf-x .ico{width:22px;height:22px}
@media (orientation:landscape) and (min-width:700px){
  .qf-in{flex-direction:row;gap:clamp(28px,5vw,72px);padding:56px 48px 40px}
  .qf-code canvas{width:min(calc(100dvh - 96px),52vw,640px)}
  .qf-info{align-items:flex-start;text-align:start;max-width:40vw}
  .qf-pw{font-size:clamp(20px,3.6vh,34px)}
}
@media (prefers-reduced-motion:no-preference){dialog.qr-full[open] .qf-in{animation:qf-in .35s cubic-bezier(.16,1,.3,1)}}
@keyframes qf-in{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:none}}#pop-ttc .ttc-body,#pop-ttc .ttc-more{display:none}
#pop-ttc.pop-info{width:min(380px,calc(100vw - 24px))}

#pop-ttc.pop-info{width:max-content;min-width:min(380px,calc(100vw - 24px));max-width:calc(100vw - 24px)}
#pop-ttc :is(.t2-lead,.t2-p,.t2-note,.t2-h,.t2-site,.t2-free,.ttc-more){contain:inline-size}
#pop-ttc .t2-row{grid-template-columns:10px minmax(40%,1fr) minmax(0,max-content)}
#pop-ttc .t2-row span,#pop-ttc .t2-row b{white-space:normal;min-width:0;overflow-wrap:anywhere}
#pop-ttc .t2-tag{max-width:100%;box-sizing:border-box;white-space:normal;text-align:center}
.t2-lead{margin:0 0 6px;font-size:14px;color:var(--muted);text-wrap:pretty}
@media (max-width:860px){.t2-lead::before{content:'';float:inline-end;width:30px;height:20px}}
.t2-lead+.t2-rows{margin-top:0}
.t2-title{margin:0 0 12px;font-weight:700;font-size:16px;color:var(--ink);padding-inline-end:30px}
.t2-grp+.t2-grp{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.t2-h{margin:0 0 2px;font-size:13px;font-weight:700;color:var(--muted);letter-spacing:.02em}
.t2-p{margin:0;font-size:14px;line-height:1.45;color:var(--ink-2,var(--ink))}
.t2-rows{list-style:none;margin:8px 0 0;padding:0}
.t2-row{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:10px;padding:5px 8px;margin:0 -8px;border-radius:8px;font-size:14px}
.t2-row i{width:10px;height:10px;border-radius:50%;background:var(--s-empty)}
.t2-row[data-l="1"] i{background:var(--s-weak)}
.t2-row[data-l="2"] i{background:var(--t2-fair)}
.t2-row[data-l="3"] i{background:var(--s-strong)}
.t2-row[data-l="4"] i{background:var(--s-vstrong)}
.t2-row b{font-weight:700;font-variant-numeric:tabular-nums;text-align:end}
.t2-row span{white-space:nowrap}
.t2-row.main{background:var(--brand-soft,var(--sunk))}
.t2-row.web b{font-weight:400;color:var(--muted)}
.t2-row.web i{background:transparent;border:1.5px solid var(--box)}
.t2-free{margin:10px 0 0}
.t2-free+.t2-rows{margin-top:4px}
.t2-note{margin:8px 0 0;font-size:12.5px;line-height:1.4;color:var(--muted)}
.t2-site{margin-top:10px;font-size:13px;text-wrap:pretty}
.t2-how{display:inline-flex;align-items:center;gap:6px;min-height:24px;margin-top:12px;font-size:14px;font-weight:700}
.t2-how .ico{width:16px;height:16px}

#t2-box[hidden]{display:none}
html body .check-slab #t2-box{grid-column:2;grid-row:4;margin:2px 24px 22px 0;max-width:460px}
html body .check-slab>.breach{grid-row:5}
@media (max-width:860px){html body .check-slab #t2-box{grid-column:1 / -1;margin:4px 16px 18px;max-width:none}}

:root{--t2-fair:#e29a00}
:root[data-theme="dark"]{--t2-fair:#ffb300}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--t2-fair:#ffb300}}

.guide .t2-card{margin:0 0 20px;padding:4px 12px;border:1px solid var(--line);border-radius:14px;background:var(--slab);box-shadow:0 1px 2px rgb(31 34 53 / .06),0 18px 40px -18px rgb(31 34 53 / .28)}
:root[data-theme="dark"] .guide .t2-card{box-shadow:0 1px 2px rgb(0 0 0 / .3),0 18px 40px -18px rgb(0 0 0 / .6)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .guide .t2-card{box-shadow:0 1px 2px rgb(0 0 0 / .3),0 18px 40px -18px rgb(0 0 0 / .6)}}
.guide section>p+.t2-card,.guide .hs-top+.t2-card{margin-top:16px}
.guide .t2-card .tbl{width:100%;margin:0;table-layout:fixed}
.t2-tbl col.t2-c1{width:36%}
.t2-tbl th{font-size:13px;font-weight:400;color:var(--muted);padding:14px 12px 10px}
.t2-tbl td{padding:12px;vertical-align:middle;font-variant-numeric:tabular-nums}
.t2-tbl tbody tr:last-child td{border-bottom:0}
.t2-tbl .t2-who{display:flex;align-items:center;gap:12px}
.t2-tbl .t2-who b{display:block;font-family:"PG Bold",var(--ui);font-weight:700;color:var(--ink);font-size:15px}
.t2-tbl .t2-who small{display:block;font-size:13px;color:var(--muted)}
.t2-ico{flex:none;width:30px;height:30px;padding:5px;border-radius:9px;background:var(--brand-soft);color:var(--brand-ink)}
.t2-tbl tr.main td{background:var(--brand-soft);border-bottom-color:transparent}
.t2-tbl tr:has(+tr.main) td{border-bottom-color:transparent}
.t2-tbl tr.main td:first-child{border-start-start-radius:10px;border-end-start-radius:10px}
.t2-tbl tr.main td:last-child{border-start-end-radius:10px;border-end-end-radius:10px}
.t2-tbl tr.main .t2-ico{background:var(--slab)}
.t2-tbl .lv{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:var(--ink)}
.t2-tbl .lv i{flex:none;width:10px;height:10px;border-radius:50%;background:var(--s-empty)}
.t2-tbl [data-l="1"] i{background:var(--s-weak)}
.t2-tbl [data-l="2"] i{background:var(--t2-fair)}
.t2-tbl [data-l="3"] i{background:var(--s-strong)}
.t2-tbl [data-l="4"] i{background:var(--s-vstrong)}
.t2-blk{color:var(--muted);font-size:15px}
.guide .t2-card .t2-foot{max-width:none;margin:0 -12px;padding:12px 24px 14px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.guide .t2-more{display:inline-flex;align-items:center;gap:8px;font-weight:700}
.guide .t2-more .ico{width:18px;height:18px}

.guide #levels .t2-top{margin-bottom:28px}
.guide #levels .t2-top>p{margin-bottom:6px}
.guide #levels .t2-top>.hs-art{grid-row:1 / span 2;max-width:380px}
.guide .t2-key{list-style:none;grid-column:1;margin:0;padding:0;max-width:none;border-top:1px solid var(--line)}
.guide .t2-key li{display:grid;grid-template-columns:auto auto 1fr;column-gap:14px;row-gap:2px;align-items:center;margin:0;padding:12px 0;border-bottom:1px solid var(--line)}
.t2-key .meter{grid-column:1;grid-row:1 / span 2}
.t2-key .meter i{width:16px}
.guide .meter[data-l="2"] i:nth-child(-n+2),.guide .t2-key .meter[data-l="2"] i:nth-child(-n+2){background:var(--t2-fair)}
.t2-key b{font-family:"PG Bold",var(--ui);font-weight:700;font-size:16px;color:var(--ink)}
.t2-key b{grid-column:2;grid-row:1}
.t2-key .t2-th{grid-column:3;grid-row:1;font-size:15px;color:var(--muted)}
.t2-key .t2-do{grid-column:2 / -1;grid-row:2;font-size:15px;color:var(--ink-2,var(--ink))}
.t2-gauge .t2-a1{stroke:var(--s-weak)}.t2-gauge .t2-a2{stroke:var(--t2-fair)}.t2-gauge .t2-a3{stroke:var(--s-strong)}.t2-gauge .t2-a4{stroke:var(--s-vstrong)}
[dir="rtl"] .t2-gauge svg{transform:scaleX(-1)}
.guide #levels .t2-in{margin:0 0 0}
.guide .t2-h3{margin:40px 0 12px;font-family:"PG Bold",var(--ui);font-weight:700;font-size:22px;color:var(--ink)}
.guide .t2-h3+.tech-list{margin-top:0}

.check-slab .breach:not([data-state="error"])>#breach-btn{display:none}

@media (min-width:1000px){.guide #looks-for.g-feat>.g-scene{align-self:start;position:sticky;top:120px;margin-top:40px}}
.guide #looks-for.g-feat ul.verdicts{grid-template-columns:minmax(0,1fr) max-content;column-gap:14px;padding:4px 22px}

.guide #looks-for.g-feat ul.verdicts li{row-gap:4px;padding:13px 0}
.guide #looks-for.g-feat .verdicts code{font-size:18px}
.guide #looks-for.g-feat .vd-why{grid-column:1 / -1;font-size:15px;color:var(--ink-2,var(--ink))}

@media (max-width:640px){
  .guide .t2-card{padding:4px 6px}
  .guide .t2-card .t2-foot{margin:0 -6px;padding:12px 16px 14px}
  .t2-tbl,.t2-tbl tbody{display:block}
  .t2-tbl thead,.t2-tbl colgroup{display:none}
  .t2-tbl tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 10px;padding:12px 10px;border-bottom:1px solid var(--line)}
  .t2-tbl tbody tr:last-child{border-bottom:0}
  .t2-tbl tr.main{border-radius:10px;border-bottom-color:transparent;background:var(--brand-soft)}
  .t2-tbl td{display:block;padding:0;border:0;background:none!important;border-radius:0!important}
  .t2-tbl td.t2-who,.t2-tbl td[colspan]{grid-column:1 / -1}
  .t2-tbl .t2-who{gap:10px}
  .t2-tbl .t2-who small{display:none}
  .t2-ico{width:28px;height:28px;padding:4px}
  .t2-tbl td[data-h]::before{content:attr(data-h);display:block;margin-bottom:2px;font-size:12px;color:var(--muted)}
  .t2-tbl .lv{font-size:14px;align-items:baseline;gap:6px;text-wrap:balance}
  .t2-tbl .lv i{width:8px;height:8px}
  .t2-blk{font-size:14px}
  .guide #levels .t2-top>.hs-art{max-width:260px}
}
@media (max-width:420px){
  .t2-key .meter{grid-row:1 / span 3;align-self:start;margin-top:8px}
  .t2-key .t2-th{grid-column:2 / -1;grid-row:2}
  .t2-key .t2-do{grid-row:3}
}

#looks-for :is(.lf-seg,.lf-ok,.lf-x,.lf-back,.lf-front,.lf-hit){transform-box:fill-box}
#looks-for .lf-seg{transform-origin:left center}
#looks-for :is(.lf-ok,.lf-x,.lf-hit){transform-origin:center}
#looks-for .lf-term{fill:#1f2235}
:root[data-theme="dark"] #looks-for .lf-term{fill:#15161e}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) #looks-for .lf-term{fill:#15161e}}
#looks-for :is(.lf-good,.lf-ok){opacity:0}
@media (prefers-reduced-motion:no-preference){
  .x-js #looks-for .x-anim:not(.x-play) :is(.lf-front,.lf-ln,.lf-hit,.lf-redfield,.lf-bad,.lf-x){opacity:0}
}
#looks-for .x-play .lf-good{animation:lf-hold 2.75s linear both}
#looks-for .x-play .lf-ok{animation:lf-ok 2.75s linear both}
@keyframes lf-hold{0%{opacity:1}96%{opacity:1}100%{opacity:0}}
@keyframes lf-ok{0%{opacity:0;transform:scale(.3)}10%{opacity:1;transform:scale(1.12)}14%{transform:none}96%{opacity:1}100%{opacity:0}}
#looks-for .x-play .lf-seg{animation:x-grow .4s cubic-bezier(.16,1,.3,1) calc(.1s + var(--i) * .1s) both}
#looks-for .x-play .lf-front{animation:x-rise .6s cubic-bezier(.16,1,.3,1) .9s both}
#looks-for .x-play .lf-ln{animation:x-fade .12s ease-out calc(1.35s + var(--i) * .22s) both}
#looks-for .x-play .lf-hit{animation:x-pop .4s cubic-bezier(.16,1,.3,1) 2.25s both}
#looks-for .x-play .lf-redfield{animation:x-fade .2s ease-out 2.75s both}
#looks-for .x-play .lf-bad{animation:x-fade .2s ease-out 2.75s both}
#looks-for .x-play .lf-back{animation:x-shake .5s cubic-bezier(.36,.07,.19,.97) 2.75s}
#looks-for .x-play .lf-x{animation:x-pop .45s cubic-bezier(.16,1,.3,1) 2.8s both}

.guide ol.pw-ladder{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) max-content;column-gap:28px;margin:8px 0 32px;padding:6px 28px;border:1px solid var(--line);border-radius:14px;background:var(--slab);box-shadow:0 1px 2px rgb(31 34 53 / .06),0 18px 40px -18px rgb(31 34 53 / .28);list-style:none}
.guide ol.pw-ladder li{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;align-items:center;row-gap:3px;margin:0;padding:16px 0;border-bottom:1px solid var(--line)}
.guide ol.pw-ladder li:last-child{border-bottom:0}
.pw-ladder .ld-ph{grid-column:1;grid-row:1;font-family:"PG Bold",var(--ui);font-weight:700;font-size:19px;color:var(--ink)}
.pw-ladder .ld-for{grid-column:1;grid-row:2;font-size:15px;color:var(--muted)}
.pw-ladder .ld-t{grid-column:3;grid-row:1 / span 2;font-family:"PG Bold",var(--ui);font-weight:700;font-size:17px;text-align:end}
.pw-ladder .ld-t::before{display:none}
.pw-ladder li::before,.pw-ladder li::after{content:"";grid-column:2;grid-row:1 / span 2;align-self:center;height:12px;border-radius:6px}
.pw-ladder li::before{background:var(--s-empty)}
.pw-ladder li::after{justify-self:start;width:var(--w);background:var(--c)}
.pw-ladder li.lv-1{--c:var(--s-weak)}.pw-ladder li.lv-2{--c:#ffb300}.pw-ladder li.lv-3{--c:var(--s-strong)}.pw-ladder li.lv-4{--c:var(--s-vstrong)}
.pw-ladder li:nth-child(1){--w:83%;--k:0}.pw-ladder li:nth-child(2){--w:63%;--k:1}.pw-ladder li:nth-child(3){--w:50%;--k:2}
@keyframes pw-fill{from{width:0}}
@media (prefers-reduced-motion:no-preference){
  .x-js .pw-ladder:not(.x-play) li::after{width:0}
  .x-play.pw-ladder li::after{animation:pw-fill .9s cubic-bezier(.16,1,.3,1) calc(.15s + var(--k) * .12s) both}
}
@media (max-width:640px){
  .guide ol.pw-ladder{grid-template-columns:minmax(0,1fr) max-content;column-gap:14px;padding:4px 16px}
  .guide ol.pw-ladder li{row-gap:6px;padding:14px 0}
  .pw-ladder .ld-ph{grid-column:1 / -1;font-size:17px}
  .pw-ladder li::before,.pw-ladder li::after{grid-column:1;grid-row:2;height:10px}
  .pw-ladder .ld-t{grid-column:2;grid-row:2;font-size:15px}
  .pw-ladder .ld-for{grid-column:1 / -1;grid-row:3;font-size:14px}
}
@media (max-width:999px){#how-strong .hs-top>.hs-art{order:-1;margin:0 auto 18px}}
.t2-tag{display:inline-block;margin-inline-start:8px;padding:1px 8px;border-radius:999px;font-style:normal;font-size:12px;line-height:1.5;font-family:"PG Bold",var(--ui);font-weight:700;color:var(--brand-ink);background:var(--slab);border:1px solid var(--brand-line,var(--line-strong));vertical-align:2px;white-space:nowrap}
.t2-mini{display:inline-flex;gap:3px;margin-inline-start:8px;vertical-align:middle}
.t2-mini i{width:14px;height:4px;border-radius:2px}
.t2-head{margin:0 0 10px;font-size:16px;line-height:1.4}
.t2-head .t2-lv{font-family:"PG Bold",var(--ui);font-weight:700}
.t2-lv[data-l="1"]{color:var(--s-weak)}.t2-lv[data-l="2"]{color:var(--s-fair)}.t2-lv[data-l="3"]{color:var(--s-strong)}.t2-lv[data-l="4"]{color:var(--s-vstrong)}

.hs-who{margin:0 0 14px;padding:4px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--sunk)}
.hs-rows2{margin:0}
.hs-for{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0;padding:12px 0;border-bottom:1px solid var(--line-strong);font-size:15px}
.hs-for-l{color:var(--muted)}
.hs-for b{font-family:"PG Bold",var(--ui);font-weight:700;font-size:17px;color:var(--ink)}
.hs-kinds{display:inline-flex;gap:5px}
.hs-kinds i{font-style:normal;font-family:var(--mono);font-size:14px;line-height:1;padding:4px 7px;border:1px solid var(--line-strong);border-radius:6px;color:var(--ink-2);background:var(--slab)}
.hs-kinds i[hidden]{display:none}
.hs-rows2>div{display:grid;grid-template-columns:40px minmax(0,1fr) auto;column-gap:14px;row-gap:2px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line)}
.hs-ic{grid-row:1 / span 2;align-self:start;width:40px;height:28px;margin-top:-1px}
.hs-rows2 .hs-s{grid-column:2 / -1;margin:0;font-size:15px;color:var(--muted)}
@media (max-width:599px){.hs-rows2>div{grid-template-columns:40px minmax(0,1fr)}.hs-rows2>div>.hs-t{grid-column:2;text-align:start}.hs-rows2 .hs-s{grid-column:2}.hs-ic{grid-row:1 / span 3}}
.hs-rows2>div:last-child{border-bottom:0}
.hs-rows2 dt{font-weight:400;margin:0}
.hs-rows2 .hs-t{margin:0;font-family:"PG Bold",var(--ui);font-weight:700;white-space:nowrap;text-align:end}
.hs-top>.hs-who{grid-column:1}
@media (min-width:1000px){#how-strong .hs-top{align-items:start}#how-strong .hs-top>.hs-art{grid-row:1 / span 6;align-self:start;position:sticky;top:120px;margin-top:40px}}
@media (max-width:999px){#how-strong .hs-top>.hs-art{order:-1;margin:0 auto 18px}}
#how-strong .hw-lock{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){.x-js .x-anim:not(.x-play) :is(.hw-m,.hw-d){opacity:0}.x-js .x-anim:not(.x-play) .hw-p{stroke-dasharray:0 400}#how-strong .x-play .hw-m{animation:hw-up .7s cubic-bezier(.16,1,.3,1) calc(.15s + var(--i) * .25s) both}#how-strong .x-play .hw-d{animation:x-fade .3s ease-out calc(.55s + var(--i) * .25s) both,hw-march 1.2s linear calc(.55s + var(--i) * .25s) 2}#how-strong .x-play .hw-p{stroke-dasharray:0 400;animation:hw-crawl 2.4s cubic-bezier(.3,0,.2,1) calc(.6s + var(--i) * .25s) forwards}#how-strong .x-play .hw-sand{animation:hw-march .9s linear .6s 3}#how-strong .x-play .hw-lock{animation:x-glow .5s ease-out 1.9s}}
@keyframes hw-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes hw-march{to{stroke-dashoffset:-20}}
@keyframes hw-crawl{from{stroke-dasharray:0 400}to{stroke-dasharray:var(--w) 400}}
#how-strong .hw-g,#how-strong .hw-pl,#how-strong .hw-key{opacity:0}
#how-strong .hw-reel{transform-box:view-box}
#how-strong .hw-dots{opacity:0}
#how-strong .hw-shut{opacity:0}
#how-strong .hw-red{stroke:#e53935}
:root[data-theme="dark"] #how-strong .hw-red{stroke:#ff8a80}
#how-strong .hw-pl,#how-strong .hw-key{offset-rotate:0deg}
@media (prefers-reduced-motion:no-preference){.x-js .x-anim:not(.x-play) .hw-final{opacity:0}#how-strong .x-play .hw-g{animation:hw-flash var(--u) linear var(--t)}#how-strong .x-play .hw-final{animation:x-fade .3s ease-out 4.5s both}#how-strong .x-play .hw-pl{animation:hw-fly .7s cubic-bezier(.4,0,.6,1) calc(.9s + var(--i) * .23s) 5}.x-js #how-strong .x-anim:not(.x-play) .hw-reel{opacity:0}.x-js #how-strong .x-anim:not(.x-play) .hw-dots{opacity:1}#how-strong .x-play .hw-dots{opacity:0}#how-strong .x-play .hw-reel{animation:hw-spin .5s steps(8) calc(.7s + var(--k) * .32s) backwards}.x-js #how-strong .x-anim:not(.x-play) .hw-shut{opacity:1}.x-js #how-strong .x-anim:not(.x-play) .hw-open{opacity:0}#how-strong .x-play .hw-shut{animation:hw-show 4.3s linear}#how-strong .x-play .hw-open{animation:x-fade .25s ease-out 4.2s backwards}#how-strong .x-play .hw-odo{animation:hw-odo var(--s) steps(10) 1s var(--n) both}#how-strong .x-play .hw-key{animation:hw-key 1.1s cubic-bezier(.4,0,.6,1) calc(.9s + var(--i) * .35s + var(--j) * 1.25s)}#how-strong .x-play .hw-lock{animation:x-glow .5s ease-out 4.6s}}
@keyframes hw-flash{from,to{opacity:1}}
@keyframes hw-fly{0%{offset-distance:0%;opacity:0}15%{opacity:1}85%{opacity:1}100%{offset-distance:100%;opacity:0}}
@keyframes hw-spin{from{transform:translateY(176px)}to{transform:none}}
@keyframes hw-gone{to{opacity:0}}
@keyframes hw-show{from,to{opacity:1}}
@keyframes hw-odo{from{transform:none}to{transform:translateY(160px)}}
@keyframes hw-key{0%{offset-distance:0%;opacity:0;transform:none}12%{opacity:1}70%{offset-distance:100%;opacity:1;transform:none}82%{offset-distance:92%;transform:rotate(-30deg)}100%{offset-distance:92%;opacity:0;transform:translateY(26px) rotate(-70deg)}}
.hs-rows2>div[data-l="1"]{--c:var(--s-weak)}
.hs-rows2>div[data-l="2"]{--c:var(--t2-fair)}
.hs-rows2>div[data-l="3"]{--c:var(--s-strong)}
.hs-rows2>div[data-l="4"]{--c:var(--s-vstrong)}
.hs-rows2>div[data-l="1"]{--tc:#c62828}
.hs-rows2>div[data-l="2"]{--tc:#9a5b00}
.hs-rows2>div[data-l="3"]{--tc:#4e7d22}
.hs-rows2>div[data-l="4"]{--tc:#2e7d32}
:root[data-theme="dark"] .hs-rows2>div[data-l="1"]{--tc:#ef5350}
:root[data-theme="dark"] .hs-rows2>div[data-l="2"]{--tc:#ffb300}
:root[data-theme="dark"] .hs-rows2>div[data-l="3"]{--tc:#9CCC65}
:root[data-theme="dark"] .hs-rows2>div[data-l="4"]{--tc:#66bb6a}
.hs-rows2>div>.hs-t{color:var(--tc)}
.hs-rows2 dt{grid-column:2;grid-row:1}
.hs-rows2>div>.hs-t{grid-column:3;grid-row:1}
.hs-rows2 .hs-lv{grid-column:3;grid-row:2;justify-self:end}
.hs-rows2 .hs-s{grid-column:2;grid-row:2}
.hs-lv{margin:0;font-size:13px;color:var(--muted);white-space:nowrap}
.hs-rows2>div[data-l="1"] .hs-lv{color:var(--tc)}
@media (max-width:599px){.hs-rows2>div>.hs-t{grid-column:2;grid-row:2;text-align:start}.hs-rows2 .hs-lv{grid-column:2;grid-row:3;justify-self:start}.hs-rows2 .hs-s{grid-column:2;grid-row:4}}
.hs-rows2>div:has(.t2-tag){margin:0 -18px;padding:12px 18px;background:var(--brand-soft,var(--sunk));border-bottom:0}
.hs-rows2>div:has(+ div .t2-tag){border-bottom:0}
@media (min-width:1000px){#how-many .hs-top{align-items:start}#how-many .hs-top>.hs-art{grid-row:1 / span 6;align-self:start;position:sticky;top:120px;margin-top:40px}}
@media (max-width:999px){#how-many .hs-top>.hs-art{order:-1;margin:0 auto 18px}}
#how-many .hw-lock{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){.x-js .x-anim:not(.x-play) :is(.hw-m,.hw-d){opacity:0}.x-js .x-anim:not(.x-play) .hw-p{stroke-dasharray:0 400}#how-many .x-play .hw-m{animation:hw-up .7s cubic-bezier(.16,1,.3,1) calc(.15s + var(--i) * .25s) both}#how-many .x-play .hw-d{animation:x-fade .3s ease-out calc(.55s + var(--i) * .25s) both,hw-march 1.2s linear calc(.55s + var(--i) * .25s) 2}#how-many .x-play .hw-p{stroke-dasharray:0 400;animation:hw-crawl 2.4s cubic-bezier(.3,0,.2,1) calc(.6s + var(--i) * .25s) forwards}#how-many .x-play .hw-sand{animation:hw-march .9s linear .6s 3}#how-many .x-play .hw-lock{animation:x-glow .5s ease-out 1.9s}}
#how-many .hw-reel{transform-box:view-box}
#how-many .hw-adots,#how-many .hw-shut{opacity:0}
#how-many .hw-red{stroke:#e53935}
:root[data-theme="dark"] #how-many .hw-red{stroke:#ff8a80}
@media (prefers-reduced-motion:no-preference){.x-js #how-many .x-anim:not(.x-play) .hw-ra{opacity:0}.x-js #how-many .x-anim:not(.x-play) :is(.hw-adots,.hw-shut){opacity:1}.x-js #how-many .x-anim:not(.x-play) .hw-open{opacity:0}#how-many .x-play .hw-ra{animation:hm-spin .5s steps(8) calc(.7s + var(--k) * .25s) backwards}}
@keyframes hm-spin{from{transform:translateY(176px)}to{transform:none}}
@keyframes hm-show{from,to{opacity:1}}

.t2-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin:12px 0 0}
.t2-links .t2-how{margin-top:0}
.t2-check{display:inline-flex;align-items:center;gap:6px;min-height:24px;font-size:14px;font-weight:700}
.t2-check .ico{width:16px;height:16px}