@font-face{font-family:'Switzer';src:url('/assets/fonts/switzer-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url('/assets/fonts/switzer-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url('/assets/fonts/switzer-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url('/assets/fonts/switzer-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{
--bg:#fbfaf8;--surface:#fff;--surface-2:#f3f1ed;--surface-3:#eae6df;
--border:#e7e3dc;--border-strong:#d6d0c6;
--text:#23201c;--muted:#6b655c;--faint:#948d82;
--accent:#2f6f62;--accent-hover:#255a4f;--accent-soft:#e6f1ee;--accent-ring:rgba(47,111,98,.28);
--pop:#c4622d;--pop-soft:#fbeee5;
--ok:#3f8f63;--ok-soft:#e8f4ed;--warn:#c08a2e;--warn-soft:#fbf2e0;
--danger:#c0503f;--danger-soft:#fceeeb;
--info:#2b5f94;
--r:10px;--r-lg:16px;--r-pill:999px;--maxw:1140px;--readw:720px;
--ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);
--t-fast:140ms;--t:220ms;--t-slow:380ms;
--sh:0 1px 2px rgba(35,32,28,.05),0 2px 8px rgba(35,32,28,.05);
--sh-lg:0 2px 6px rgba(35,32,28,.06),0 14px 34px rgba(35,32,28,.09);
--font:'Switzer',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--font-display:'Switzer',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
html[data-theme=dim]{
--bg:#22201e;--surface:#2a2825;--surface-2:#312e2a;--surface-3:#3a3733;
--border:#3b3833;--border-strong:#4b473f;
--text:#f0ece5;--muted:#b3aaa0;--faint:#8b837a;
--accent:#5fb3a1;--accent-hover:#77c4b3;--accent-soft:#26443d;--accent-ring:rgba(95,179,161,.32);
--pop:#e08b53;--pop-soft:#40301f;
--ok:#63b487;--ok-soft:#243a2e;--warn:#d7a955;--warn-soft:#3d3320;
--danger:#d97a68;--danger-soft:#3f2723;
--info:#8dbbe8;
--sh:0 1px 2px rgba(0,0,0,.3);--sh-lg:0 14px 34px rgba(0,0,0,.42)
}
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.62;
-webkit-font-smoothing:antialiased;font-size:16.5px;overflow-x:hidden}
img,canvas,svg{display:block;max-width:100%}
a{color:var(--accent-text);text-decoration:none}
a:hover{color:var(--accent-text-hover);text-decoration:underline}
h1,h2,h3,h4{line-height:1.22;letter-spacing:-.012em;font-weight:650}
h1,h2{font-family:var(--font-display);word-spacing:.14em;letter-spacing:0}
h3,h4{font-family:var(--font);font-weight:680;letter-spacing:-.015em}
h1{font-size:clamp(1.85rem,4.4vw,2.9rem)}
h2{font-size:clamp(1.35rem,2.7vw,1.85rem);margin-bottom:.5rem}
h3{font-size:1.11rem}
p{margin:0 0 1rem}
ul,ol{margin:0 0 1rem;padding-left:1.25rem}
li{margin:.3rem 0}
hr{border:0;border-top:1px solid var(--border);margin:1.1rem 0}
b,strong{font-weight:680}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 1.15rem}
.read{max-width:var(--readw)}
.sec{margin:2.7rem 0}
.center{text-align:center}
.small{font-size:.875rem}
.muted{color:var(--muted)}
.hint{color:var(--faint);font-size:.83rem;line-height:1.5;display:block}
.hide{display:none !important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;
clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-999px;top:0;background:var(--accent-fill);color:#fff;
padding:.6rem 1rem;z-index:200;border-radius:0 0 var(--r) 0}
.skip:focus{left:0}
.hdr{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--bg) 88%,transparent);
backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid transparent;
transition:border-color var(--t),box-shadow var(--t)}
.hdr.stuck{border-bottom-color:var(--border);box-shadow:0 1px 14px rgba(35,32,28,.05)}
.hdr .in{display:flex;align-items:center;gap:.7rem;height:60px;
max-width:var(--maxw);margin:0 auto;padding:0 1.15rem}
.brand{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.12rem;
color:var(--text);letter-spacing:-.01em;font-family:var(--font-display)}
.brand:hover{text-decoration:none;color:var(--text)}
.brand .m{width:26px;height:26px;border-radius:8px;background:var(--accent-fill);
display:grid;place-items:center;color:#fff;flex:0 0 auto}
.brand .m svg{width:15px;height:15px}
nav.main{display:flex;gap:.15rem;margin-left:auto;align-items:center}
nav.main a{padding:.42rem .68rem;border-radius:var(--r-pill);color:var(--muted);
font-size:.905rem;font-weight:560;transition:background var(--t-fast),color var(--t-fast)}
nav.main a:hover{background:var(--surface-2);color:var(--text);text-decoration:none}
nav.main a.on{color:var(--accent-text);background:var(--accent-soft)}
.icon-btn{width:35px;height:35px;display:grid;place-items:center;border-radius:var(--r-pill);
border:1px solid transparent;background:transparent;color:var(--muted);cursor:pointer;
transition:background var(--t-fast),color var(--t-fast)}
.icon-btn:hover{background:var(--surface-2);color:var(--text)}
.icon-btn svg{width:17px;height:17px}
.burger{display:none}
@media(max-width:860px){
nav.main{position:fixed;inset:60px 0 auto;flex-direction:column;align-items:stretch;
background:var(--surface);border-bottom:1px solid var(--border);padding:.6rem 1rem 1rem;
gap:.1rem;box-shadow:var(--sh-lg);transform:translateY(-8px);opacity:0;pointer-events:none;
transition:opacity var(--t),transform var(--t)}
nav.main.open{transform:none;opacity:1;pointer-events:auto}
nav.main a{padding:.66rem .8rem;border-radius:var(--r);font-size:1rem}
.burger{display:grid}
}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
padding:.62rem 1.12rem;border-radius:var(--r-pill);border:1px solid var(--accent);
background:var(--accent-fill);color:#fff;font:inherit;font-size:.945rem;font-weight:640;
cursor:pointer;text-decoration:none;white-space:nowrap;
transition:transform var(--t-fast) var(--ease),background var(--t-fast),
box-shadow var(--t-fast),opacity var(--t-fast);box-shadow:0 1px 2px rgba(35,32,28,.08)}
.btn:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff;
text-decoration:none;transform:translateY(-1px);box-shadow:0 4px 14px var(--accent-ring)}
.btn:active{transform:translateY(0) scale(.985)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn.ghost{background:var(--surface);color:var(--text);border-color:var(--border-strong)}
.btn.ghost:hover{background:var(--surface-2);color:var(--text);border-color:var(--accent);
box-shadow:none}
.btn.quiet{background:transparent;border-color:transparent;color:var(--muted);box-shadow:none}
.btn.quiet:hover{background:var(--surface-2);color:var(--text);box-shadow:none}
.btn.danger{background:var(--danger);border-color:var(--danger)}
.btn.danger:hover{background:#a94433;border-color:#a94433}
.btn.google{background:var(--surface);color:var(--text);border-color:var(--border-strong)}
.btn.google:hover{background:var(--surface-2);color:var(--text)}
.btn.sm{padding:.4rem .8rem;font-size:.86rem}
.btn.lg{padding:.8rem 1.4rem;font-size:1.02rem}
.btn.block{display:flex;width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.btn .spin{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);
border-top-color:#fff;border-radius:50%;animation:sp .7s linear infinite}
.btn.ghost .spin{border-color:var(--border-strong);border-top-color:var(--accent)}
@keyframes sp{to{transform:rotate(360deg)}}
.grid{display:grid;gap:1rem}
.grid.c2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid.c3{grid-template-columns:repeat(auto-fit,minmax(272px,1fr))}
.grid.c4{grid-template-columns:repeat(auto-fit,minmax(198px,1fr))}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
padding:1.15rem;box-shadow:var(--sh)}
.tcard{display:flex;flex-direction:column;background:var(--surface);
border:1px solid var(--border);border-radius:var(--r-lg);padding:1.25rem;color:var(--text);
box-shadow:var(--sh);position:relative;overflow:hidden;
transition:transform var(--t) var(--ease),box-shadow var(--t),border-color var(--t)}
.tcard::after{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--accent-fill);
transform:scaleX(0);transform-origin:left;transition:transform var(--t-slow) var(--ease)}
.tcard:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);border-color:var(--border-strong);
text-decoration:none;color:var(--text)}
.tcard:hover::after{transform:scaleX(1)}
.tcard .ico{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
margin-bottom:.75rem;color:var(--accent-text);position:relative;z-index:2;
background:linear-gradient(135deg,var(--accent-soft),color-mix(in srgb,var(--pop-soft) 55%,var(--surface)));
border:1px solid color-mix(in srgb,var(--accent) 20%,transparent);
box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.tcard .ico svg{width:22px;height:22px}
.tcard h3{margin-bottom:.3rem}
.tcard p{color:var(--muted);font-size:.905rem;margin-bottom:.85rem;flex:1}
.tcard .go{color:var(--accent-text);font-weight:640;font-size:.88rem;display:inline-flex;
align-items:center;gap:.32rem}
.tcard:hover .go svg{transform:translateX(3px)}
.tcard .go svg{transition:transform var(--t) var(--ease)}
.num{font-variant-numeric:tabular-nums}
.chips{display:flex;flex-wrap:wrap;gap:.42rem}
.chip{display:inline-flex;align-items:center;gap:.3rem;padding:.36rem .78rem;
border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--border);
font-size:.86rem;color:var(--text);font-weight:560;
transition:background var(--t-fast),border-color var(--t-fast),transform var(--t-fast)}
.chip:hover{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text-hover);
text-decoration:none;transform:translateY(-1px)}
.hero{padding:3.1rem 0 2.2rem;position:relative}
.hero::before{content:"";position:absolute;inset:-40% 40% 40% -20%;pointer-events:none;
background:radial-gradient(closest-side,var(--accent-soft),transparent 72%);opacity:.75;z-index:-1}
.eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.79rem;font-weight:680;
letter-spacing:.05em;text-transform:uppercase;color:var(--accent-text);background:var(--accent-soft);
padding:.3rem .74rem;border-radius:var(--r-pill);margin-bottom:.95rem}
.hero .lede{font-size:1.1rem;color:var(--muted);max-width:640px;margin-bottom:1.35rem}
.trust{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.4rem;color:var(--muted);font-size:.855rem}
.trust span{display:inline-flex;align-items:center;gap:.36rem}
.trust svg{width:15px;height:15px;color:var(--ok);flex:0 0 auto}
.field{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.9rem;flex:1;min-width:0}
.field label{font-size:.845rem;font-weight:620;color:var(--text)}
.row{display:flex;gap:.65rem;flex-wrap:wrap}
input[type=text],input[type=email],input[type=password],input[type=number],
input[type=date],select,textarea{width:100%;padding:.56rem .72rem;border-radius:var(--r);
border:1px solid var(--border-strong);background:var(--surface);color:var(--text);
font:inherit;font-size:.94rem;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent);
box-shadow:0 0 0 3px var(--accent-ring)}
input[type=color]{width:100%;height:34px;padding:2px;border:1px solid var(--border-strong);
border-radius:8px;background:var(--surface);cursor:pointer}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:22px;
background:transparent;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:99px;
background:var(--surface-3)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:17px;height:17px;
border-radius:50%;background:var(--accent-fill);border:2px solid var(--surface);margin-top:-6px;
box-shadow:0 1px 4px rgba(35,32,28,.24);transition:transform var(--t-fast)}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.16)}
input[type=range]::-moz-range-track{height:5px;border-radius:99px;background:var(--surface-3)}
input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;
background:var(--accent-fill);border:2px solid var(--surface)}
.checkline{display:flex;align-items:center;gap:.52rem;font-size:.9rem;margin-bottom:.75rem;
cursor:pointer;user-select:none}
.checkline input{width:16px;height:16px;accent-color:var(--accent);flex:0 0 auto;cursor:pointer}
.tabs{display:flex;gap:.25rem;background:var(--surface-2);padding:.25rem;
border-radius:var(--r-pill);margin-bottom:1rem}
.tabs button{flex:1;padding:.5rem .8rem;border:0;border-radius:var(--r-pill);
background:transparent;color:var(--muted);font:inherit;font-size:.9rem;font-weight:620;
cursor:pointer;transition:background var(--t-fast),color var(--t-fast)}
.tabs button[aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:var(--sh)}
.notice{display:flex;gap:.7rem;padding:.85rem 1rem;border-radius:var(--r);
border:1px solid var(--border);background:var(--surface-2);font-size:.9rem;margin:1rem 0}
.notice.info{background:var(--accent-soft);border-color:transparent;color:var(--accent-text-hover)}
.notice.warn{background:var(--warn-soft);border-color:transparent}
.notice.ok{background:var(--ok-soft);border-color:transparent}
.notice.bad{background:var(--danger-soft);border-color:transparent;color:var(--danger)}
.badge{display:inline-block;padding:.16rem .55rem;border-radius:var(--r-pill);
font-size:.74rem;font-weight:700;background:var(--surface-3);color:var(--muted)}
.badge.ok{background:var(--ok-soft);color:var(--ok)}
.badge.warn{background:var(--warn-soft);color:var(--warn)}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.tbl{width:100%;border-collapse:collapse;font-size:.9rem;background:var(--surface);
border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
table.tbl th,table.tbl td{padding:.62rem .85rem;text-align:left;
border-bottom:1px solid var(--border);vertical-align:top}
table.tbl th{background:var(--surface-2);font-weight:680;font-size:.83rem;
text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
table.tbl tr:last-child td{border-bottom:0}
table.tbl td:first-child{font-weight:620;width:38%}
.spec{margin:1rem 0}
.spec .src{font-size:.79rem;color:var(--faint);margin-top:.5rem}
.faq{border-top:1px solid var(--border)}
.faq details{border-bottom:1px solid var(--border)}
.faq summary{cursor:pointer;padding:.95rem 2rem .95rem 0;font-weight:640;position:relative;
list-style:none;transition:color var(--t-fast)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--accent-text)}
.faq summary::after{content:"";position:absolute;right:.35rem;top:1.35rem;width:9px;height:9px;
border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
transform:rotate(45deg);transition:transform var(--t) var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq .a{padding:0 1.4rem 1.05rem 0;color:var(--muted);font-size:.945rem}
.steps{list-style:none;padding:0;counter-reset:s}
.steps li{counter-increment:s;position:relative;padding:0 0 1.05rem 2.7rem;
border-left:2px solid var(--border);margin-left:.85rem}
.steps li:last-child{border-left-color:transparent;padding-bottom:0}
.steps li::before{content:counter(s);position:absolute;left:-.92rem;top:-.12rem;width:1.8rem;
height:1.8rem;border-radius:50%;background:var(--accent-fill);color:#fff;display:grid;
place-items:center;font-size:.83rem;font-weight:750}
.ad{min-height:96px;display:grid;place-items:center;background:var(--surface-2);
border:1px dashed var(--border-strong);border-radius:var(--r);color:var(--faint);
font-size:.76rem;letter-spacing:.05em;text-transform:uppercase;margin:1.7rem 0}
.ad.tall{min-height:250px}
.crumb{font-size:.83rem;color:var(--muted);padding:.9rem 0 .1rem;display:flex;
flex-wrap:wrap;gap:.35rem;align-items:center}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--accent-text)}
.crumb .sep{color:var(--faint)}
footer.ft{border-top:1px solid var(--border);background:var(--surface-2);
margin-top:3.4rem;padding:2.4rem 0 1.6rem;font-size:.9rem}
footer.ft .cols{display:grid;gap:1.7rem;grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}
footer.ft h4,footer.ft h2{font-size:.77rem;text-transform:uppercase;letter-spacing:.06em;
color:var(--faint);margin-bottom:.6rem;font-weight:700}
footer.ft ul{list-style:none;padding:0;margin:0}
footer.ft li{margin:.28rem 0}
footer.ft a{color:var(--muted)}
footer.ft a:hover{color:var(--accent-text)}
footer.ft .base{margin-top:1.9rem;padding-top:1.1rem;border-top:1px solid var(--border);
display:flex;flex-wrap:wrap;gap:.7rem;justify-content:space-between;color:var(--faint);
font-size:.83rem}
#toasts{position:fixed;left:50%;bottom:1.3rem;transform:translateX(-50%);z-index:300;
display:flex;flex-direction:column;gap:.5rem;align-items:center;pointer-events:none;
width:min(94vw,430px)}
.toast{background:var(--text);color:var(--bg);padding:.62rem 1.05rem;border-radius:var(--r-pill);
font-size:.89rem;font-weight:560;box-shadow:var(--sh-lg);animation:tin .28s var(--ease);
max-width:100%}
.toast.bad{background:var(--danger);color:#fff}
.toast.ok{background:var(--ok);color:#fff}

.toast.warn{background:var(--warn);color:#1f1f26}
.toast.info{background:var(--info);color:#fff}
html[data-theme=dim] .toast.info{color:#15151a}
.toast.out{animation:tout .26s var(--ease-io) forwards}
@keyframes tin{from{opacity:0;transform:translateY(12px) scale(.96)}}
@keyframes tout{to{opacity:0;transform:translateY(8px) scale(.97)}}


.hero .wrap.hgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:2.6rem;align-items:center}
.hero-art{position:relative;display:grid;place-items:center;min-height:340px}
.hero-art img{width:min(94%,470px);height:auto;
filter:drop-shadow(0 26px 44px rgba(35,32,28,.20))}
html[data-theme=dim] .hero-art img{filter:drop-shadow(0 26px 44px rgba(0,0,0,.5))}
.fchip{position:absolute;display:inline-flex;align-items:center;gap:.42rem;
padding:.48rem .85rem;border-radius:var(--r-pill);
background:color-mix(in srgb,var(--surface) 90%,transparent);
border:1px solid var(--border);box-shadow:var(--sh-lg);
font-size:.85rem;font-weight:640;backdrop-filter:blur(8px);white-space:nowrap}
.fchip svg{width:14px;height:14px;color:var(--ok);flex:0 0 auto}
.fchip.b svg{color:var(--accent-text)}
.fchip.c svg{color:var(--pop)}
.fchip.a{top:5%;left:0}
.fchip.b{bottom:12%;left:-2%}
.fchip.c{top:34%;right:-2%}
@media(max-width:900px){
.hero .wrap.hgrid{grid-template-columns:1fr;gap:1.6rem}
.hero-art{min-height:0}
.hero-art img{width:min(78%,360px)}
.fchip.a{left:4%}.fchip.b{left:6%}.fchip.c{right:4%}
}
.why-grid{display:grid;grid-template-columns:330px 1fr;gap:2.2rem;align-items:center;margin-top:1.2rem}
.why-grid .art{display:grid;place-items:center}
.why-grid .art img{width:100%;max-width:330px;height:auto;
filter:drop-shadow(0 20px 36px rgba(35,32,28,.16))}
html[data-theme=dim] .why-grid .art img{filter:drop-shadow(0 20px 36px rgba(0,0,0,.45))}
@media(max-width:900px){.why-grid{grid-template-columns:1fr}.why-grid .art img{max-width:250px}}
.cta-art{width:150px;height:auto;margin:0 auto 1rem}


.mascot{pointer-events:none;user-select:none}
.hero-art img.m-hero{position:absolute;width:clamp(88px,10vw,128px);height:auto;bottom:-3%;left:1%;z-index:2}
.m-tools{display:block;margin:0 auto -.35rem;width:92px;height:auto}
.why-grid .art{position:relative}
.why-grid .art img.m-why{position:absolute;width:clamp(82px,9vw,108px);height:auto;right:0;bottom:-5%;z-index:2}
.cta-duo{display:flex;align-items:flex-end;justify-content:center;gap:.5rem;margin:0 auto 1rem}
.cta-duo .cta-art{margin:0}
.cta-duo .m-cta{width:112px;height:auto}
.m-404{display:block;margin:0 auto 1rem;width:140px;height:auto}
.tool-note .m-note{width:36px;height:40px;flex:0 0 auto;transition:transform .25s var(--ease,ease)}
.tool-note:hover .m-note{transform:rotate(-7deg) scale(1.14)}
.tcard{position:relative}
.newb{position:absolute;top:.75rem;right:.75rem;background:linear-gradient(135deg,var(--pop),#d97b35);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:.2rem .52rem;border-radius:999px;box-shadow:0 3px 10px rgba(196,98,45,.35)}
@media(max-width:640px){.hero-art img.m-hero{bottom:-1%;left:0;width:74px}.cta-duo .m-cta{width:86px}.why-grid .art img.m-why{width:74px}}
.fchip.b{bottom:32%}


.drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;text-align:center;padding:2.4rem 1.2rem;border:2px dashed var(--border-strong);border-radius:var(--r-lg);background:var(--surface);cursor:pointer;transition:border-color var(--t) var(--ease),background var(--t) var(--ease),transform var(--t) var(--ease)}
.drop:hover{border-color:var(--accent);background:var(--accent-soft)}
.drop.over{border-color:var(--accent);background:var(--accent-soft);transform:scale(1.008)}
.drop input[type=file]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.drop .di{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--accent-soft);color:var(--accent-text)}
.drop b{font-size:1.04rem}
.drop .sub{color:var(--muted);font-size:.87rem}
.drop.mini{padding:1.1rem .8rem;border-width:1px}
.drop.mini .di{width:32px;height:32px}
.drop.mini b{font-size:.9rem}


.wb{display:grid;grid-template-columns:minmax(0,1fr) 348px;gap:18px;align-items:start}
.wb.hide{display:none}
.wb-view{position:sticky;top:76px;min-width:0}
.stage{position:relative;display:grid;place-items:center;padding:12px;min-height:200px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.stage.checker{background-color:var(--surface-2);background-image:linear-gradient(45deg,rgba(0,0,0,.055) 25%,transparent 25%),linear-gradient(-45deg,rgba(0,0,0,.055) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(0,0,0,.055) 75%),linear-gradient(-45deg,transparent 75%,rgba(0,0,0,.055) 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}
.holder{position:relative;line-height:0;max-width:100%}
.holder canvas,.holder img{display:block;max-width:100%;height:auto;border-radius:5px;box-shadow:0 1px 4px rgba(0,0,0,.16)}


.cropov{position:absolute;left:0;top:0;right:0;bottom:0;touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair;border-radius:5px;overflow:hidden}
.cropov.off{display:none}
.cbox{position:absolute;box-shadow:0 0 0 9999px rgba(18,16,14,.5);outline:1px solid rgba(255,255,255,.92);cursor:move;will-change:left,top,width,height}
.cbox:after{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;opacity:0;transition:opacity var(--t) var(--ease);background-image:linear-gradient(to right,rgba(255,255,255,.4) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.4) 1px,transparent 1px);background-size:33.333% 33.333%}
.cbox.live:after{opacity:1}
.ch{position:absolute;width:28px;height:28px;display:grid;place-items:center;touch-action:none;z-index:3}
.ch i{display:block;width:13px;height:13px;background:#fff;border:2px solid var(--accent);border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.4);transition:transform var(--t-fast) var(--ease)}
.ch:hover i,.ch:active i{transform:scale(1.22)}
.ch[data-c=nw]{left:-14px;top:-14px;cursor:nwse-resize}
.ch[data-c=ne]{right:-14px;top:-14px;cursor:nesw-resize}
.ch[data-c=sw]{left:-14px;bottom:-14px;cursor:nesw-resize}
.ch[data-c=se]{right:-14px;bottom:-14px;cursor:nwse-resize}
.ce{position:absolute;touch-action:none;z-index:2}
.ce[data-c=n]{left:22px;right:22px;top:-10px;height:20px;cursor:ns-resize}
.ce[data-c=s]{left:22px;right:22px;bottom:-10px;height:20px;cursor:ns-resize}
.ce[data-c=w]{top:22px;bottom:22px;left:-10px;width:20px;cursor:ew-resize}
.ce[data-c=e]{top:22px;bottom:22px;right:-10px;width:20px;cursor:ew-resize}


.vbar{display:flex;align-items:center;gap:.25rem;margin-top:.55rem;padding:.3rem .35rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-pill)}
.vbar button{display:grid;place-items:center;width:34px;height:34px;flex:0 0 auto;border-radius:50%;border:0;background:transparent;color:var(--muted);cursor:pointer;transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease)}
.vbar button:hover{background:var(--surface-2);color:var(--text)}
.vbar button:active{transform:scale(.88)}
.vbar button.on{background:var(--accent-soft);color:var(--accent-text)}
.vbar button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.vsep{width:1px;height:19px;background:var(--border);margin:0 .18rem;flex:0 0 auto}
.vinfo{margin-left:auto;padding-right:.55rem;font-size:.75rem;color:var(--faint);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}


.wb-panel{position:sticky;top:76px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:14px}
.pt{font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:700;margin:0 0 .75rem}
.wb-panel .field{margin-bottom:.72rem}
.wb-panel .field:last-child{margin-bottom:0}
.wb-panel .field>label{display:block;font-size:.79rem;font-weight:600;margin-bottom:.26rem;color:var(--text)}
.wb-panel input[type=text],.wb-panel input[type=number],.wb-panel input[type=date],.wb-panel select{width:100%;padding:.48rem .58rem;font-size:.92rem}
.wb-panel .hint{font-size:.74rem;margin-top:.22rem;display:block;line-height:1.4}
.wb-panel hr{border:0;border-top:1px solid var(--border);margin:.85rem 0}
.wb-panel .btn.block{margin-top:.9rem}


.szf{display:grid;grid-template-columns:minmax(0,1fr) 86px;gap:.38rem}
.dimf{display:grid;grid-template-columns:minmax(0,1fr) 13px minmax(0,1fr) 76px;gap:.32rem;align-items:center}
.dimf .x{text-align:center;color:var(--faint);font-size:.88rem;line-height:1}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}
.opt{font-weight:400;color:var(--faint);font-size:.73rem}


.adv{margin-top:.85rem;border-top:1px solid var(--border);padding-top:.35rem}
.adv>summary{list-style:none;display:flex;align-items:center;gap:.42rem;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--accent-text);padding:.45rem 0}
.adv>summary::-webkit-details-marker{display:none}
.adv>summary::marker{content:""}
.adv>summary:hover{color:var(--accent-text-hover)}
.adv>summary .cv{flex:0 0 auto;transition:transform var(--t) var(--ease)}
.adv[open]>summary .cv{transform:rotate(90deg)}
.adv-b{padding-top:.5rem;animation:advIn var(--t-slow) var(--ease) both}
@keyframes advIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}


.working{display:flex;align-items:center;gap:.85rem;padding:.9rem;background:var(--accent-soft);border:1px solid var(--border);border-radius:var(--r);margin-top:.8rem}
.working.hide{display:none}
.ring{position:relative;width:52px;height:52px;flex:0 0 auto}
.ring svg{width:52px;height:52px;transform:rotate(-90deg)}
.ring .bgc{fill:none;stroke:var(--border-strong);stroke-width:5}
.ring .fg{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;stroke-dasharray:157;stroke-dashoffset:157;transition:stroke-dashoffset var(--t) linear}
.ring .pct{position:absolute;left:0;top:0;right:0;bottom:0;display:grid;place-items:center;font-size:.72rem;font-weight:700;color:var(--accent-text)}
.working .lbl{font-weight:650;font-size:.92rem}
.working .sub{font-size:.78rem;color:var(--muted);margin-top:.12rem}


.result{margin-top:.85rem;padding:1rem;text-align:center;background:var(--ok-soft);border:1px solid var(--border);border-radius:var(--r-lg);animation:advIn var(--t-slow) var(--ease) both}
.result.hide{display:none}
.result .big{font-size:1.75rem;font-weight:750;letter-spacing:-.02em;line-height:1.1}
.result .meta{font-size:.82rem;color:var(--muted);margin:.2rem 0 .8rem}
.result .btn-row{gap:.5rem;flex-wrap:wrap}


.queue{display:flex;flex-direction:column;gap:.5rem;margin-top:.9rem;max-height:52vh;overflow:auto;padding-right:.15rem}
.qrow{display:flex;align-items:center;gap:.65rem;padding:.5rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);animation:advIn var(--t) var(--ease) both}
.qthumb{width:42px;height:42px;flex:0 0 auto;border-radius:5px;object-fit:cover;background:var(--surface-2)}
.qmeta{min-width:0;flex:1}
.qmeta b{display:block;font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qmeta span{font-size:.76rem;color:var(--muted);font-variant-numeric:tabular-nums}
.qbar{height:3px;border-radius:2px;background:var(--surface-3);margin-top:.3rem;overflow:hidden}
.qbar i{display:block;height:100%;width:0;background:var(--accent-fill);transition:width var(--t) var(--ease)}
.sum{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:.8rem;padding:.7rem .85rem;background:var(--ok-soft);border:1px solid var(--border);border-radius:var(--r);font-size:.88rem}
.sum.hide{display:none}


.cmp{position:relative;line-height:0;max-width:100%;overflow:hidden;border-radius:6px;touch-action:none;-webkit-user-select:none;user-select:none}
.cmp img{display:block;max-width:100%;height:auto}
.cmp .after{position:absolute;left:0;top:0;height:100%;overflow:hidden;width:50%}
.cmp .after img{height:100%;width:auto;max-width:none}
.cmp .bar{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.25);cursor:ew-resize}
.cmp .knob{position:absolute;top:50%;left:50%;width:32px;height:32px;margin:-16px 0 0 -16px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.3);display:grid;place-items:center;color:var(--text)}
.cmp .tag{position:absolute;bottom:8px;padding:.16rem .45rem;border-radius:var(--r-pill);background:rgba(20,18,16,.66);color:#fff;font-size:.7rem;line-height:1.5}
.cmp .tagL{left:8px}
.cmp .tagR{right:8px}


.padwrap{position:relative;background:#fff;border:1px solid var(--border-strong);border-radius:var(--r);overflow:hidden;touch-action:none}
.padwrap canvas{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair}
.baseline{position:absolute;left:7%;right:7%;bottom:26%;border-bottom:1px dashed var(--border-strong);pointer-events:none}
.calc{display:block;padding:.4rem .55rem;background:var(--surface-2);border:1px solid var(--border);border-radius:6px;font-size:.76rem;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums;margin-top:.3rem}


.checkline{display:flex;align-items:center;gap:.45rem;font-size:.83rem;margin:.4rem 0;cursor:pointer}
.checkline input{width:auto!important;flex:0 0 auto}
.tool-note{display:flex;gap:.5rem;align-items:flex-start;margin-top:.9rem;font-size:.78rem;color:var(--muted);line-height:1.5}
.tool-note svg{flex:0 0 auto;margin-top:.1rem;color:var(--accent-text)}


@media (max-width:920px){
.wb{grid-template-columns:1fr;gap:11px}
.wb-view{position:sticky;top:56px;z-index:6;background:var(--bg);padding-bottom:.35rem}
.stage{padding:8px;min-height:130px}
.holder canvas,.holder img{max-height:31vh;width:auto}
.wb-panel{position:static;padding:12px}
.vbar button{width:32px;height:32px}
.vinfo{font-size:.7rem}
.queue{max-height:44vh}
.result .big{font-size:1.5rem}
}
@media (max-width:420px){
.dimf{grid-template-columns:minmax(0,1fr) 11px minmax(0,1fr) 66px}
.szf{grid-template-columns:minmax(0,1fr) 74px}
}
@media (prefers-reduced-motion:reduce){
.adv-b,.result,.qrow{animation:none}
}

.vbar button.on{background:var(--accent-fill);border-color:var(--accent);color:#fff}
.wb-panel hr{border:0;border-top:1px solid var(--border);margin:.95rem 0}
.dimf .x{display:flex;align-items:center;justify-content:center;color:var(--faint);font-size:.85rem}
.holder canvas{display:block;max-width:100%;height:auto;border-radius:8px}
.padwrap{position:relative;width:100%;background:var(--surface);border:1px dashed var(--border-strong);border-radius:10px;overflow:hidden}
#pad{display:block;width:100%;touch-action:none;cursor:crosshair}
.baseline{position:absolute;left:8%;right:8%;bottom:26%;border-bottom:1px dashed var(--border-strong);pointer-events:none}
.stage .tabs{width:100%}
.stage>div{width:100%}
.drop.mini{padding:.7rem .8rem;text-align:center;display:block}
.field .opt{font-weight:400;color:var(--faint);font-size:.74rem;margin-left:.28rem}
.wb-panel .field:last-of-type{margin-bottom:.2rem}
.wb-panel .btn.block{margin-top:.9rem}


.stage{--stgH:334px}
.stage.checker{background-image:none}
.stage.fixh{display:flex;align-items:center;justify-content:center;gap:0;padding:12px;height:calc(var(--stgH) + 24px);transition:height var(--t-slow) var(--ease)}
.stage.fixh>.holder{flex:0 0 auto;width:var(--hw,auto);height:var(--hh,auto);max-width:100%;transition:width var(--t-slow) var(--ease),height var(--t-slow) var(--ease)}
.holder>canvas,.holder>img{display:block;width:100%;height:100%;max-width:none;max-height:none;background:#fff;border-radius:6px;box-shadow:0 1px 5px rgba(0,0,0,.14)}
.holder>canvas.hide,.holder>img.hide{display:none}
.stage.done{flex-wrap:wrap;gap:12px}
.stage.fixh.done{flex-wrap:nowrap;justify-content:flex-start;height:auto;min-height:calc(var(--stgH) + 24px)}
.stage.fixh.done>.holder{height:96px;width:calc(96px * var(--ar,1));opacity:.9}
.stage.fixh.done>.holder:hover{opacity:1}
.stage.done .cropov{display:none}
.stage .result{width:auto;flex:1 1 auto;min-width:0;margin:0;padding:0;background:none;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;text-align:center;animation:outIn var(--t-slow) var(--ease) both}
.stage .result.hide{display:none}
.ohold{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px}
.ohold img{display:block;width:auto;height:auto;max-width:100%;max-height:var(--stgH);border-radius:8px;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.18)}
.ohold img.hide{display:none}
.odoc{display:flex;align-items:center;gap:.6rem;padding:.75rem .9rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}
.odoc.hide{display:none}
.oext{display:grid;place-items:center;width:38px;height:46px;flex:0 0 auto;border-radius:6px;background:var(--accent-soft);color:var(--accent-text);font-weight:750;font-size:.7rem}
.oname{font-size:.8rem;color:var(--muted);word-break:break-all;text-align:left}
.orow{display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap;width:100%}
.osz{text-align:left}
.stage .result .big{font-size:1.2rem;font-weight:750;line-height:1.15}
.stage .result .meta{font-size:.73rem;color:var(--muted);margin:0}
.xbtn{position:absolute;top:8px;right:8px;z-index:6;display:grid;place-items:center;width:30px;height:30px;padding:0;border-radius:50%;border:1px solid var(--border);background:var(--surface);color:var(--muted);font-size:1.05rem;font-weight:600;line-height:1;cursor:pointer;box-shadow:0 1px 6px rgba(0,0,0,.16);transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease)}
.xbtn:hover{background:var(--danger-soft);color:var(--danger);transform:rotate(90deg)}
.xbtn:active{transform:scale(.9)}
.xbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.xbtn.hide{display:none}
@keyframes outIn{from{opacity:0;transform:translateX(20px) scale(.94)}to{opacity:1;transform:none}}
@media (max-width:920px){.stage{--stgH:240px}.stage.fixh.done{gap:10px}.stage.fixh.done>.holder{height:74px;width:calc(74px * var(--ar,1))}.osz{text-align:center}}
@media (max-width:420px){.stage{--stgH:208px}.stage.fixh.done>.holder{height:58px;width:calc(58px * var(--ar,1))}}
@media (prefers-reduced-motion:reduce){.stage.fixh,.stage.fixh>.holder,.stage .result{transition:none;animation:none}}





.stage{transition:height 520ms var(--ease),min-height 520ms var(--ease)}
.stage.fixh{transition:height 520ms var(--ease)}
.stage.fixh>.holder{transition:width 520ms var(--ease),height 520ms var(--ease),
  transform 520ms var(--ease),opacity 300ms linear 60ms,filter 300ms linear}
.stage.fixh.done>.holder{opacity:.5;transform:scale(.98);filter:saturate(.86)}
.stage .result{animation:ffReveal 470ms var(--ease) 165ms both}
@keyframes ffReveal{from{opacity:0;transform:translateY(12px) scale(.966)}
  55%{opacity:1}to{opacity:1;transform:none}}
.stage .result .big{animation:rise 400ms var(--ease) 300ms both}
.working{animation:ffReveal 300ms var(--ease) both}


.cfbar{position:absolute;left:0;top:0;z-index:7;display:flex;gap:.4rem;
  transform:translate(-100%,10px);transition:opacity 150ms linear}
.cfbar.lft{transform:translate(0,10px)}
.cfbar.inside{transform:translate(-100%,calc(-100% - 10px))}
.cfbar.lft.inside{transform:translate(0,calc(-100% - 10px))}
.cfbar.dim{opacity:.18}
.cropov.off .cfbar{display:none}
.cfb{width:36px;height:36px;padding:0;border-radius:50%;
  border:2px solid rgba(255,255,255,.92);display:grid;place-items:center;
  cursor:pointer;color:#fff;box-shadow:0 5px 16px rgba(0,0,0,.42);
  transition:transform 150ms var(--ease),filter 150ms linear}
.cfb svg{width:16px;height:16px;display:block}
.cfb.ok{background:#2f9e70}
.cfb.no{background:#d1495b}
.cfb:hover{transform:scale(1.1)}
.cfb:active{transform:scale(.92)}
.cfb:focus-visible{outline:2px solid #fff;outline-offset:2px}


#wb.pre .vbar,#wb.pre .wb-view>.field{display:none}
#wb.pre .stage>.holder{display:none}
.stage.empty{height:auto;min-height:calc(var(--stgH) + 24px);overflow:visible}
.stage.empty>#dropWrap{width:100%;max-width:540px}
.stage.empty .xbtn{display:none}
#dropWrap.nudge{animation:ffNudge 560ms var(--ease)}
@keyframes ffNudge{0%,100%{transform:none}18%{transform:translateX(-7px)}
  36%{transform:translateX(7px)}54%{transform:translateX(-5px)}
  72%{transform:translateX(4px)}86%{transform:translateX(-2px)}}
.btn.off{opacity:.55;filter:saturate(.5);cursor:not-allowed}
.btn.off:hover{transform:none;box-shadow:none}

@media (prefers-reduced-motion:reduce){
  .stage,.stage.fixh,.stage.fixh>.holder{transition:none}
  .stage .result,.stage .result .big,.working,#dropWrap.nudge{animation:none}
}



.fsbtn{position:absolute;top:8px;right:8px;z-index:4;display:grid;place-items:center;
width:30px;height:30px;padding:0;border:1px solid var(--border,#ddd6ca);border-radius:8px;
background:var(--surface,#fff);color:var(--text,#23201c);opacity:.5;cursor:pointer;
box-shadow:0 1px 6px rgba(35,32,28,.18);
transition:opacity var(--t-fast,140ms) var(--ease,ease),transform var(--t-fast,140ms) var(--ease,ease)}
.fsbtn:hover,.fsbtn:focus-visible{opacity:1}
.fsbtn:active{transform:scale(.92)}
.fsbtn svg{display:block}

.cropov{z-index:5}
.holder:has(.cropov:not(.off)) .fsbtn{display:none}
.ohold{position:relative}
.ohold:has(#outImg.hide) .fsbtn{display:none}

.fsov{position:fixed;inset:0;z-index:999;background:rgba(15,17,21,0);cursor:zoom-out;
transition:background 420ms var(--ease,ease)}
.fsov.on{background:rgba(15,17,21,.84)}
.fsov .fsimg{position:fixed;left:0;top:0;margin:0;border-radius:10px;background:#fff;
box-shadow:0 14px 52px rgba(0,0,0,.5);will-change:transform,width,height;
transition:transform 420ms var(--ease,ease),width 420ms var(--ease,ease),
height 420ms var(--ease,ease),opacity 300ms var(--ease,ease)}
@media (prefers-reduced-motion:reduce){
  .fsov,.fsov .fsimg{transition:none}
}


.penbar{display:flex;align-items:center;gap:.6rem;margin-top:.55rem;
padding:.45rem .65rem;background:var(--surface,#fff);border:1px solid var(--border,#ddd6ca);border-radius:10px}
.penbar .pl{font-size:.78rem;font-weight:650;color:var(--muted,#6b675f)}
.penbar input[type=range]{flex:1 1 auto;min-width:80px}
.penbar input[type=color]{width:36px;height:30px;padding:2px;border:1px solid var(--border,#ddd6ca);
border-radius:8px;background:var(--surface,#fff);cursor:pointer;flex:0 0 auto}




:root{
  --crop:#6ec8ff;            
  --crop-soft:rgba(110,200,255,.55);
  --crop-glow:rgba(110,200,255,.9);
}


.cropov{overflow:visible}
.cbox{box-shadow:none;outline:0}
.cbox:before{content:"";position:absolute;inset:0;pointer-events:none;
  border:1.5px solid rgba(255,255,255,.95);border-radius:2px;
  box-shadow:inset 0 0 0 1px rgba(20,26,34,.28),0 0 14px rgba(110,200,255,.3)}


.cshade{position:absolute;background:rgba(16,20,26,.52);pointer-events:none;z-index:1;
  transition:background 160ms linear}
.cropov.live .cshade{background:rgba(16,20,26,.6)}


.ch{width:36px;height:36px;z-index:14;place-items:center;pointer-events:auto}
.ch i{position:relative;width:22px;height:22px;background:none;border:0;border-radius:0;
  box-shadow:none;transition:transform 160ms var(--ease)}
.ch i:before,.ch i:after{content:"";position:absolute;background:var(--crop);border-radius:3px;
  box-shadow:0 0 0 1px rgba(10,26,40,.35),0 0 9px var(--crop-glow);
  animation:cropPulse 2.6s var(--ease-io) infinite}
.ch i:before{width:22px;height:5px}
.ch i:after{width:5px;height:22px}
.ch[data-c=nw] i:before,.ch[data-c=nw] i:after{left:0;top:0}
.ch[data-c=ne] i:before,.ch[data-c=ne] i:after{right:0;top:0}
.ch[data-c=sw] i:before,.ch[data-c=sw] i:after{left:0;bottom:0}
.ch[data-c=se] i:before,.ch[data-c=se] i:after{right:0;bottom:0}
.ch[data-c=nw]{left:-11px;top:-11px}
.ch[data-c=ne]{right:-11px;top:-11px}
.ch[data-c=sw]{left:-11px;bottom:-11px}
.ch[data-c=se]{right:-11px;bottom:-11px}
.ch:hover i,.ch:active i{transform:scale(1.16)}
.cbox.live .ch i:before,.cbox.live .ch i:after{animation-duration:1.5s}


@keyframes cropPulse{
  0%,100%{box-shadow:0 0 0 1px rgba(10,26,40,.35),0 0 6px var(--crop-soft);opacity:.94}
  50%{box-shadow:0 0 0 1px rgba(10,26,40,.35),0 0 17px var(--crop-glow);opacity:1}
}


.ce{z-index:13}
.ce:before{content:"";position:absolute;background:var(--crop);border-radius:3px;opacity:.9;
  box-shadow:0 0 8px var(--crop-soft)}
.ce[data-c=n]:before,.ce[data-c=s]:before{left:50%;width:26px;height:4px;margin-left:-13px;top:8px}
.ce[data-c=s]:before{top:auto;bottom:8px}
.ce[data-c=w]:before,.ce[data-c=e]:before{top:50%;height:26px;width:4px;margin-top:-13px;left:8px}
.ce[data-c=e]:before{left:auto;right:8px}


.stage:has(.cropov:not(.off)){overflow:visible}
.stage.fixh:has(.cropov:not(.off)){padding:16px}
.holder:has(.cropov:not(.off)){overflow:visible}
.cfbar{z-index:16}

@media (prefers-reduced-motion:reduce){
  .ch i:before,.ch i:after{animation:none}
}


.fsbtn{top:auto;bottom:8px;right:8px;z-index:8;border-radius:9px;opacity:.72}
.fsbtn:hover,.fsbtn:focus-visible{opacity:1}
.xbtn{z-index:12}

.stage.fixh.done>.holder .fsbtn{display:none}
.ohold .fsbtn{bottom:6px;right:6px}


.stage.sigstage{height:auto;min-height:calc(var(--stgH) + 24px);overflow:visible;
  align-items:stretch;padding:12px}
.stage.sigstage>div{width:100%;min-width:0}
.stage.sigstage.done{height:auto}


#uploadPane.sigpane{position:relative;display:grid;place-items:center;
  min-height:calc(var(--stgH) - 46px)}
#uploadPane.sigpane>.holder{max-width:100%}
.sigdz{position:absolute!important;inset:0;margin:0!important;display:grid;
  place-content:center;justify-items:center;gap:.45rem;padding:1.1rem;z-index:4;
  border:2px dashed var(--border-strong);border-radius:12px;background:var(--surface);
  text-align:center;cursor:pointer;
  transition:border-color var(--t) var(--ease),background var(--t) var(--ease)}
.sigdz:hover,.sigdz.over{border-color:var(--accent);background:var(--accent-soft)}
.sigdz .di{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;
  background:var(--accent-soft);color:var(--accent-text)}
.sigdz b{font-size:1rem}
.sigdz .sub{color:var(--muted);font-size:.84rem}
.sigdz.hide{display:none}
.sigswap{margin-top:.55rem}
.sigswap.hide{display:none}


.drops{display:flex;flex-wrap:wrap;gap:.55rem;margin:.6rem 0 .1rem;padding:.15rem 0 .35rem}
.drops .dlbl{width:100%;font-size:.73rem;color:var(--faint);margin-bottom:.1rem}
.dropb{position:relative;width:54px;height:54px;flex:0 0 auto;padding:0;cursor:pointer;
  border:1px solid var(--border-strong);background:var(--surface);color:var(--text);
  border-radius:52% 52% 52% 8%;transform:rotate(-45deg);overflow:hidden;
  box-shadow:inset 0 -5px 12px rgba(47,111,98,.08),0 2px 7px rgba(35,32,28,.1);
  animation:dropFloat 5.4s var(--ease-io) infinite;
  animation-delay:calc(var(--i,0) * 420ms);
  transition:border-color 220ms var(--ease),background 220ms var(--ease),
    color 220ms var(--ease),box-shadow 220ms var(--ease)}
.dropb .dt{display:grid;place-items:center;width:100%;height:100%;transform:rotate(45deg);
  line-height:1.05;pointer-events:none}
.dropb .dv{font-size:.94rem;font-weight:750;letter-spacing:-.02em}
.dropb .du{font-size:.6rem;font-weight:650;letter-spacing:.08em;color:var(--muted);
  text-transform:uppercase}

.dropb:after{content:"";position:absolute;left:22%;top:16%;width:34%;height:26%;
  border-radius:50%;background:rgba(255,255,255,.6);pointer-events:none;
  animation:dropShine 5.4s var(--ease-io) infinite;
  animation-delay:calc(var(--i,0) * 420ms)}
.dropb:hover{border-color:var(--accent);background:var(--accent-soft);
  box-shadow:inset 0 -6px 14px rgba(47,111,98,.14),0 6px 14px rgba(35,32,28,.14)}
.dropb:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.dropb.on{background:var(--accent-fill);border-color:var(--accent);color:#fff;
  box-shadow:inset 0 -6px 14px rgba(0,0,0,.14),0 6px 16px rgba(47,111,98,.34)}
.dropb.on .du{color:rgba(255,255,255,.86)}
.dropb.on:after{background:rgba(255,255,255,.42)}


.dripple{position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;
  border-radius:50%;border:2px solid var(--accent);opacity:.75;pointer-events:none;
  animation:dropRipple 900ms var(--ease-io) forwards}

@keyframes dropFloat{
  0%,100%{transform:rotate(-45deg) translate3d(0,0,0)}
  50%{transform:rotate(-45deg) translate3d(0,-7px,0)}
}
@keyframes dropShine{
  0%,100%{opacity:.55;transform:translate3d(0,0,0) scale(1)}
  50%{opacity:.85;transform:translate3d(1px,2px,0) scale(1.06)}
}
@keyframes dropRipple{
  from{width:12px;height:12px;margin:-6px 0 0 -6px;opacity:.7}
  to{width:120px;height:120px;margin:-60px 0 0 -60px;opacity:0}
}
@media (max-width:420px){
  .dropb{width:48px;height:48px}
  .dropb .dv{font-size:.85rem}
}
@media (prefers-reduced-motion:reduce){
  .dropb,.dropb:after{animation:none}
  .dripple{display:none}
}


.pnote{display:flex;align-items:flex-start;gap:.5rem;margin:0 0 .85rem;padding:.55rem .65rem;
  background:var(--accent-soft);border:1px solid var(--border);border-radius:var(--r);
  font-size:.78rem;line-height:1.45;color:var(--text)}
.pnote svg{flex:0 0 auto;margin-top:.12rem;color:var(--accent-text)}
.pnote b{font-weight:700}
.pnote .pclear{margin-left:auto;flex:0 0 auto;border:0;background:none;padding:.1rem .2rem;
  color:var(--muted);font-size:.74rem;text-decoration:underline;cursor:pointer}
.pnote .pclear:hover{color:var(--accent-text)}


.ad{position:relative;display:grid;place-items:center;min-height:104px;margin:1.9rem 0;
  padding:1.15rem .8rem .8rem;background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--r-lg);color:var(--faint);font-size:.74rem;letter-spacing:.04em;
  text-transform:none;overflow:hidden}
.ad:before{content:"Advertisement";position:absolute;top:.42rem;left:.7rem;font-size:.58rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--faint);opacity:.75}
.ad>*{max-width:100%}
.ad.tall{min-height:250px}
.ad-end{margin-bottom:.6rem}
.ad:has(iframe),.ad:has(ins){background:transparent}
@media (max-width:920px){
  .ad{min-height:120px;margin:1.4rem 0}
  .ad.tall{min-height:250px}
}



.drop.mini.sigdz{display:grid;place-content:center;justify-items:center;gap:.45rem;
  text-align:center}
.drop.mini.sigdz .sub{display:block}

#uploadPane.sigpane:has(.sigdz:not(.hide)) .fsbtn{display:none}


.odoc.click{cursor:pointer;transition:border-color var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease)}
.odoc.click:hover,.odoc.click:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.odoc.click::after{content:'Preview';flex:0 0 auto;margin-left:.3rem;padding:.28rem .6rem;border-radius:999px;background:var(--accent-soft);color:var(--accent-text);font-size:.68rem;font-weight:650;letter-spacing:.01em}
body.pvlock{overflow:hidden}
.fsov.pdfov{cursor:default;display:flex;flex-direction:column;background:rgba(15,17,21,.94)}
.pvbar{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:rgba(24,27,33,.97);color:#fff;border-bottom:1px solid rgba(255,255,255,.1);flex:0 0 auto}
.pvname{font-size:.78rem;font-weight:650;max-width:32vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pvpages{font-size:.7rem;opacity:.6;white-space:nowrap}
.pvgrow{flex:1 1 auto}
.pvzl{font-size:.74rem;min-width:44px;text-align:center;opacity:.85;font-variant-numeric:tabular-nums}
.pvz,.pvx{display:grid;place-items:center;width:36px;height:36px;flex:0 0 auto;border-radius:9px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;font-size:1.05rem;line-height:1;cursor:pointer;transition:background var(--t-fast) var(--ease)}
.pvz:hover,.pvx:hover,.pvz:focus-visible,.pvx:focus-visible{background:rgba(255,255,255,.16)}
.pvx{font-size:1.35rem}
.pvbar .pvdl{padding:.4rem .85rem}
.pvscroll{flex:1 1 auto;overflow:auto;padding:.9rem .8rem 2.2rem;-webkit-overflow-scrolling:touch}
.pvinner{margin:0 auto;max-width:100%}
.pvpage{position:relative;margin:0 auto 14px;background:#fff;border-radius:6px;box-shadow:0 4px 20px rgba(0,0,0,.45);overflow:hidden}
.pvpage canvas{display:block;width:100%;height:auto}
.pvnum{position:absolute;right:8px;bottom:8px;padding:.12rem .5rem;border-radius:999px;background:rgba(15,17,21,.72);color:#fff;font-size:.66rem;pointer-events:none}
@media (max-width:600px){.pvname{display:none}.pvbar{gap:.4rem}}
@media (prefers-reduced-motion:reduce){.fsov.pdfov{transition:none}}


.qctl{display:flex;gap:.28rem;margin-left:auto}
.qctl button{width:27px;height:27px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:inherit;font-size:.88rem;line-height:1;cursor:pointer;transition:transform .15s,border-color .15s,color .15s}
.qctl button:hover{color:var(--accent-text);border-color:var(--accent);transform:translateY(-1px)}


.ad-slot{position:relative;display:grid;place-items:center;min-height:270px}
.ad-slot__label{font-size:.76rem;letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
.ad-slot__box{position:absolute;inset:0;display:grid;place-items:center}
.ad-slot__box:empty{pointer-events:none}
.consent{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -6px 24px rgba(0,0,0,.08);padding:.8rem 1rem;font-size:.86rem}
.consent .in{max-width:1160px;margin:0 auto;display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;justify-content:space-between}
.consent p{margin:0;flex:1 1 320px;color:var(--muted)}
.consent .acts{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.consent[hidden]{display:none}
.linkbtn{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer;text-decoration:underline}
ul.plain{padding-left:1.1rem}
.read h2{margin-top:1.6rem}
[lang="hi"] body,[lang="hi"] .lede,[lang="hi"] h1,[lang="hi"] h2{font-family:"Noto Sans Devanagari",system-ui,sans-serif}

.drop{padding:1.3rem 1rem;gap:.35rem}
.drop .di{width:38px;height:38px}
.drop b{font-size:.98rem}
#empty.hint{margin-top:.5rem!important;font-size:.78rem}
.wb-panel{padding:12px}
.wb-panel .field{margin-bottom:.5rem;gap:.22rem}
.wb-panel .field label{font-size:.78rem}
.wb-panel input[type=text],.wb-panel input[type=number],.wb-panel input[type=date],.wb-panel select{min-height:36px;padding:.38rem .55rem;font-size:.92rem}
.wb-panel .pt{margin:0 0 .4rem}
.wb-panel .btn.block.lg{padding:.7rem 1rem;font-size:.98rem}
.useg-src{position:absolute!important;width:1px;height:1px;opacity:0;pointer-events:none;overflow:hidden}
.dimf:has(.useg-src){grid-template-columns:minmax(0,1fr) 13px minmax(0,1fr)}
.useg{display:inline-flex;gap:4px;margin:.3rem 0 .1rem;padding:3px;border:1px solid var(--border);border-radius:999px;background:var(--surface-2)}
.useg button{appearance:none;border:0;background:transparent;color:var(--muted);font:inherit;font-size:.78rem;font-weight:600;padding:.28rem .65rem;border-radius:999px;cursor:pointer;line-height:1.2}
.useg button[aria-pressed="true"]{background:var(--accent-fill);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.useg button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.ad-top{min-height:100px;margin:.6rem 0 1rem}
.ad-top .ad-slot__box{min-height:90px}

.wb-panel .duo.compact{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:.45rem;align-items:end}
.wb-panel .duo.compact .field{margin-bottom:.5rem}
.wb-panel .dimf{grid-template-columns:minmax(64px,1fr) 13px minmax(64px,1fr) auto;max-width:300px}
.wb-panel .dimf .unit-fixed{font-size:.8rem;color:var(--muted);padding:0 .3rem}
.wb-panel .szf{grid-template-columns:minmax(0,1fr) 78px}
.wb-panel .szf select,.wb-panel .duo.compact select{padding:.38rem 1.3rem .38rem .5rem;font-size:.86rem}
.wb-panel .useg{margin:.25rem 0 0}
.wb-panel .field label .opt{font-size:.7rem}
.wb-panel details.adv{margin-top:.55rem}
.wb-panel .adv-b .field{margin-bottom:.45rem}
.wb-panel .drops{margin:.1rem 0 .55rem}
.wb-panel .drops .dropb{transform:scale(.86);margin:-4px -3px}
.wb-panel .drops .dlbl{font-size:.74rem}

.vbar button{width:auto;height:auto;min-width:44px;padding:.22rem .4rem;border-radius:10px;display:grid;justify-items:center;gap:1px}
.vbar button .vl{font-size:.58rem;line-height:1;letter-spacing:.01em;color:var(--muted)}
.vbar button.vhide{display:none}
.vbar .vsep{display:none}

.imgacts{position:absolute;top:8px;right:8px;display:grid;gap:6px;z-index:5}
.imgacts button{display:grid;justify-items:center;gap:1px;min-width:54px;padding:.32rem .45rem;border:1px solid var(--border);border-radius:10px;background:rgba(255,255,255,.92);color:var(--text);font:inherit;font-size:.6rem;font-weight:600;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.14);backdrop-filter:blur(3px)}
[data-theme="dim"] .imgacts button{background:rgba(30,32,36,.9)}
.imgacts button svg{width:16px;height:16px}
.imgacts button.on{background:var(--accent-fill);color:#fff;border-color:var(--accent)}
.imgacts[hidden]{display:none}

input[type=number]{-moz-appearance:textfield;appearance:textfield}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.wb-panel details.adv{margin:.2rem 0 .6rem}
.imgacts.out{right:-66px}
.holder{overflow:visible}
.imgacts.out{top:40px}

.rzpop{position:absolute;z-index:7;width:220px;padding:.6rem;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 28px rgba(0,0,0,.18);transform:scale(.15);opacity:0;transform-origin:top left;transition:transform .22s cubic-bezier(.2,.9,.3,1.2),opacity .18s ease}
.rzpop:not(.side){transform-origin:top right}
.rzpop.in{transform:scale(1);opacity:1}
.rzpop .rzrow{display:grid;grid-template-columns:1fr 12px 1fr auto;gap:.3rem;align-items:center}
.rzpop .rzrow .x,.rzpop .rzrow .u{font-size:.78rem;color:var(--muted);text-align:center}
.rzpop input[type=number]{min-height:34px;padding:.3rem .45rem;font-size:.9rem}
.rzpop .checkline{margin:.45rem 0 .4rem;font-size:.8rem}
.rzpop .rzacts{display:flex;gap:.35rem}
.rzpop .rzacts .btn{padding:.35rem .7rem;font-size:.8rem}
.rzpop{line-height:1.3}.rzpop .rzacts .btn{line-height:1.2}

html,body{overflow-x:hidden;max-width:100%}
.hero-art,.hero-art img,.why-grid .art,.why-grid .art img,.cta-art{max-width:100%;height:auto}
@media (max-width:760px){.hgrid{grid-template-columns:1fr}.hero-art{margin:0 auto;width:min(100%,360px)}}

.vbar{display:none}
.rotbtn{position:absolute;z-index:6;display:inline-flex;align-items:center;gap:4px;padding:.26rem .55rem;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.94);color:var(--text);font:inherit;font-size:.62rem;font-weight:600;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.16);white-space:nowrap;transition:top .12s linear,left .12s linear,opacity .15s}
.rotbtn svg{width:14px;height:14px}
.rotbtn.crop{background:var(--accent-fill);color:#fff;border-color:var(--accent)}
.rotbtn[hidden]{display:none}
[data-theme="dim"] .rotbtn{background:rgba(30,32,36,.92)}

.useg{width:max-content;align-self:flex-start;gap:2px;padding:2px;background:var(--surface-2);border-color:var(--border)}
.useg button{padding:.24rem .55rem;font-size:.74rem}
.useg button[aria-pressed="true"]{background:linear-gradient(135deg,#2f6f62 0%,#1c4a41 100%);color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.18)}

@media (max-width:600px){
  .wb-panel input[type=text],.wb-panel input[type=number],.wb-panel input[type=date],.wb-panel select{min-height:34px;padding:.32rem .5rem;font-size:.88rem}
  .wb-panel .dimf{max-width:250px;grid-template-columns:minmax(56px,1fr) 12px minmax(56px,1fr) auto}
  .wb-panel .szf{grid-template-columns:minmax(0,1fr) 70px;max-width:250px}
  .wb-panel .field label{font-size:.74rem}
  .wb-panel .drops .dropb{transform:scale(.8);margin:-6px -4px}
}
.useg-src{width:1px!important;height:1px!important;min-height:0!important;left:0;top:0;margin:0!important;padding:0!important;border:0!important}
.stage{padding-bottom:34px}
.rzpop.sheet{position:fixed;left:10px;right:10px;width:auto;top:auto;bottom:10px;z-index:80;padding:.75rem .8rem;border-radius:14px;box-shadow:0 -6px 30px rgba(0,0,0,.22)}
.rzpop.sheet .rzrow{grid-template-columns:1fr 14px 1fr auto}
.rzpop.sheet input[type=number]{min-height:40px;font-size:1rem}
.rzpop.sheet .rzacts .btn{padding:.5rem 1rem;font-size:.9rem}
.drops{display:none!important}
.rotbtn{padding:0;width:34px;height:34px;justify-content:center;border-radius:50%}
.rotbtn svg{width:19px;height:19px}

.wb-panel .dimf{grid-template-columns:minmax(0,74px) 12px minmax(0,74px) auto;max-width:none;gap:.3rem;align-items:center}
.wb-panel .dimf input[type=number]{min-height:32px;padding:.28rem .45rem;font-size:.86rem}
.wb-panel .dimf .useg{margin:0 0 0 .15rem;align-self:center}
.wb-panel .szf{grid-template-columns:110px 66px;max-width:none}
.wb-panel .szf input[type=number]{min-height:32px;padding:.28rem .45rem;font-size:.86rem}
.wb-panel .szf select{min-height:32px;padding:.2rem 1.2rem .2rem .45rem;font-size:.82rem}
.wb-panel .duo.compact input,.wb-panel .duo.compact select{min-height:32px;padding:.28rem .5rem;font-size:.86rem}
.wb-panel .field{margin-bottom:.45rem}

.useg,.wb-panel .useg{background:rgba(135,206,250,.2);border:1px solid rgba(135,206,250,.5);padding:2px;gap:2px}
.useg button{padding:.2rem .45rem;font-size:.7rem;color:var(--muted)}
.useg button[aria-pressed="true"]{background:#1a73e8;color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2)}
@media (max-width:600px){
  .wb-panel .dimf{grid-template-columns:66px 12px 66px auto}
  .wb-panel .dimf .useg{margin-left:.1rem}
  .useg button{padding:.2rem .4rem;font-size:.68rem}
}
@media (max-width:359px){.wb-panel .dimf{grid-template-columns:60px 10px 60px auto}}
.wb-panel .szf{grid-template-columns:110px 74px}.wb-panel .szf select{padding:.2rem 1.25rem .2rem .5rem}

.stage .result .orow{flex-wrap:wrap;row-gap:.55rem}
.stage .result .osz{flex:1 1 100%;text-align:center}
.stage .result .osz .meta{max-width:320px;margin:0 auto}
.stage .result .orow .btn{min-width:118px}

body.fk-done .wb-view>.field,body.fk-done .wb-view .calc{display:none}

.tsearch{max-width:640px;margin:0 auto 1.1rem;display:flex;flex-direction:column;gap:.55rem;align-items:center}
.tsearch input[type=search]{width:100%;min-height:44px;font-size:16px;padding:.5rem .9rem;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--surface);color:var(--text)}
.tsearch input[type=search]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tfilters{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:center}
.tfilters button{min-height:32px;padding:.3rem .8rem;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--surface);color:var(--muted);font-size:.85rem;font-weight:600;cursor:pointer}
.tfilters button[aria-pressed="true"]{background:var(--accent-fill);color:#fff;border-color:var(--accent)}
.tcount{font-size:.85rem;margin:0;min-height:1.2em}
.tempty{text-align:center;margin:.6rem 0 0}
.tempty.hide,.tgrid.hide,.ghead.hide,.tcard.hide{display:none}
.tcard.vis{opacity:1;transform:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

.stage .result .oextra{display:flex;gap:1rem;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:.1rem}
.olink{display:inline-flex;align-items:center;gap:.3rem;background:none;border:0;padding:.35rem .4rem;min-height:24px;color:var(--accent-text);font-size:.86rem;font-weight:600;cursor:pointer;text-decoration:none}
.olink:hover{text-decoration:underline}

.useg button{min-height:24px}
@media (max-width:600px){
  .wb-panel input[type=number],.wb-panel input[type=text],.wb-panel input[type=date],.wb-panel select{font-size:16px!important;min-height:36px}
  .wb-panel .dimf{grid-template-columns:72px 12px 72px auto}
  .wb-panel .szf{grid-template-columns:104px 74px}
  .useg button{padding:.22rem .42rem}
  .hero{padding-top:.9rem}
  .hero h1{font-size:clamp(1.55rem,7vw,2.1rem);margin-bottom:.45rem}
  .hero .lede{font-size:.98rem}
}


.tcard .ico.tico{width:72px;height:72px;border-radius:18px;background:var(--accent-soft,#e6f1ee);overflow:hidden}
.tcard .ico.tico img{width:66px;height:66px;object-fit:contain;display:block}
html[data-theme=dim] .tcard .ico.tico{background:rgba(255,255,255,.08)}

.lang-btn{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:32px;padding:0 .55rem;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--surface);color:var(--text);font-weight:700;font-size:.82rem;text-decoration:none;line-height:1}
.lang-btn:hover{background:var(--accent-soft);color:var(--accent-text);border-color:var(--accent);text-decoration:none}
@media (max-width:860px){.hdr .in{gap:.45rem}.lang-btn{min-width:36px;height:30px;font-size:.78rem}}

.tgrid .tcard{padding:.9rem .95rem}
.tgrid .tcard .ico.tico{width:56px;height:56px;border-radius:14px;margin-bottom:.55rem}
.tgrid .tcard .ico.tico img{width:50px;height:50px}
.tgrid .tcard h3{font-size:1rem;margin-bottom:.25rem}
.tgrid .tcard p{font-size:.84rem;line-height:1.42;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.tsr{width:100%;max-width:640px;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:.55rem .7rem .3rem;box-shadow:var(--sh-lg)}
.tsr[hidden]{display:none}
.tsr-h{font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 .3rem;font-weight:700}
.tsr ul{list-style:none;margin:0;padding:0}
.tsr li a{display:flex;align-items:center;gap:.6rem;padding:.42rem .3rem;border-radius:var(--r);text-decoration:none;color:var(--text);min-height:36px}
.tsr li a:hover,.tsr li a:focus-visible{background:var(--accent-soft)}
.tsr .tg{flex:0 0 auto;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:.15rem .45rem;border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent-text)}
.tsr .tn{font-weight:600;font-size:.92rem}
.tsr .ts{margin-left:auto;font-size:.78rem;color:var(--muted);white-space:nowrap}
@media (max-width:600px){.tsr .ts{display:none}}
.wb-view .field.straighten{margin-top:1.6rem}
.drop.mini .sub{display:block;margin-top:.15rem}
.duo.compact label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:600px){.duo.compact label .opt{display:none}}


.grid.tgrid-compact{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;max-width:1000px;margin:0 auto}
.tgrid-compact .tcard{padding:.8rem .85rem .75rem;min-height:0;display:flex;flex-direction:column}
.tgrid-compact .tcard .ico.tico{width:52px;height:52px;border-radius:14px;margin-bottom:.5rem}
.tgrid-compact .tcard .ico.tico img{width:48px;height:48px}
.tgrid-compact .tcard h3{font-size:.98rem;margin:0 0 .25rem;line-height:1.25}
.tgrid-compact .tcard p{font-size:.8rem;line-height:1.4;margin:0 0 .5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tgrid-compact .tcard .go{font-size:.8rem;margin-top:auto}
.tgrid-compact .tcard.hide{display:none}
@media (max-width:1023px){.grid.tgrid-compact{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.grid.tgrid-compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}
  .tgrid-compact .tcard{padding:.7rem .7rem .65rem}.tgrid-compact .tcard .ico.tico{width:44px;height:44px;border-radius:12px;margin-bottom:.4rem}.tgrid-compact .tcard .ico.tico img{width:40px;height:40px}
  .tgrid-compact .tcard h3{font-size:.9rem}.tgrid-compact .tcard p{font-size:.74rem;-webkit-line-clamp:2}.tgrid-compact .tcard .go{font-size:.76rem}}

.nitem{position:relative;display:flex;align-items:center}
.ncaret{display:none;width:28px;height:28px;border:0;background:none;color:var(--muted);border-radius:var(--r-pill);cursor:pointer;place-items:center}
.megamenu{position:absolute;top:calc(100% + 8px);left:0;min-width:520px;display:none;grid-template-columns:1fr 1fr;gap:.15rem .5rem;padding:.6rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-lg);z-index:60}
.megamenu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.mitem{display:flex;align-items:center;gap:.6rem;padding:.45rem .55rem;border-radius:var(--r);text-decoration:none;color:var(--text)}
.mitem:hover,.mitem:focus-visible{background:var(--accent-soft);text-decoration:none}
.mitem img{width:40px;height:40px;flex:0 0 40px;border-radius:10px;background:var(--accent-soft)}
.mitem span{display:flex;flex-direction:column;line-height:1.2}
.mitem b{font-size:.9rem;font-weight:650}.mitem small{font-size:.74rem;color:var(--muted)}
.mall{grid-column:1/-1;text-align:right;font-size:.82rem;font-weight:650;color:var(--accent-text);padding:.35rem .55rem .1rem;text-decoration:none}
@media (min-width:861px){
  .nitem.has-menu:hover .megamenu,.nitem.has-menu:focus-within .megamenu,.nitem.has-menu.open .megamenu{display:grid}
}
@media (max-width:860px){
  .nitem{flex-wrap:wrap}.nitem>a{flex:1}
  .ncaret{display:grid}
  .megamenu{position:static;min-width:0;width:100%;box-shadow:none;border:0;border-left:2px solid var(--border);border-radius:0;padding:.2rem 0 .3rem .6rem;margin:0 0 .3rem .6rem;grid-template-columns:1fr}
  .nitem.open .megamenu{display:grid}
  .mitem{padding:.4rem .4rem}.mitem img{width:32px;height:32px;flex-basis:32px}
  .mall{text-align:left}
}
.tgrid-compact .tcard.rv,.tgrid .tcard.rv{opacity:1;transform:none}

@media (max-width:600px){
  .sec.read[data-collapsed="true"]{position:relative;max-height:384px;overflow:hidden;padding-bottom:4rem}
  .sec.read[data-collapsed="true"]::after{content:"";position:absolute;inset:auto 0 0;height:8rem;background:linear-gradient(to bottom,transparent,var(--bg) 58%);pointer-events:none}
  .sec.read>.readmore{display:inline-flex;margin-top:.5rem}
  .sec.read[data-collapsed="true"]>.readmore{position:absolute;left:0;bottom:.5rem;z-index:2}
}
@media (min-width:601px){.sec.read>.readmore{display:none}}

.page-nav{display:none}
@media (min-width:1024px){
  .page-nav{position:sticky;top:68px;z-index:45;display:flex;width:max-content;max-width:100%;gap:.25rem;margin:.6rem 0 1rem;padding:.3rem;overflow-x:auto;white-space:nowrap;background:color-mix(in srgb,var(--bg) 94%,transparent);border:1px solid var(--border);border-radius:var(--r-pill);box-shadow:var(--sh);backdrop-filter:blur(10px)}
  .page-nav a{padding:.34rem .7rem;border-radius:var(--r-pill);color:var(--muted);font-size:.84rem;font-weight:600;text-decoration:none}
  .page-nav a:hover{color:var(--text)}
  .page-nav a[aria-current]{color:var(--accent-text);background:var(--accent-soft)}
  #tool,#guide,#sizes,#steps,#faq{scroll-margin-top:128px}
}
.tool-sec{margin:0;padding:0}

@media (max-width:380px){
  .wb-panel .dimf,.dimf{grid-template-columns:minmax(0,1fr) 10px minmax(0,1fr);max-width:none;gap:.28rem;row-gap:.3rem}
  .wb-panel .dimf .useg,.dimf .useg{grid-column:1/-1;margin:.25rem 0 0;justify-self:start}
  .wb-panel .dimf .unit-fixed{grid-column:1/-1;padding:0}
  .wb-panel .szf,.szf{grid-template-columns:minmax(0,1fr) 72px;max-width:none}
  .wb-panel .duo.compact{grid-template-columns:minmax(0,1fr)}
  .wb,.wb-panel,.stage,.wb-view{min-width:0}
  .stage.empty>#dropWrap{max-width:100%}
  .page-nav,.tsr .ts{max-width:100%}
  .rzpop{width:auto;left:8px;right:8px}
}




.fk-mode-bar,.stage .tabs{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:4px;background:var(--surface-2);border:1px solid var(--border);border-radius:11px;margin:0 0 .7rem;position:relative;isolation:isolate;box-shadow:inset 0 1px 2px rgba(22,22,30,.06)}
.fk-mode-bar::before,.stage .tabs::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:8px;background:linear-gradient(180deg,#ffffff 0%,#f8f8fc 100%);border:1px solid rgba(22,22,30,.08);box-shadow:0 2px 6px rgba(22,22,30,.09),0 1px 2px rgba(22,22,30,.05),inset 0 1px 0 rgba(255,255,255,.95);transition:transform .28s cubic-bezier(.22,1,.36,1);z-index:0;pointer-events:none}
html[data-theme=dim] .fk-mode-bar::before,html[data-theme=dim] .stage .tabs::before{background:linear-gradient(180deg,#2f2f3b 0%,#262630 100%);border-color:rgba(255,255,255,.1);box-shadow:0 2px 6px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.1)}
.fk-mode-bar[data-active="sig"]::before,.fk-mode-bar:has(.fk-mode-btn[data-mode="sig"][aria-selected="true"])::before,.stage .tabs[data-active="draw"]::before,.stage .tabs:has(button:nth-child(2)[aria-selected="true"])::before,.stage .tabs:has(button:nth-child(2).on)::before{transform:translateX(100%)}
.fk-mode-btn,.stage .tabs button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:6px 8px;border:0!important;border-radius:8px;background:transparent!important;box-shadow:none!important;color:var(--muted);font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s var(--ease),transform .18s var(--ease)}
.fk-mode-btn svg{width:15px;height:15px;flex:0 0 15px;stroke-width:2.1;transition:transform .22s cubic-bezier(.22,1,.36,1),color .2s var(--ease)}
.fk-mode-btn .fk-m-sub{font-size:11px;font-weight:500;color:var(--muted);opacity:.85;transition:color .2s var(--ease)}
.fk-mode-btn:hover,.stage .tabs button:hover{color:var(--heading)}
.fk-mode-btn:active,.stage .tabs button:active{transform:scale(.97)}
.fk-mode-btn[aria-selected="true"],.stage .tabs button[aria-selected="true"],.stage .tabs button.on{color:var(--heading)}
.fk-mode-btn[aria-selected="true"] svg{color:var(--accent-text);transform:scale(1.08)}
.fk-done-dot{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;background:linear-gradient(180deg,#25a267 0%,#1b7f4e 100%);color:#fff;font-size:10px;line-height:1;flex:0 0 15px;box-shadow:0 1px 3px rgba(27,127,78,.3)}
.fk-done-dot[hidden]{display:none}
@keyframes fkModeMorph{from{opacity:.35;transform:translateY(4px)}to{opacity:1;transform:none}}
.wb-panel.fk-mode-anim .field,.wb-panel.fk-mode-anim .fk-cap-toggle,.wb-panel.fk-mode-anim #go{animation:fkModeMorph .22s cubic-bezier(.22,1,.36,1) both}


.fk-cap-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;margin:0 0 .55rem;border:1px solid var(--border-strong);border-radius:9px;background:linear-gradient(180deg,var(--surface) 0%,var(--surface-2) 100%);color:var(--heading);font-size:12.5px;font-weight:600;cursor:pointer;text-align:left;box-shadow:0 1px 2px rgba(22,22,30,.05),inset 0 1px 0 rgba(255,255,255,.75);transition:transform .15s var(--ease),border-color .15s var(--ease),box-shadow .15s var(--ease),background .15s var(--ease)}
html[data-theme=dim] .fk-cap-toggle{box-shadow:0 1px 2px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.06)}
.fk-cap-toggle:hover{border-color:var(--heading);transform:translateY(-1px);box-shadow:0 3px 8px rgba(22,22,30,.08),inset 0 1px 0 rgba(255,255,255,.85)}
.fk-cap-toggle:active{transform:translateY(0) scale(.99)}
.fk-cap-toggle .fk-ct-l{display:inline-flex;align-items:center;gap:6px}
.fk-cap-toggle .fk-ct-l svg{width:15px;height:15px;color:var(--accent-text);transition:transform .2s var(--ease)}
.fk-cap-toggle .fk-ct-r{font-size:11px;font-weight:500;color:var(--muted);padding:1px 7px;border-radius:999px;background:var(--surface-3)}
.fk-cap-toggle[aria-expanded="true"]{border-color:var(--accent-text);background:var(--accent-soft)}
.fk-cap-toggle[aria-expanded="true"] .fk-ct-l svg{transform:scale(1.08)}
.fk-cap-box:not(.hide){animation:fkModeMorph .2s cubic-bezier(.22,1,.36,1) both}
.fk-cap-box.hide,.wb-panel[data-mode="sig"] #fkCapToggle,.wb-panel[data-mode="sig"] #fkCapBox{display:none!important}


.fk-kb-pills{display:flex;flex-wrap:wrap;gap:5px;margin:.38rem 0 .12rem}
.fk-kb-pill{display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:2px 10px;border-radius:999px;border:1px solid var(--border-strong);background:linear-gradient(180deg,var(--surface) 0%,var(--surface-2) 100%);color:var(--heading);font-size:11.5px;font-weight:600;cursor:pointer;white-space:nowrap;box-shadow:0 1px 2px rgba(22,22,30,.05),inset 0 1px 0 rgba(255,255,255,.75);transition:transform .15s var(--ease),border-color .15s var(--ease),background .15s var(--ease),color .15s var(--ease),box-shadow .15s var(--ease)}
html[data-theme=dim] .fk-kb-pill{box-shadow:0 1px 2px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.06)}
.fk-kb-pill:hover{transform:translateY(-1px);border-color:var(--accent-text);color:var(--accent-text);box-shadow:0 2px 5px rgba(22,22,30,.08)}
.fk-kb-pill:active{transform:translateY(0) scale(.96)}
.fk-kb-pill.on{background:linear-gradient(180deg,#e03630 0%,#c9261f 100%);border-color:#b01c16;color:#fff;box-shadow:0 2px 6px rgba(201,38,31,.28),inset 0 1px 0 rgba(255,255,255,.26)}


.stage .result .orow{display:flex;flex-direction:column;align-items:stretch;gap:.55rem;width:100%;max-width:440px;margin:0 auto}
.stage .result .orow>#dl{width:100%;justify-content:center;min-height:44px;font-size:14.5px;border-radius:10px}
.r-sub-acts{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:8px;width:100%}
.btn.ghost,.r-sub-acts .btn{background:linear-gradient(180deg,var(--surface) 0%,var(--surface-2) 100%)!important;border:1px solid var(--border-strong)!important;color:var(--heading)!important;border-radius:9px;box-shadow:0 1px 2px rgba(22,22,30,.06),inset 0 1px 0 rgba(255,255,255,.8);transition:transform .16s var(--ease),border-color .16s var(--ease),box-shadow .16s var(--ease),color .16s var(--ease)}
html[data-theme=dim] .btn.ghost,html[data-theme=dim] .r-sub-acts .btn{box-shadow:0 1px 2px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.07)}
.btn.ghost:hover,.r-sub-acts .btn:hover{transform:translateY(-1px);border-color:var(--heading)!important;box-shadow:0 3px 8px rgba(22,22,30,.1),inset 0 1px 0 rgba(255,255,255,.9)}
.btn.ghost:active,.r-sub-acts .btn:active{transform:translateY(.5px) scale(.985)}
.r-sub-acts .btn{width:100%!important;min-width:0!important;min-height:38px;padding:.44rem .7rem;font-size:12.5px;font-weight:600;white-space:nowrap;justify-content:center;display:inline-flex;align-items:center;gap:6px}
.r-sub-acts .btn svg{width:15px;height:15px;flex:0 0 15px}
.btn-handoff:hover{border-color:var(--accent-text)!important;color:var(--accent-text)!important}
.btn-handoff .arr-ic{transition:transform .2s var(--ease)}
.btn-handoff:hover .arr-ic{transform:translateX(3px)}


.fk-next-card{margin:.6rem auto 0;padding:11px 14px;border-radius:11px;border:1.5px solid #2fb56b;background:linear-gradient(180deg,rgba(47,181,107,.11),rgba(47,181,107,.03));box-shadow:0 4px 14px -4px rgba(30,142,90,.15),inset 0 1px 0 rgba(255,255,255,.6);display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;text-align:left;width:100%;max-width:440px;animation:fkPopIn .28s cubic-bezier(.22,1,.36,1) both}
html[data-theme=dim] .fk-next-card{box-shadow:0 4px 14px -4px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)}
.fk-next-card[hidden]{display:none!important}
.fk-next-card.fk-next-pulse{box-shadow:0 0 0 3px rgba(47,181,107,.28)}
.fk-nc-copy{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 140px}
.fk-nc-eyebrow{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#1b7f4e;display:inline-flex;align-items:center;gap:4px}
html[data-theme=dim] .fk-nc-eyebrow{color:#5cd695}
.fk-nc-title{font-size:13px;font-weight:600;color:var(--heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fk-nc-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:6px 13px;border-radius:9px;border:0;background:linear-gradient(180deg,#25a267 0%,#1b7f4e 100%);color:#fff;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;flex:0 0 auto;box-shadow:0 2px 6px rgba(27,127,78,.3),inset 0 1px 0 rgba(255,255,255,.26),inset 0 -1px 0 rgba(0,0,0,.15);transition:transform .16s var(--ease),filter .16s var(--ease),box-shadow .16s var(--ease)}
.fk-nc-btn:hover{filter:brightness(1.05);transform:translateY(-1px);box-shadow:0 4px 12px rgba(27,127,78,.38),inset 0 1px 0 rgba(255,255,255,.32)}
.fk-nc-btn:active{transform:translateY(.5px) scale(.985)}
.fk-nc-btn svg{width:15px;height:15px;flex:0 0 15px}
.fk-nc-btn .arr-ic{animation:fkArrowNudge .9s var(--ease) 200ms 2;transition:transform .18s var(--ease)}
.fk-nc-btn:hover .arr-ic{transform:translateX(2.5px)}
.fk-next-done{margin:.55rem auto 0;padding:8px 12px;border-radius:9px;border:1px solid rgba(47,181,107,.45);background:linear-gradient(180deg,rgba(47,181,107,.12),rgba(47,181,107,.05));color:#1b7f4e;font-size:12.5px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;max-width:440px;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
html[data-theme=dim] .fk-next-done{color:#5cd695;box-shadow:none}
.fk-next-done[hidden]{display:none!important}
.fk-next-done svg{width:16px;height:16px;stroke-dasharray:24;stroke-dashoffset:0;animation:fkCheckDraw .35s ease-out both}
@keyframes fkPopIn{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
@keyframes fkArrowNudge{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
@keyframes fkCheckDraw{from{stroke-dashoffset:24}to{stroke-dashoffset:0}}


.qrow.qrow-dl{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:7px 10px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 1px 2px rgba(22,22,30,.04);transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
.qrow.qrow-dl:hover{border-color:var(--border-strong);box-shadow:0 2px 6px rgba(22,22,30,.06)}
.qrow.qrow-dl .qthumb{width:44px;height:44px;object-fit:cover;border-radius:7px;border:1px solid var(--border);background:var(--surface-2)}
.qrow.qrow-dl .qmeta{min-width:0;display:flex;flex-direction:column;gap:2px}
.qrow.qrow-dl .qmeta b{font-size:13px;font-weight:600;color:var(--heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.qrow.qrow-dl .qmeta span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.qkb-wrap{display:inline-flex;align-items:center;height:32px;padding:0 6px 0 2px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface-2);flex:0 0 auto;box-shadow:inset 0 1px 2px rgba(22,22,30,.04);transition:border-color .15s,background .15s}
.qkb-wrap:focus-within{border-color:var(--accent-text);background:var(--surface)}
.qkb-in{width:48px!important;min-height:28px!important;height:28px!important;padding:0 3px 0 5px!important;border:0!important;background:transparent!important;font-size:12.5px!important;font-weight:600;color:var(--heading);text-align:right;box-shadow:none!important;outline:none!important}
.qkb-u{font-size:10.5px;font-weight:700;color:var(--muted);margin-left:2px;pointer-events:none;user-select:none}
.qdl-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:32px;padding:0 11px;border-radius:8px;border:1px solid var(--border-strong);background:linear-gradient(180deg,var(--surface) 0%,var(--surface-2) 100%);color:var(--heading);font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;flex:0 0 auto;box-shadow:0 1px 2px rgba(22,22,30,.06),inset 0 1px 0 rgba(255,255,255,.8);transition:transform .15s var(--ease),background .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease),box-shadow .15s var(--ease)}
html[data-theme=dim] .qdl-btn{box-shadow:0 1px 2px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.07)}
.qdl-btn:hover{transform:translateY(-1px);background:linear-gradient(180deg,#e03630 0%,#c9261f 100%);color:#fff;border-color:#b01c16;box-shadow:0 3px 8px rgba(201,38,31,.28),inset 0 1px 0 rgba(255,255,255,.25)}
.qdl-btn:active{transform:translateY(0) scale(.97)}
.qdl-btn svg{width:13px;height:13px;flex:0 0 13px}
.qdl-btn:disabled{opacity:.55;pointer-events:none}
@media (max-width:420px){
  .qrow.qrow-dl{grid-template-columns:38px minmax(0,1fr) auto auto;gap:6px;padding:6px 7px}
  .qrow.qrow-dl .qthumb{width:38px;height:38px}
  .qkb-in{width:40px!important;font-size:12px!important}
  .qdl-btn{padding:0 8px;font-size:11.5px}
  .fk-mode-btn .fk-m-sub{display:none}
  .fk-nc-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .fk-next-card,.fk-nc-btn .arr-ic,.fk-next-done svg,.wb-panel.fk-mode-anim .field,.wb-panel.fk-mode-anim .fk-cap-toggle,.wb-panel.fk-mode-anim #go,.fk-cap-box:not(.hide){animation:none!important}
  .fk-mode-bar::before,.stage .tabs::before{transition:none!important}
}