/* Fileora tool workspace. Scoped to .fo-app so it works inside any theme.
   Colours come from the Fileora theme when it is active; the values below
   are the defaults for other themes. */
:where(:root){
  --fo-paper:var(--paper,#F2F3F8); --fo-surface:var(--surface,#FFFFFF); --fo-surface-2:var(--surface-2,#F7F8FC); --fo-sunken:var(--sunken,#E9EBF3);
  --fo-ink:var(--ink,#16182F); --fo-ink-2:var(--ink-2,#3B3F5E); --fo-muted:var(--muted,#5C6184); --fo-faint:var(--faint,#656A8A);
  --fo-line:var(--line,#E1E3EE); --fo-line-2:var(--line-2,#CBCEDF);
  --fo-hl:var(--hl,#FFD43B); --fo-ok:var(--ok,#087A44); --fo-err:var(--err,#C42B31);
  --fo-c-organize:var(--c-organize,#2F6BF3); --fo-c-optimize:var(--c-optimize,#0E9F57); --fo-c-to:var(--c-to,#E07F06); --fo-c-from:var(--c-from,#E0464C);
  --fo-c-edit:var(--c-edit,#8A4FD6); --fo-c-security:var(--c-security,#3E4C7A); --fo-c-ai:var(--c-ai,#0A98B8); --fo-c-image:var(--c-image,#D1367E);
  --fo-font:var(--font,'Geist',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',sans-serif);
  --fo-font-d:var(--font-d,var(--fo-font));
  --fo-shadow:0 30px 70px -18px rgba(22,24,47,.35),0 2px 8px rgba(22,24,47,.08);
}
.fo-app,.fo-toasts,.fo-catalog{font-family:var(--fo-font);color:var(--fo-ink);line-height:1.5;-webkit-font-smoothing:antialiased}
.fo-app *,.fo-app *::before,.fo-app *::after{box-sizing:border-box}
.fo-app [hidden]{display:none!important}
.fo-app button,.fo-app input,.fo-app select,.fo-app textarea{font:inherit;color:inherit;margin:0}
.fo-app button{cursor:pointer;background:none;border:0;padding:0;text-transform:none;letter-spacing:normal}
.fo-app h3,.fo-app h4{margin:0;font-weight:700;line-height:1.2;color:var(--fo-ink)}
.fo-app p{margin:0}
.fo-app ol,.fo-app ul{margin:0;padding:0;list-style:none}
.fo-app img,.fo-app svg,.fo-app canvas{display:block;max-width:100%}
.fo-app a{color:inherit;text-decoration:none}
.fo-app :focus-visible{outline:2px solid var(--fo-ink);outline-offset:2px;border-radius:6px}
.fo-app [data-cat="organize"],.fo-app[data-cat="organize"]{--c:var(--fo-c-organize)}
.fo-app [data-cat="optimize"],.fo-app[data-cat="optimize"]{--c:var(--fo-c-optimize)}
.fo-app [data-cat="to"],.fo-app[data-cat="to"]{--c:var(--fo-c-to)}
.fo-app [data-cat="from"],.fo-app[data-cat="from"]{--c:var(--fo-c-from)}
.fo-app [data-cat="edit"],.fo-app[data-cat="edit"]{--c:var(--fo-c-edit)}
.fo-app [data-cat="security"],.fo-app[data-cat="security"]{--c:var(--fo-c-security)}
.fo-app [data-cat="ai"],.fo-app[data-cat="ai"]{--c:var(--fo-c-ai)}
.fo-app [data-cat="image"],.fo-app[data-cat="image"]{--c:var(--fo-c-image)}

/* icons, buttons, tiles */
.fo-ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.fo-ic-sm{width:16px;height:16px}.fo-ic-lg{width:26px;height:26px}
.fo-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px!important;border-radius:12px!important;font-weight:600;font-size:15px!important;font-family:var(--fo-font)!important;letter-spacing:normal!important;white-space:nowrap;transition:background .15s,color .15s,border-color .15s,transform .15s,opacity .15s;border:1px solid transparent!important;position:relative;line-height:1;text-decoration:none!important;box-shadow:none}
.fo-btn:active{transform:translateY(1px)}
.fo-btn[disabled]{opacity:.38;pointer-events:none}
.fo-btn-ink{background:var(--fo-ink)!important;color:var(--fo-paper)!important}
.fo-btn-ink:hover{background:color-mix(in srgb,var(--fo-ink) 86%,var(--fo-paper))!important}
.fo-btn-line{border-color:var(--fo-line-2)!important;background:var(--fo-surface)!important;color:var(--fo-ink)!important}
.fo-btn-line:hover{border-color:var(--fo-ink)!important}
.fo-btn-quiet{color:var(--fo-ink-2)!important;background:transparent!important}
.fo-btn-quiet:hover{background:var(--fo-sunken)!important}
.fo-btn-sm{height:36px;padding:0 12px!important;font-size:14px!important;border-radius:10px!important}
.fo-btn-lg{height:52px;padding:0 24px!important;font-size:16px!important;border-radius:14px!important}
.fo-icon-btn{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:9px;color:var(--fo-ink-2)}
.fo-icon-btn:hover{background:var(--fo-sunken);color:var(--fo-ink)}
.fo-tile{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;color:var(--c,var(--fo-ink));background:color-mix(in srgb,var(--c,var(--fo-ink)) 13%,transparent);flex:none}
.fo-tile .fo-ic{width:22px;height:22px}
.fo-tile-sm{width:30px;height:30px;border-radius:9px}.fo-tile-sm .fo-ic{width:16px;height:16px}
.fo-tile-lg{width:64px;height:64px;border-radius:18px}.fo-tile-lg .fo-ic{width:30px;height:30px}
.fo-chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 10px;border-radius:999px;background:var(--fo-surface);border:1px solid var(--fo-line);font-size:14px;font-weight:500;color:var(--fo-ink);transition:border-color .15s}
.fo-chip:hover{border-color:var(--c,var(--fo-line-2))}
.fo-chip .fo-ic{width:16px;height:16px;color:var(--c)}

/* workspace frame */
.fo-app{margin:0 0 32px;position:relative}
/* other themes often have a narrow text column: let the tool use more room, centred */
body:not(.fileora-theme) .fo-app{width:min(1120px,calc(100vw - 32px));max-width:none;margin-left:50%;transform:translateX(-50%)}
.fo-ws{background:var(--fo-paper);border:1px solid var(--fo-line);border-radius:24px;overflow:hidden;box-shadow:0 1px 2px rgba(22,24,47,.05)}
.fo-app.is-over .fo-ws{box-shadow:0 0 0 3px var(--c,var(--fo-ink))}
.fo-ws-top{display:flex;align-items:center;gap:14px;padding:10px 14px;background:var(--fo-surface);border-bottom:1px solid var(--fo-line);min-height:56px}
.fo-ws-steps{display:flex;align-items:center;gap:6px;font-size:13.5px;color:var(--fo-faint)}
.fo-ws-steps li{display:flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px}
.fo-ws-steps li i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:600 12px var(--fo-font);font-style:normal;border:1.5px solid var(--fo-line-2)}
.fo-ws-steps li.on{color:var(--fo-ink);font-weight:600;background:var(--fo-sunken)}
.fo-ws-steps li.on i{border-color:var(--fo-ink);background:var(--fo-ink);color:var(--fo-paper)}
.fo-ws-steps li.done{color:var(--fo-ink-2)}
.fo-ws-steps li.done i{border-color:var(--fo-ok);background:var(--fo-ok);color:#fff}
.fo-ws-steps li.sep{width:18px;height:1.5px;padding:0;border-radius:0;background:var(--fo-line-2)}
.fo-priv{margin-left:auto;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:500;color:var(--fo-ink-2);background:var(--fo-surface-2);border:1px solid var(--fo-line);white-space:nowrap}
.fo-priv .fo-ic{width:15px;height:15px;color:var(--fo-ok)}
.fo-priv.srv .fo-ic{color:var(--fo-c-organize)}
.fo-ws-body{display:grid;grid-template-columns:minmax(0,1fr) 340px;min-height:520px}
.fo-ws-main{padding:22px;position:relative;min-width:0}
.fo-ws-side{border-left:1px solid var(--fo-line);background:var(--fo-surface);display:flex;flex-direction:column}
.fo-ws-opts{flex:1;padding:20px 20px 8px}
.fo-ws-opts>h3{font:700 1.05rem var(--fo-font-d);margin-bottom:4px}
.fo-ws-about{font-size:14px;color:var(--fo-muted);margin-bottom:18px!important}
.fo-ws-cta{padding:16px 20px 18px;border-top:1px solid var(--fo-line);display:grid;gap:8px;position:sticky;bottom:0;background:var(--fo-surface)}
.fo-ws-cta .fo-btn{width:100%}
.fo-ws-hint{font-size:13px;color:var(--fo-muted);text-align:center;min-height:1.2em}
.fo-boot{padding:18px}
.fo-boot .fo-dz{min-height:300px}
.fo-pending{border:1px solid var(--fo-line);border-radius:24px;background:var(--fo-surface)}

/* drop zone and states */
.fo-dz{min-height:440px;height:100%;border:2px dashed var(--fo-line-2);border-radius:20px;background:var(--fo-surface);display:grid;place-items:center;align-content:center;text-align:center;padding:36px 20px;gap:6px;transition:border-color .2s,background .2s}
.fo-app.is-over .fo-dz{border-color:var(--c,var(--fo-ink));background:color-mix(in srgb,var(--c,var(--fo-ink)) 6%,var(--fo-surface))}
.fo-dz h3{font:700 1.45rem/1.2 var(--fo-font-d);letter-spacing:-.02em;margin-top:16px}
.fo-dz>p,.fo-muted{color:var(--fo-muted);max-width:32em}
.fo-dz-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:18px 0 8px}
.fo-dz small{font-size:13px;color:var(--fo-faint)}
.fo-url-form{width:min(560px,100%);display:grid;gap:10px;margin-top:18px;text-align:left}
.fo-url-form .fo-inp{height:52px;font-size:16px}
.fo-state{min-height:440px;display:grid;place-items:center;align-content:center;text-align:center;padding:30px 10px;gap:8px}
.fo-state-sm{min-height:200px}
.fo-state h3{font:700 1.55rem/1.2 var(--fo-font-d);letter-spacing:-.025em;margin-top:14px}
.fo-state>p{color:var(--fo-muted);max-width:36em}
.fo-pbar{width:min(420px,90%);height:8px;border-radius:99px;background:var(--fo-sunken);overflow:hidden;margin-top:18px}
.fo-pbar i{display:block;height:100%;width:0;background:var(--c,var(--fo-ink));border-radius:inherit;transition:width .25s}
.fo-pbar.indet i{width:35%;animation:fo-indet 1.1s ease-in-out infinite}
@keyframes fo-indet{0%{transform:translateX(-100%)}100%{transform:translateX(300%)}}
.fo-plabel{font-size:13.5px;color:var(--fo-muted);margin-top:8px!important;font-variant-numeric:tabular-nums}
.fo-ok{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:color-mix(in srgb,var(--fo-ok) 14%,transparent);color:var(--fo-ok)}
.fo-ok .fo-ic{width:32px;height:32px;stroke-width:2.2}
.fo-err{background:color-mix(in srgb,var(--fo-err) 12%,transparent);color:var(--fo-err)}
.fo-good{color:var(--fo-ok);font-weight:500}
.fo-res-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:16px}
.fo-outs{width:min(640px,100%);margin-top:22px;display:grid;gap:8px;text-align:left}
.fo-out{display:flex;align-items:center;gap:12px;padding:12px 12px 12px 14px;border-radius:14px;background:var(--fo-surface);border:1px solid var(--fo-line)}
.fo-out>div{flex:1;min-width:0}
.fo-out b{display:block;font-weight:600;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fo-out small{font-size:12.5px;color:var(--fo-muted)}
.fo-out small.good{color:var(--fo-ok);font-weight:500}
.fo-next{margin-top:28px;width:min(640px,100%)}
.fo-next h4{font-size:13.5px;font-weight:600;color:var(--fo-muted);margin-bottom:10px}
.fo-next>div{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.fo-md{width:min(720px,100%);max-height:340px;overflow:auto;margin:16px 0 0;text-align:left;background:var(--fo-surface);border:1px solid var(--fo-line);border-radius:14px;padding:16px 18px;font:13px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre-wrap;word-break:break-word;color:var(--fo-ink-2)}
.fo-diff{width:min(860px,100%);margin-top:16px;text-align:left;background:var(--fo-surface);border:1px solid var(--fo-line);border-radius:14px;overflow:hidden}
.fo-diff-stats{display:flex;gap:14px;padding:12px 16px;border-bottom:1px solid var(--fo-line);font-size:13.5px;font-weight:600;flex-wrap:wrap}
.fo-diff-stats .a{color:var(--fo-ok)}.fo-diff-stats .r{color:var(--fo-err)}
.fo-diff-stats span:last-child{margin-left:auto;color:var(--fo-muted);font-weight:500}
.fo-diff-body{max-height:380px;overflow:auto;font:12.5px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.fo-dl{display:grid;grid-template-columns:44px 18px 1fr;padding:1px 12px 1px 0;white-space:pre-wrap;word-break:break-word}
.fo-dl .pg{color:var(--fo-faint);text-align:right;padding-right:8px;font-size:11px}
.fo-dl.add{background:color-mix(in srgb,var(--fo-ok) 12%,transparent)}.fo-dl.add .sg{color:var(--fo-ok)}
.fo-dl.del{background:color-mix(in srgb,var(--fo-err) 11%,transparent)}.fo-dl.del .sg{color:var(--fo-err)}
.fo-dl.ctx{color:var(--fo-muted)}
.fo-dl-skip{display:block;width:100%;text-align:left;padding:5px 12px 5px 62px!important;font-size:12px;color:var(--fo-muted);background:var(--fo-surface-2)!important;border-block:1px solid var(--fo-line)!important}
.fo-palette{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:18px;width:min(720px,100%)}
.fo-swatch-card{display:grid!important;gap:4px;width:118px;padding:8px!important;border-radius:14px;background:var(--fo-surface)!important;border:1px solid var(--fo-line)!important;text-align:left}
.fo-swatch-card span{height:64px;border-radius:9px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.fo-swatch-card b{font-size:13.5px;font-family:ui-monospace,Menlo,monospace}
.fo-swatch-card small{font-size:11px;color:var(--fo-muted)}
.fo-swatch-card:hover{border-color:var(--fo-ink)!important}

/* files */
.fo-files-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.fo-files-head h3{font-size:15px;font-weight:600;margin-right:auto;word-break:break-word}
.fo-files-head h3 span{color:var(--fo-muted);font-weight:500}
.fo-files{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.fo-file{position:relative;background:var(--fo-surface);border:1px solid var(--fo-line);border-radius:16px;padding:10px;transition:border-color .15s,opacity .15s;touch-action:manipulation}
.fo-file[draggable="true"]{cursor:grab}
.fo-file.dragging{opacity:.35}
.fo-file.drop-before{box-shadow:-4px 0 0 -1px var(--fo-ink)}
.fo-file.drop-after{box-shadow:4px 0 0 -1px var(--fo-ink)}
.fo-thumb{position:relative;aspect-ratio:3/4;border-radius:9px;background:var(--fo-sunken);display:grid;place-items:center;overflow:hidden;color:var(--fo-faint)}
.fo-thumb img{width:100%;height:100%;object-fit:contain;background:#fff;transition:transform .25s,filter .25s;transform:rotate(var(--rot,0deg)) scale(var(--rs,1)) scaleX(var(--sx,1)) scaleY(var(--sy,1));filter:var(--fo-filter,none);border:var(--fo-bw,0) solid var(--fo-bd,transparent);border-radius:var(--fo-rad,0)}
.fo-thumb .fo-ic{width:30px;height:30px}
.fo-pg{position:relative;container-type:inline-size;overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(22,24,47,.12)}
.fo-pg img{display:block;width:100%;height:100%;object-fit:contain}
.fo-ovl{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.fo-ovl .fo-wm{position:absolute;font-family:Geist,'Helvetica Neue',Arial,sans-serif;font-weight:700;line-height:1.32;white-space:nowrap;transform-origin:center}
.fo-wm-tile{position:absolute;inset:-40%;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:4cqw 8cqw}
.fo-wm-tile span{font-family:Geist,'Helvetica Neue',Arial,sans-serif;font-weight:700;white-space:nowrap}
.fo-ovl .fo-sgb{position:absolute;outline:1.5px dashed var(--fo-c-edit);outline-offset:2px;background:color-mix(in srgb,var(--fo-c-edit) 8%,transparent);display:grid;place-items:center}
.fo-ovl .fo-stampb{background:transparent}
.fo-ovl .fo-sgb img{width:100%;height:100%;object-fit:contain;background:transparent}
.fo-ovl .fo-sgb span{font-size:3.2cqw;color:var(--fo-c-edit);font-weight:600}
.fo-ovl .fo-pn{position:absolute;font-family:Helvetica,Arial,sans-serif;color:#333548;white-space:nowrap;line-height:1}
.fo-cr{position:absolute;border:2px solid var(--fo-c-edit);box-shadow:0 0 0 999px rgba(14,16,32,.42);pointer-events:none;transition:all .15s}
.fo-cutline{position:absolute;border:0 dashed #E0464C}
.fo-cutline.v{left:50%;top:0;bottom:0;border-left-width:2px}
.fo-cutline.h{top:50%;left:0;right:0;border-top-width:2px}
.fo-files.single{grid-template-columns:minmax(0,420px)}
.fo-files.single .fo-thumb{aspect-ratio:var(--ar,.75);background:transparent}
.fo-files.single .fo-pg{width:100%;height:100%}
.fo-ext{position:absolute;left:8px;bottom:8px;font:700 10.5px var(--fo-font);background:var(--c,var(--fo-ink));color:#fff;border-radius:5px;padding:3px 6px}
.fo-file-name{margin-top:9px;font-size:13.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fo-file-meta{font-size:12px;color:var(--fo-muted)}
.fo-file-meta.err{color:var(--fo-err)}
.fo-ord{position:absolute;top:16px;left:16px;min-width:24px;height:24px;border-radius:8px;background:var(--fo-ink);color:var(--fo-paper);font:600 12px/24px var(--fo-font);text-align:center;padding:0 6px;z-index:1}
.fo-file-x{position:absolute!important;top:14px;right:14px;z-index:1;width:30px;height:30px;border-radius:9px!important;display:grid!important;place-items:center;background:var(--fo-surface)!important;color:var(--fo-ink-2);box-shadow:0 1px 2px rgba(22,24,47,.08);border:1px solid var(--fo-line)!important}
.fo-file-x:hover{color:var(--fo-err)}
.fo-file-x .fo-ic{width:15px;height:15px}
.fo-file-acts{display:flex;gap:4px;margin-top:8px}
.fo-file-acts button{flex:1;height:30px;border-radius:8px!important;display:grid!important;place-items:center;color:var(--fo-ink-2);background:var(--fo-surface-2)!important;border:1px solid var(--fo-line)!important}
.fo-file-acts button:hover{border-color:var(--fo-line-2)!important;color:var(--fo-ink)}
.fo-file-acts button:disabled{opacity:.35;pointer-events:none}
.fo-file-acts .fo-ic{width:15px;height:15px}
.fo-add-tile{border:1.5px dashed var(--fo-line-2)!important;border-radius:16px!important;display:grid!important;place-items:center;align-content:center;gap:8px;min-height:200px;color:var(--fo-muted);font-size:14px;font-weight:500;background:transparent!important;padding:10px!important;text-align:center}
.fo-add-tile:hover{border-color:var(--fo-ink)!important;color:var(--fo-ink)}
.fo-slot-label{font-size:12.5px;font-weight:600;color:var(--fo-muted);margin-bottom:6px}
.fo-mt{margin-top:14px!important}

/* region editor */
.fo-reg{position:relative;width:100%;max-height:70vh;margin:0 auto;user-select:none;-webkit-user-select:none;touch-action:none;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 1px 3px rgba(22,24,47,.15)}
.fo-reg>img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.fo-reg-layer{position:absolute;inset:0;cursor:crosshair}
.fo-reg-box{position:absolute;border:2px solid var(--c,var(--fo-c-edit));background:color-mix(in srgb,var(--c,var(--fo-c-edit)) 12%,transparent);cursor:move;outline:0}
.fo-reg-box.on,.fo-reg-box:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--c,var(--fo-c-edit))}
.fo-reg-box i{position:absolute;width:16px;height:16px;background:#fff;border:2px solid var(--c,var(--fo-c-edit));border-radius:4px}
.fo-reg-box i[data-h="nw"]{left:-9px;top:-9px;cursor:nwse-resize}.fo-reg-box i[data-h="ne"]{right:-9px;top:-9px;cursor:nesw-resize}
.fo-reg-box i[data-h="sw"]{left:-9px;bottom:-9px;cursor:nesw-resize}.fo-reg-box i[data-h="se"]{right:-9px;bottom:-9px;cursor:nwse-resize}
.fo-reg-lbl{position:absolute;left:-2px;top:-26px;background:var(--c,var(--fo-c-edit));color:#fff;font-size:12px;font-weight:600;padding:3px 8px;border-radius:6px 6px 6px 0;white-space:nowrap}
.fo-reg-x{position:absolute!important;right:4px;top:4px;width:26px;height:26px;border-radius:7px!important;background:#fff!important;display:grid!important;place-items:center;color:var(--fo-ink)}
.fo-reg-x .fo-ic{width:14px;height:14px}
.fo-reg-help{font-size:12.5px;color:var(--fo-muted);margin-top:10px!important;text-align:center}
@media (pointer:coarse){.fo-reg-box i{width:24px;height:24px}.fo-reg-box i[data-h="nw"]{left:-13px;top:-13px}.fo-reg-box i[data-h="ne"]{right:-13px;top:-13px}.fo-reg-box i[data-h="sw"]{left:-13px;bottom:-13px}.fo-reg-box i[data-h="se"]{right:-13px;bottom:-13px}}

/* option controls */
.fo-opt{margin-bottom:18px}
.fo-opt-l{display:block;font-size:13.5px;font-weight:600;margin-bottom:8px;color:var(--fo-ink)}
.fo-opt-help{font-size:12.5px;color:var(--fo-muted);margin-top:6px!important}
.fo-seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;padding:3px;border-radius:12px;background:var(--fo-sunken)}
.fo-seg.wrapit{grid-auto-flow:row;grid-template-columns:1fr 1fr}
.fo-seg button{min-height:36px;padding:6px 8px!important;border-radius:9px!important;font-size:13.5px;font-weight:500;color:var(--fo-ink-2);line-height:1.2;background:transparent!important}
.fo-seg button:hover{color:var(--fo-ink)}
.fo-seg button[aria-pressed="true"]{background:var(--fo-surface)!important;color:var(--fo-ink);box-shadow:0 1px 2px rgba(22,24,47,.06),0 0 0 1px var(--fo-line);font-weight:600}
.fo-inp,.fo-sel,.fo-ta{width:100%;height:42px;padding:0 12px!important;border-radius:11px!important;border:1px solid var(--fo-line-2)!important;background:var(--fo-surface)!important;font-size:14.5px;outline:0;transition:border-color .15s;box-shadow:none!important;color:var(--fo-ink)!important;max-width:none}
.fo-ta{height:auto;min-height:84px;padding:10px 12px!important;resize:vertical}
.fo-sel{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2362678A' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 10px center!important;background-size:16px!important;padding-right:34px!important}
.fo-inp:focus,.fo-sel:focus,.fo-ta:focus{border-color:var(--fo-ink)!important}
.fo-num{display:flex;align-items:center;gap:8px}
.fo-num .fo-inp{width:110px}
.fo-num span{font-size:13.5px;color:var(--fo-muted)}
.fo-rng{display:flex;align-items:center;gap:12px}
.fo-rng input{flex:1;accent-color:var(--fo-ink)}
.fo-rng output{min-width:52px;text-align:right;font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums}
.fo-sw{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px;cursor:pointer;margin:0}
.fo-sw input{appearance:none;-webkit-appearance:none;width:42px;height:24px;border-radius:99px;background:var(--fo-line-2);position:relative;cursor:pointer;transition:background .2s;flex:none;margin:0;border:0}
.fo-sw input::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .2s}
.fo-sw input:checked{background:var(--fo-ink)}
.fo-sw input:checked::after{transform:translateX(18px)}
.fo-swatches{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.fo-swatches button{width:32px;height:32px;border-radius:10px!important;border:2px solid transparent!important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.fo-swatches button[aria-pressed="true"]{border-color:var(--fo-paper)!important;box-shadow:0 0 0 2px var(--fo-ink)}
.fo-swatch-custom{width:32px;height:32px;border-radius:10px;overflow:hidden;background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red);position:relative;cursor:pointer}
.fo-swatch-custom input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.fo-posgrid{display:grid;grid-template-columns:repeat(3,44px);gap:6px;padding:8px;border-radius:12px;background:var(--fo-sunken);width:max-content}
.fo-posgrid button{height:38px;border-radius:8px!important;background:var(--fo-surface)!important;border:1px solid var(--fo-line)!important;display:grid!important;place-items:center}
.fo-posgrid button i{width:10px;height:10px;border-radius:3px;background:var(--fo-line-2)}
.fo-posgrid button[aria-pressed="true"]{border-color:var(--fo-ink)!important}
.fo-posgrid button[aria-pressed="true"] i{background:var(--fo-ink)}
.fo-margins{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fo-margins label{display:grid;gap:4px;font-size:12.5px;color:var(--fo-muted)}
.fo-margins .fo-inp{height:38px}
.fo-imgpick{display:flex;gap:12px;align-items:center}
.fo-imgpick-prev{width:64px;height:64px;border-radius:12px;background:repeating-conic-gradient(#eef0f6 0 25%,#fff 0 50%) 0 0/16px 16px;display:grid;place-items:center;overflow:hidden;flex:none;color:var(--fo-faint);border:1px solid var(--fo-line)}
.fo-imgpick-prev img{width:100%;height:100%;object-fit:contain}
.fo-imgpick small{display:block;font-size:12px;color:var(--fo-muted);margin-top:6px;word-break:break-word}
.fo-sig-tabs{margin-bottom:10px}
.fo-sig-pad{position:relative;border:1px solid var(--fo-line-2);border-radius:12px;background:#fff;height:150px;touch-action:none;overflow:hidden}
.fo-sig-pad canvas{width:100%;height:100%;cursor:crosshair}
.fo-sig-pad .hintline{position:absolute;left:16px;right:16px;bottom:34px;border-top:1px dashed #C9CCDA;pointer-events:none}
.fo-sig-pad .ph{position:absolute;left:16px;bottom:12px;font-size:12px;color:#9195AE;pointer-events:none}
.fo-sig-type{font:600 34px/1.2 'Caveat',cursive!important;height:64px!important}
.fo-sig-upwrap{display:grid;gap:6px}
.fo-sig-upwrap small{font-size:12px;color:var(--fo-muted)}
.fo-sig-row{display:flex;justify-content:space-between;align-items:center;margin-top:8px;gap:8px}
.fo-note{display:flex;gap:10px;padding:12px 14px;border-radius:12px;background:var(--fo-surface-2);border:1px solid var(--fo-line);font-size:13.5px;color:var(--fo-ink-2)}
.fo-note .fo-ic{width:18px;height:18px;color:var(--fo-muted);margin-top:1px}
.fo-note-err{border-color:color-mix(in srgb,var(--fo-err) 35%,var(--fo-line));background:color-mix(in srgb,var(--fo-err) 6%,var(--fo-surface))}
.fo-note-err .fo-ic{color:var(--fo-err)}

/* toasts */
.fo-toasts{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:100000;display:grid;gap:8px;width:min(440px,calc(100% - 24px));pointer-events:none}
.fo-toast{display:flex;gap:10px;align-items:flex-start;background:var(--fo-ink);color:var(--fo-paper);padding:12px 16px;border-radius:14px;box-shadow:var(--fo-shadow);font-size:14.5px;pointer-events:auto}
.fo-toast .fo-ic{width:18px;height:18px;margin-top:1px;color:var(--fo-hl)}
.fo-toast.err .fo-ic{color:#FF8A8D}

/* catalog shortcode (other themes) */
.fo-catalog{display:grid;gap:28px}
.fo-cat h3{display:flex;align-items:center;gap:10px;font-size:1.2rem;margin:0 0 12px}
.fo-cat[data-cat="organize"]{--c:var(--fo-c-organize)}.fo-cat[data-cat="optimize"]{--c:var(--fo-c-optimize)}.fo-cat[data-cat="to"]{--c:var(--fo-c-to)}.fo-cat[data-cat="from"]{--c:var(--fo-c-from)}.fo-cat[data-cat="edit"]{--c:var(--fo-c-edit)}.fo-cat[data-cat="security"]{--c:var(--fo-c-security)}.fo-cat[data-cat="ai"]{--c:var(--fo-c-ai)}.fo-cat[data-cat="image"]{--c:var(--fo-c-image)}
.fo-dot{width:9px;height:9px;border-radius:50%;background:var(--c);display:inline-block}
.fo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.fo-card{display:flex;gap:12px;padding:14px;border-radius:16px;border:1px solid var(--fo-line);background:var(--fo-surface);color:var(--fo-ink);text-decoration:none}
.fo-card:hover{border-color:var(--c)}
.fo-card b{display:block;font-weight:600}.fo-card small{display:block;color:var(--fo-muted);font-size:13.5px;line-height:1.4}
.fo-faq{border-bottom:1px solid var(--fo-line);padding:12px 0}.fo-faq summary{font-weight:600;cursor:pointer}

@media (max-width:1020px){
  .fo-ws-body{grid-template-columns:minmax(0,1fr) 300px}
  .fo-ws-steps{display:none}
}
@media (max-width:760px){
  .fo-ws{border-radius:18px}
  .fo-ws-body{display:block}
  .fo-ws-main{padding:14px}
  .fo-ws-side{border-left:0;border-top:1px solid var(--fo-line)}
  .fo-ws-cta{box-shadow:0 -10px 24px -16px rgba(22,24,47,.3)}
  .fo-app.is-done .fo-ws-cta{position:static;box-shadow:none}
  .fo-dz,.fo-state{min-height:320px}
  .fo-dz{padding:26px 14px}
  .fo-files{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .fo-priv span{display:none}
  .fo-priv{width:30px;padding:0;justify-content:center}
  .fo-ws-top{min-height:48px}
}
@media (prefers-reduced-motion:reduce){.fo-app *,.fo-app *::before,.fo-app *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
