/* Fileora theme */
:root{
  --paper:#F2F3F8; --surface:#FFFFFF; --surface-2:#F7F8FC; --sunken:#E9EBF3;
  --ink:#16182F; --ink-2:#3B3F5E; --muted:#5C6184; --faint:#656A8A;
  --line:#E1E3EE; --line-2:#CBCEDF;
  --hl:#FFD43B; --hl-2:#F2C200; --on-hl:#16182F;
  --stage:#16182F; --stage-line:rgba(255,255,255,.12);
  --ok:#087A44; --err:#C42B31;
  --c-organize:#2F6BF3; --c-optimize:#0E9F57; --c-to:#E07F06; --c-from:#E0464C;
  --c-edit:#8A4FD6; --c-security:#3E4C7A; --c-ai:#0A98B8; --c-image:#D1367E;
  --logo-bg:#16182F;
  --r-xl:28px;
  --sh-1:0 1px 2px rgba(22,24,47,.06),0 1px 1px rgba(22,24,47,.03);
  --sh-pop:0 30px 70px -18px rgba(22,24,47,.35),0 2px 8px rgba(22,24,47,.08);
  --font-d:'Bricolage Grotesque','Geist',system-ui,sans-serif;
  --font:'Geist',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue','Noto Sans Devanagari',sans-serif;
  --hdr:68px;
  color-scheme:light;
}
[data-theme="dark"]{
  --paper:#0E1020; --surface:#161A2F; --surface-2:#1B1F37; --sunken:#11142A;
  --ink:#EEF0FA; --ink-2:#C4C8DE; --muted:#A3A8C4; --faint:#858AA8;
  --line:#262A45; --line-2:#363B5D;
  --stage:#141731; --stage-line:rgba(255,255,255,.1);
  --c-organize:#6B97FF; --c-optimize:#33C07C; --c-to:#F5A23A; --c-from:#FF7377;
  --c-edit:#B289F3; --c-security:#93A3DC; --c-ai:#3CC6E3; --c-image:#F27AB3;
  --logo-bg:#2A2E52;
  --ok:#3CC680; --err:#FF8A8D;
  --sh-1:0 1px 2px rgba(0,0,0,.3);
  --sh-pop:0 30px 80px -20px rgba(0,0,0,.7),0 2px 8px rgba(0,0,0,.4);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 70px)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
body.locked{overflow:hidden}
img,svg,canvas,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
h1,h2,h3,h4{margin:0;font-weight:700;line-height:1.15}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:6px}
.sr,.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px;padding:0;border:0}
.wrap{width:min(1240px,100% - 48px);margin-inline:auto}
.skip{position:fixed;left:16px;top:-60px;z-index:999;background:var(--hl);color:var(--on-hl);padding:10px 14px;border-radius:10px;font-weight:600}
.skip:focus{top:12px}

/* icons */
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic-sm{width:16px;height:16px}
.ic-lg{width:26px;height:26px}
kbd{font:500 12px/1 var(--font);border:1px solid var(--line-2);border-bottom-width:2px;border-radius:6px;padding:3px 6px;color:var(--muted);background:var(--surface-2)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:12px;font-weight:600;font-size:15px;white-space:nowrap;transition:background .15s,color .15s,border-color .15s,transform .15s;border:1px solid transparent;position:relative}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.38;pointer-events:none}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{background:color-mix(in srgb,var(--ink) 86%,var(--paper))}
.btn-hl{background:var(--hl);color:var(--on-hl)}
.btn-hl:hover{background:var(--hl-2)}
.btn-line{border-color:var(--line-2);background:var(--surface)}
.btn-line:hover{border-color:var(--ink)}
.btn-quiet{color:var(--ink-2)}
.btn-quiet:hover{background:var(--sunken)}
.btn-sm{height:36px;padding:0 12px;font-size:14px;border-radius:10px}
.btn-lg{height:52px;padding:0 24px;font-size:16px;border-radius:14px}
.icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:11px;color:var(--ink-2);transition:background .15s,color .15s}
.icon-btn:hover{background:var(--sunken);color:var(--ink)}
.icon-btn.sm{width:32px;height:32px;border-radius:9px}

/* tiles */
.tile{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;color:var(--c,var(--ink));background:color-mix(in srgb,var(--c,var(--ink)) 13%,transparent);flex:none}
.tile .ic{width:22px;height:22px}
.tile.sm{width:30px;height:30px;border-radius:9px}
.tile.sm .ic{width:16px;height:16px}
.tile.lg{width:64px;height:64px;border-radius:18px}
.tile.lg .ic{width:30px;height:30px}
[data-cat="organize"]{--c:var(--c-organize)}[data-cat="optimize"]{--c:var(--c-optimize)}[data-cat="to"]{--c:var(--c-to)}[data-cat="from"]{--c:var(--c-from)}
[data-cat="edit"]{--c:var(--c-edit)}[data-cat="security"]{--c:var(--c-security)}[data-cat="ai"]{--c:var(--c-ai)}[data-cat="image"]{--c:var(--c-image)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--c);flex:none}
.chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 10px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:14px;font-weight:500;transition:border-color .15s}
.chip:hover{border-color:var(--c,var(--line-2))}
.chip .ic{width:16px;height:16px;color:var(--c)}
.tag{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 8px;border-radius:7px;font-size:12px;font-weight:500;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line)}
.tag .ic{width:13px;height:13px}
.tag-new{background:var(--hl);border-color:var(--hl);color:#16182F;font-weight:600}
.tag-local .ic{color:var(--ok)}
.tag-srv .ic{color:var(--c-organize)}

/* header */
.hdr{position:sticky;top:0;z-index:60;height:var(--hdr);background:color-mix(in srgb,var(--paper) 84%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.admin-bar .hdr{top:32px}
@media (max-width:782px){.admin-bar .hdr{top:46px}}
@media (max-width:600px){.admin-bar .hdr{top:0}}
.hdr.scrolled{border-bottom-color:var(--line)}
.hdr-in{height:100%;display:flex;align-items:center;gap:28px}
.logo{display:inline-flex;align-items:center;gap:10px;font:800 1.32rem/1 var(--font-d);letter-spacing:-.035em}
.logo svg{width:32px;height:32px}
.logo img{max-height:36px;width:auto}
.lm-bg{fill:var(--logo-bg)}
.nav{display:flex;align-items:center;gap:2px}
.nav>ul{display:flex;align-items:center;gap:2px}
.nav a,.nav-btn{display:inline-flex;align-items:center;gap:4px;height:38px;padding:0 12px;border-radius:10px;font-size:15px;font-weight:500;color:var(--ink-2);transition:background .15s,color .15s;white-space:nowrap}
.nav a:hover,.nav-btn:hover,.nav-btn[aria-expanded="true"],.nav .current-menu-item>a{background:var(--sunken);color:var(--ink)}
.nav-btn .ic{width:16px;height:16px;transition:transform .2s}
.nav-btn[aria-expanded="true"] .ic{transform:rotate(180deg)}
.nav .sub-menu{display:none}
.hdr-actions{margin-left:auto;display:flex;align-items:center;gap:6px}
.search-trigger{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 8px 0 12px;border-radius:11px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:14px;min-width:210px;transition:border-color .15s}
.search-trigger:hover{border-color:var(--line-2)}
.search-trigger kbd{margin-left:auto}
.btn-link{height:40px;display:inline-flex;align-items:center;padding:0 12px;font-weight:600;font-size:15px;border-radius:10px}
.btn-link:hover{background:var(--sunken)}
.menu-btn{display:none}
.theme-toggle .moon{display:none}
[data-theme="dark"] .theme-toggle .sun{display:none}
[data-theme="dark"] .theme-toggle .moon{display:block}

/* mega menu */
.mega{position:absolute;left:0;right:0;top:100%;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:0 24px 40px -24px rgba(22,24,47,.25);padding:26px 0 30px;max-height:calc(100vh - var(--hdr));overflow:auto}
.mega-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 28px}
.mega-col h4{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:8px}
.mega-col a{display:flex;align-items:center;gap:10px;padding:6px 8px;margin-left:-8px;border-radius:10px;font-size:14.5px;font-weight:500}
.mega-col a:hover{background:var(--sunken)}
.mega-col .more{color:var(--muted);font-size:13.5px}

/* drawer (mobile) */
.drawer{position:fixed;inset:0;z-index:90}
.drawer-bg{position:absolute;inset:0;background:rgba(14,16,32,.45)}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(400px,100%);background:var(--paper);display:flex;flex-direction:column;box-shadow:var(--sh-pop)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;height:var(--hdr);padding:0 16px;border-bottom:1px solid var(--line)}
.drawer-body{flex:1;overflow:auto;padding:16px}
.drawer-body .search-trigger{width:100%;height:48px;margin-bottom:12px}
.drawer-body .search-trigger span{display:inline}
.drawer details{border-bottom:1px solid var(--line)}
.drawer summary{list-style:none;display:flex;align-items:center;gap:10px;padding:14px 4px;font-weight:600;cursor:pointer}
.drawer summary::-webkit-details-marker{display:none}
.drawer summary .ic{margin-left:auto;transition:transform .2s;color:var(--muted)}
.drawer details[open] summary .ic{transform:rotate(180deg)}
.drawer details a{display:flex;align-items:center;gap:10px;padding:8px 4px;font-size:15px}
.drawer details>div{padding-bottom:10px}
.drawer-links{display:grid;gap:2px;padding:12px 0}
.drawer-links a{padding:10px 4px;font-weight:500;display:block}
.drawer-cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px;border-top:1px solid var(--line)}

/* hero */
.hero{padding:44px 0 24px}
.hero-in{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:56px;align-items:center}
.h-display{font:800 clamp(2.5rem,1.4rem + 4vw,4.9rem)/.98 var(--font-d);letter-spacing:-.045em;font-variation-settings:'opsz' 96}
.h-display .ln{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.h-display .ln>span{display:block}
.lede{margin-top:22px;font-size:clamp(1.02rem,.95rem + .3vw,1.17rem);line-height:1.6;color:var(--ink-2);max-width:34em}
.hero-search{margin-top:30px;display:flex;align-items:center;gap:12px;width:100%;max-width:540px;height:60px;padding:0 12px 0 18px;border-radius:16px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-1);color:var(--muted);font-size:16px;text-align:left;transition:border-color .15s,box-shadow .15s}
.hero-search:hover{border-color:var(--line-2);box-shadow:0 8px 24px -14px rgba(22,24,47,.35)}
.hero-search .ic{color:var(--ink)}
.hero-search span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}
.hero-note{margin-top:22px;display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted)}
.hero-note .ic{color:var(--ok);width:18px;height:18px}

/* stage: the light table */
.stage{position:relative;border-radius:var(--r-xl);background:var(--stage);color:#fff;min-height:500px;aspect-ratio:1.04;overflow:hidden;isolation:isolate;border:1px solid var(--stage-line);transition:box-shadow .2s}
.stage::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.11) 1px,transparent 1.5px);background-size:22px 22px;background-position:11px 11px;z-index:-1;mask-image:radial-gradient(ellipse at 50% 40%,#000 40%,transparent 90%);-webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 40%,transparent 90%)}
.stage.over{box-shadow:0 0 0 3px var(--hl)}
.stage-scene{position:absolute;inset:0 0 110px;perspective:900px}
.sheet{--sw:min(37%,206px);position:absolute;width:var(--sw);aspect-ratio:1/1.32;left:calc(50% - var(--sw)/2);top:13%;background:#fff;border-radius:10px;box-shadow:0 18px 40px -12px rgba(0,0,0,.55);padding:calc(var(--sw) * .27) calc(var(--sw) * .12) 0;overflow:hidden;transform-style:preserve-3d;will-change:transform}
.sh-band{position:absolute;left:0;right:0;top:0;height:13%;background:#E0464C}
.sheet i{display:block;height:5px;border-radius:3px;background:#E3E5EE;margin-bottom:7%}
.sheet i.h{height:8px;width:70%;background:#C9CCDA;margin-bottom:10%}
.sheet i.s{width:62%}.sheet i.m{width:82%}
.sh-tag{position:absolute;left:10%;bottom:7%;font:700 11px/1 var(--font);letter-spacing:.02em;color:#fff;background:#E0464C;padding:5px 7px;border-radius:6px}
.sh-sig{position:absolute;right:8%;bottom:8%;width:56%;fill:none;stroke:#2337B8;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.st-badge,.st-size{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);font:600 13px/1 var(--font);border-radius:999px;padding:8px 12px;white-space:nowrap;opacity:0}
.st-badge{background:var(--hl);color:#16182F}
.st-size{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff;font-variant-numeric:tabular-nums}
.stage-cap{position:absolute;left:18px;top:18px;display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;color:rgba(255,255,255,.85);background:rgba(255,255,255,.07);padding:7px 12px 7px 9px;border-radius:999px}
.stage-cap .ic{width:16px;height:16px;color:var(--hl)}
.stage-drop{position:absolute;left:16px;right:16px;bottom:16px;display:flex;align-items:center;gap:16px;padding:16px 16px 16px 20px;border-radius:18px;border:1.5px dashed rgba(255,255,255,.25);background:rgba(255,255,255,.04);transition:border-color .2s,background .2s}
.stage.over .stage-drop{border-style:solid;border-color:var(--hl);background:rgba(255,212,59,.1)}
.stage-drop p{flex:1;min-width:0;display:grid;gap:2px}
.stage-drop strong{font-weight:600;font-size:15.5px}
.stage-drop span{font-size:13px;color:rgba(255,255,255,.62)}
.file-btn{position:relative;overflow:hidden}
.file-btn input{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}

/* sections */
section{position:relative}
.sec{padding:96px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.sec-head h2,.h2{font:800 clamp(1.9rem,1.3rem + 2vw,2.8rem)/1.04 var(--font-d);letter-spacing:-.035em}
.sec-head p{color:var(--muted);max-width:38em}

/* tool catalogue */
.tools{padding-top:72px}
.recent{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:-8px 0 22px;font-size:14px;color:var(--muted)}
.recent .chip{height:32px;font-size:13.5px}
.toolbar{position:sticky;top:var(--hdr);z-index:40;background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-block:1px solid transparent;transition:border-color .2s}
.admin-bar .toolbar{top:calc(var(--hdr) + 32px)}
.toolbar.stuck{border-bottom-color:var(--line)}
.toolbar-in{display:flex;align-items:center;gap:16px;padding:12px 0}
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.tabs.more{mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);padding-right:28px}
.tabs::-webkit-scrollbar{display:none}
.tools-head{align-items:flex-end}
.tools-head p{margin-top:12px}
.tab{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:999px;font-size:14.5px;font-weight:500;color:var(--ink-2);white-space:nowrap;transition:background .15s,color .15s}
.tab:hover{background:var(--sunken)}
.tab .n{font-size:12.5px;color:var(--faint);font-variant-numeric:tabular-nums}
.tab[aria-selected="true"]{background:var(--ink);color:var(--paper)}
.tab[aria-selected="true"] .n{color:color-mix(in srgb,var(--paper) 65%,transparent)}
.tb-right{display:flex;align-items:center;gap:8px;flex:none}
.filter{display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:11px;background:var(--surface);border:1px solid var(--line);width:220px;color:var(--muted);transition:border-color .15s}
.filter:focus-within{border-color:var(--ink)}
.filter input{border:0;outline:0;background:none;width:100%;font-size:14.5px;color:var(--ink)}
.filter input::-webkit-search-cancel-button{display:none}
.toggle-chip{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 12px;border-radius:11px;border:1px solid var(--line);background:var(--surface);font-size:14px;font-weight:500;color:var(--ink-2);white-space:nowrap;transition:all .15s}
.toggle-chip .ic{width:16px;height:16px}
.toggle-chip:hover{border-color:var(--line-2)}
.toggle-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.toggle-chip[aria-pressed="true"] .ic{color:var(--hl)}
.catalog{padding:8px 0 24px;position:relative}
.cat-block{padding-top:30px}
.cat-head{display:flex;align-items:baseline;gap:10px 14px;flex-wrap:wrap;margin-bottom:14px}
@media (min-width:1021px){
  .cat-block{display:grid;grid-template-columns:230px minmax(0,1fr);gap:32px;padding-top:26px;margin-top:26px;border-top:1px solid var(--line)}
  .cat-head{flex-direction:column;align-items:flex-start;gap:6px;margin:0;position:sticky;top:calc(var(--hdr) + 84px);align-self:start}
  .admin-bar .cat-head{top:calc(var(--hdr) + 116px)}
  .catalog .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.cat-head h3{display:flex;align-items:center;gap:10px;font:700 1.35rem/1.2 var(--font-d);letter-spacing:-.02em}
.cat-head h3 .dot{width:10px;height:10px}
.cat-head .cnt{font-size:13.5px;color:var(--faint);font-variant-numeric:tabular-nums}
.cat-head p{font-size:14.5px;color:var(--muted);flex-basis:100%}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.tool{position:relative;display:flex;gap:14px;align-items:flex-start;padding:16px 16px 15px;border-radius:18px;background:var(--surface);border:1px solid var(--line);transition:border-color .2s,box-shadow .2s,transform .2s}
.tool:hover{border-color:color-mix(in srgb,var(--c,var(--ink)) 50%,var(--line));box-shadow:0 14px 30px -20px color-mix(in srgb,var(--c,var(--ink)) 70%,transparent);transform:translateY(-2px)}
.tool .tx{display:flex;flex-direction:column;flex:1;min-width:0}
.tool:has(.tool-link:focus-visible){outline:2px solid var(--ink);outline-offset:2px}
.tool-link{outline:0}
.tool-link::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:1}
.tool h4{margin:1px 0 4px;font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.3}
.tool p{font-size:14px;line-height:1.45;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tool-meta{margin-top:auto;padding-top:10px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.tool-meta:empty{display:none}
.empty{text-align:center;padding:64px 16px;color:var(--muted)}
.empty h3{color:var(--ink);font:700 1.3rem var(--font-d);margin:14px 0 6px}
.empty .tile{margin:0 auto}
.empty .btn{margin-top:18px}

/* how it works */
.how{padding:72px 0 8px}
.how-in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2fr);gap:40px;align-items:start;padding:40px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;counter-reset:s}
.steps li{position:relative;padding-top:56px}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;top:0;left:0;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font:800 1.1rem var(--font-d);background:var(--hl);color:#16182F}
.steps li:not(:last-child)::after{content:"";position:absolute;top:20px;left:52px;right:-16px;border-top:1.5px dashed var(--line-2)}
.steps h3{font-size:1.05rem;font-weight:600;margin-bottom:6px}
.steps p{font-size:14.5px;color:var(--muted)}

/* trust */
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.trust-grid>div{padding:24px;border-radius:20px;border:1px solid var(--line);background:var(--surface)}
.trust-grid .tile{--c:var(--ok)}
.trust-grid h3{font-size:1.05rem;font-weight:600;margin:16px 0 6px}
.trust-grid p{font-size:14.5px;color:var(--muted)}

/* faq */
.faq-in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:48px}
.faq-in>div>p{margin-top:14px;color:var(--muted)}
.faq-in a{border-bottom:1.5px solid var(--hl)}
.qa{border-top:1px solid var(--line)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:20px 2px;font-weight:600;font-size:16.5px;cursor:pointer}
.qa summary::-webkit-details-marker{display:none}
.qa summary .ic{flex:none;transition:transform .25s;color:var(--muted)}
.qa details[open] summary .ic{transform:rotate(45deg)}
.qa details p{padding:0 2px 20px;color:var(--ink-2);max-width:44em}

/* blog teaser and posts */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.post-card{display:flex;flex-direction:column;border-radius:20px;background:var(--surface);border:1px solid var(--line);overflow:hidden;transition:border-color .2s,transform .2s}
.post-card:hover{border-color:var(--line-2);transform:translateY(-2px)}
.post-card .thumb{aspect-ratio:16/9;background:linear-gradient(135deg,color-mix(in srgb,var(--c-organize) 18%,var(--surface)),color-mix(in srgb,var(--c-image) 18%,var(--surface)));overflow:hidden}
.post-card .thumb img{width:100%;height:100%;object-fit:cover}
.post-card .body{padding:18px 20px 20px;display:grid;gap:8px}
.post-card h3{font:700 1.15rem/1.25 var(--font-d);letter-spacing:-.015em}
.post-card h3 a::after{content:"";position:absolute;inset:0}
.post-card{position:relative}
.post-card .meta,.entry-meta{font-size:13px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.post-card p{font-size:14.5px;color:var(--muted)}
.more-link{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14.5px;border-bottom:1.5px solid var(--hl);padding-bottom:1px}

/* page and article layout */
.page-head{padding:48px 0 28px}
.page-head h1{font:800 clamp(2rem,1.4rem + 2.4vw,3.2rem)/1.05 var(--font-d);letter-spacing:-.035em}
.page-head p{margin-top:14px;color:var(--muted);max-width:42em;font-size:1.08rem}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13.5px;color:var(--muted);margin-bottom:16px}
.crumbs a:hover{color:var(--ink)}
.crumbs .ic{width:14px;height:14px;color:var(--faint)}
.article{width:min(760px,100% - 48px);margin-inline:auto;padding:0 0 64px}
.article .featured{border-radius:20px;overflow:hidden;margin:0 0 28px}
.prose{font-size:17px;line-height:1.75;color:var(--ink-2)}
.prose>*+*{margin-top:1.1em}
.prose h2{font:700 1.7rem/1.2 var(--font-d);letter-spacing:-.02em;color:var(--ink);margin-top:1.8em}
.prose h3{font:700 1.3rem/1.25 var(--font-d);color:var(--ink);margin-top:1.5em}
.prose h4{font-size:1.1rem;color:var(--ink);margin-top:1.4em}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--hl);text-decoration-thickness:2px;text-underline-offset:3px}
.prose ul,.prose ol{padding-left:1.3em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose li+li{margin-top:.4em}
.prose li::marker{color:var(--muted)}
.prose blockquote{margin:1.5em 0;padding:4px 0 4px 20px;border-left:3px solid var(--hl);color:var(--ink);font-size:1.08em}
.prose img,.prose figure{border-radius:14px;margin-inline:0}
.prose figcaption{font-size:13.5px;color:var(--muted);margin-top:8px;text-align:center}
.prose code{font:14px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--sunken);padding:2px 6px;border-radius:6px}
.prose pre{background:var(--stage);color:#E5E7F5;padding:18px 20px;border-radius:14px;overflow:auto;font-size:14px;line-height:1.6}
.prose pre code{background:none;padding:0;color:inherit}
.prose table{width:100%;border-collapse:collapse;font-size:15px}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}
.prose .wp-block-button__link{background:var(--ink);color:var(--paper);border-radius:12px;padding:12px 18px;text-decoration:none;font-weight:600;display:inline-block}
.alignwide{width:min(1100px,100vw - 48px);margin-left:50%;transform:translateX(-50%);max-width:none}
.alignfull{width:100vw;margin-left:50%;transform:translateX(-50%);max-width:none}
.aligncenter{margin-inline:auto}
.alignleft{float:left;margin:0 1.2em 1em 0}.alignright{float:right;margin:0 0 1em 1.2em}
.post-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:32px}
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:40px}
.post-nav a{display:block;padding:16px 18px;border-radius:16px;border:1px solid var(--line);background:var(--surface)}
.post-nav a:hover{border-color:var(--line-2)}
.post-nav small{display:block;color:var(--muted);font-size:12.5px}
.post-nav .next{text-align:right}
.pagination{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:40px 0 0}
.pagination .page-numbers{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 12px;border-radius:11px;border:1px solid var(--line);background:var(--surface);font-weight:500}
.pagination .current{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.blog-list{padding-bottom:72px}

/* comments */
.comments{margin-top:56px;padding-top:32px;border-top:1px solid var(--line)}
.comments h2{font:700 1.4rem var(--font-d);margin-bottom:18px}
.comment-list{display:grid;gap:18px}
.comment-list .children{margin:16px 0 0 24px;display:grid;gap:16px}
.comment-body{padding:16px 18px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.comment-meta{font-size:13px;color:var(--muted);margin-bottom:8px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.comment-meta img{border-radius:50%}
.comment-author .fn{color:var(--ink);font-weight:600;font-style:normal}
.comment-respond{margin-top:28px}
.comment-form{display:grid;gap:14px}
.comment-form label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea,.search-form input[type=search]{width:100%;height:44px;padding:0 12px;border-radius:11px;border:1px solid var(--line-2);background:var(--surface);font-size:15px;outline:0}
.comment-form textarea{height:auto;min-height:130px;padding:10px 12px}
.comment-form input:focus,.comment-form textarea:focus,.search-form input:focus{border-color:var(--ink)}
.comment-form .submit,.search-form button{height:44px;padding:0 18px;border-radius:12px;background:var(--ink);color:var(--paper);font-weight:600;border:0;cursor:pointer}
.search-form{display:flex;gap:8px;max-width:560px}

/* tool page */
.tool-hero{padding:34px 0 22px}
.tool-hero-in{display:flex;gap:18px;align-items:flex-start}
.tool-hero h1{font:800 clamp(1.9rem,1.3rem + 2.2vw,3rem)/1.05 var(--font-d);letter-spacing:-.035em}
.tool-hero .lede{margin-top:10px}
.tool-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.tool-body{padding-bottom:24px}
.tool-info{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start;padding:40px 0 24px}
.tool-info .prose{font-size:16.5px}
.tool-aside{position:sticky;top:calc(var(--hdr) + 20px);padding:22px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.admin-bar .tool-aside{top:calc(var(--hdr) + 52px)}
.tool-aside h2{font:700 1.05rem var(--font-d);margin-bottom:12px}
.tool-aside ul{display:grid;gap:2px}
.tool-aside a{display:flex;align-items:center;gap:10px;padding:8px;margin:0 -8px;border-radius:10px;font-size:14.5px;font-weight:500}
.tool-aside a:hover{background:var(--sunken)}
.tool-faq{padding:24px 0 40px}
.tool-faq h2{margin-bottom:12px}
.related{padding:24px 0 80px}
.notice-box{display:flex;gap:12px;padding:16px 18px;border-radius:16px;background:var(--surface);border:1px solid var(--line);color:var(--ink-2);font-size:15px}
.notice-box .ic{color:var(--muted);margin-top:2px}

/* footer */
.ftr{background:#16182F;color:#B4B8D2;padding:64px 0 28px}
[data-theme="dark"] .ftr{background:#0A0C19;border-top:1px solid var(--line)}
.ftr .logo{color:#fff}
.ftr .lm-bg{fill:#2A2E52}
.ftr-top{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr));gap:32px}
.ftr-brand p{margin:14px 0 20px;font-size:14.5px;max-width:24em}
.ftr h4{color:#fff;font-size:14px;font-weight:600;margin-bottom:12px}
.ftr nav a,.ftr .menu a{display:block;padding:5px 0;font-size:14.5px;transition:color .15s}
.ftr a:hover{color:#fff}
.ftr .widget{font-size:14.5px}
.ftr-bottom{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13.5px}
.social{display:flex;gap:4px;flex-wrap:wrap}
.social a{padding:4px 10px;border-radius:8px}
.social a:hover{background:rgba(255,255,255,.08)}

/* overlays */
.ov{position:fixed;inset:0;z-index:100}
.ov-bg{position:absolute;inset:0;background:rgba(12,14,30,.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.pl-box{position:relative;width:min(640px,calc(100% - 24px));margin:11vh auto 0;background:var(--surface);border-radius:20px;box-shadow:var(--sh-pop);overflow:hidden;border:1px solid var(--line)}
.pl-in{display:flex;align-items:center;gap:12px;height:62px;padding:0 16px 0 20px;border-bottom:1px solid var(--line)}
.pl-in input{flex:1;border:0;outline:0;background:none;font-size:17px;min-width:0;color:var(--ink)}
.pl-list{max-height:min(56vh,480px);overflow:auto;padding:8px}
.pl-group{padding:10px 12px 6px;font-size:12.5px;font-weight:600;color:var(--faint)}
.pl-item{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;cursor:pointer}
.pl-item .tile{width:34px;height:34px;border-radius:10px}
.pl-item .tile .ic{width:18px;height:18px}
.pl-item b{font-weight:600;font-size:15px;display:block}
.pl-item small{display:block;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-item>div{min-width:0;flex:1}
.pl-item .pl-cat{font-size:12.5px;color:var(--faint);white-space:nowrap}
.pl-item[aria-selected="true"]{background:var(--sunken)}
.pl-empty{padding:28px 16px;text-align:center;color:var(--muted)}
.pl-foot{display:flex;gap:18px;padding:10px 16px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.pl-foot kbd{margin-right:3px}
.modal-box{position:relative;width:min(760px,calc(100% - 24px));max-height:calc(100% - 48px);margin:24px auto;top:50%;transform:translateY(-50%);background:var(--surface);border-radius:24px;box-shadow:var(--sh-pop);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 22px 16px 26px}
.modal-head h2{font:700 1.4rem/1.2 var(--font-d);letter-spacing:-.02em}
.modal-head p{color:var(--muted);font-size:14.5px;margin-top:4px}
.modal-body{padding:4px 26px 24px;overflow:auto}
.sg-files{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.sg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.sg-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;border:1px solid var(--line);text-align:left;transition:border-color .15s,background .15s}
.sg-item:hover{border-color:var(--c);background:var(--surface-2)}
.sg-item b{font-weight:600;font-size:14.5px}
.sg-item small{display:block;font-size:12.5px;color:var(--muted)}
.sg-sub{font-size:13.5px;font-weight:600;color:var(--muted);margin:18px 0 10px}
.page-drop{position:fixed;inset:0;z-index:130;background:rgba(12,14,30,.72);display:grid;place-items:center;padding:24px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.page-drop>div{width:min(560px,100%);aspect-ratio:1.6;border:2.5px dashed var(--hl);border-radius:28px;display:grid;place-items:center;align-content:center;gap:12px;text-align:center;color:#fff}
.page-drop .ic{width:44px;height:44px;color:var(--hl)}
.page-drop strong{font:700 1.6rem var(--font-d)}
.page-drop span{color:rgba(255,255,255,.7)}
.note-box{display:flex;gap:10px;padding:12px 14px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);font-size:13.5px;color:var(--ink-2)}

/* responsive */
@media (max-width:1180px){
  .search-trigger{min-width:0}
  .search-trigger span,.search-trigger kbd{display:none}
  .ftr-top{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ftr-brand{grid-column:1/-1}
  .mega-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1020px){
  :root{--hdr:62px}
  .nav,.hdr-actions .btn-link,.hdr-actions .btn{display:none}
  .menu-btn{display:inline-grid}
  .hero-in{grid-template-columns:minmax(0,1fr);gap:36px}
  .stage{aspect-ratio:auto;min-height:440px;height:56vw;max-height:520px}
  .how-in{grid-template-columns:minmax(0,1fr);gap:28px;padding:32px}
  .trust-grid{grid-template-columns:1fr 1fr}
  .faq-in{grid-template-columns:minmax(0,1fr);gap:20px}
  .tools-head .tb-right{width:100%}
  .filter{flex:1;width:auto}
  .posts{grid-template-columns:1fr 1fr}
  .tool-info{grid-template-columns:minmax(0,1fr);gap:28px}
  .tool-aside{position:static}
}
@media (max-width:760px){
  .wrap{width:calc(100% - 32px)}
  .article{width:calc(100% - 32px)}
  .sec{padding:64px 0}
  .hero{padding-top:28px}
  .hero-search{height:54px;font-size:15px}
  .hero-search kbd{display:none}
  .quick{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding-inline:16px}
  .quick::-webkit-scrollbar{display:none}
  .quick .chip{flex:none}
  .stage{height:auto;min-height:0;aspect-ratio:auto;max-height:none}
  .stage-scene{position:relative;inset:auto;height:330px}
  .stage .sheet{--sw:150px;top:62px}
  .stage-drop{position:relative;left:auto;right:auto;bottom:auto;margin:0 14px 14px;flex-direction:column;align-items:stretch;text-align:center;padding:14px}
  .stage-drop .tile{display:none}
  .toolbar-in{flex-wrap:wrap;gap:10px}
  .tabs{flex-basis:100%}
  .toolbar .tb-right{width:100%}
  .stage-drop .btn{width:100%}
  .steps{grid-template-columns:minmax(0,1fr);gap:20px}
  .steps li{padding:0 0 0 56px;min-height:40px}
  .steps li::after{display:none}
  .trust-grid{grid-template-columns:minmax(0,1fr)}
  .ftr-top{grid-template-columns:1fr 1fr}
  .modal-box{width:100%;max-height:92%;top:auto;bottom:0;transform:none;position:absolute;margin:0;border-radius:24px 24px 0 0}
  .modal-head{padding:20px 18px 12px}
  .modal-body{padding:4px 18px 20px}
  .pl-box{margin-top:12px}
  .posts{grid-template-columns:minmax(0,1fr)}
  .post-nav{grid-template-columns:minmax(0,1fr)}
  .tool-hero-in .tile.lg{display:none}
  .prose{font-size:16px}
}
@media (max-width:560px){
  .tb-right .toggle-chip span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .tool{padding:14px}
  .tool p{-webkit-line-clamp:2}
  .tag-local .tl,.tag-srv .tl{display:none}
  .tag-local,.tag-srv{padding:0 6px}
  .tool:hover{transform:none}
  .cat-block{padding-top:26px}
  .ftr-top{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
@media print{.hdr,.ftr,.toolbar,.drawer,.ov{display:none!important}body{background:#fff}}
