/* Shared page shell, type scale, controls and motion for every FileNeat service. */
:root{scrollbar-gutter:stable;--paper:#fdfdfb;--ink:#221c1b;--muted:#68605a;--accent:#3d5cc7;--surface:#f3f1ec;--divider:#d9d4cf;--white:#fff;--grid:#efede8;--warning:#80531d;--gutter:clamp(20px,4vw,64px);--ease:cubic-bezier(.22,1,.36,1);--radius:28px;--header-height:calc(88px + env(safe-area-inset-top,0px));--header-clearance:calc(160px + env(safe-area-inset-top,0px));--theme-inset:24px;font-family:'Inter Display',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-synthesis:none;color:var(--ink);background:var(--paper);color-scheme:light;scroll-padding-top:calc(var(--header-clearance) + 20px)}
:root[data-theme=dark]{--paper:#191716;--ink:#f1ede7;--muted:#bab1a8;--accent:#adbfff;--surface:#262220;--divider:#514842;--white:#211e1b;--grid:#302c27;--warning:#e7ba7f;color-scheme:dark}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--paper);color:var(--ink);font-weight:400;font-size:1rem;line-height:1.55;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}a{color:inherit;text-decoration:none}h1,h2,h3,p,figure{margin:0;font-weight:400}h1,h2,h3{text-wrap:balance}p{color:var(--muted);line-height:1.65}h2{font-size:clamp(1.75rem,3.2vw,2.625rem);letter-spacing:-.04em;line-height:1.15}h3{font-size:1.5rem;letter-spacing:0;line-height:1.25}::selection{background:var(--accent);color:var(--paper)}
:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button,a,input,select,summary{scroll-margin-top:calc(var(--header-clearance) + 24px)}button,.action,.download{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 24px;border:1px solid var(--ink);border-radius:999px;background:var(--ink);color:var(--paper);font-size:.875rem;line-height:1.4;font-weight:400;cursor:pointer;transition:background 180ms,border-color 180ms,transform 180ms var(--ease)}button:not(:disabled):active,.action:active,.download:active{transform:scale(.98)}button:disabled{opacity:.45;cursor:not-allowed}.secondary,button.secondary,.action.secondary{background:transparent;color:var(--ink);border-color:var(--divider)}.secondary:not(:disabled):hover{background:var(--surface);border-color:var(--muted)}.download[aria-disabled=true],#download-report[aria-disabled=true]{opacity:.4;pointer-events:none}button:not(:disabled):hover,.action:hover,.download:hover{border-color:var(--accent)}button svg,.action svg{width:18px;height:18px}
.site-header{height:var(--header-height);position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:center;gap:48px;padding:calc(16px + env(safe-area-inset-top,0px)) max(var(--gutter),env(safe-area-inset-right,0px)) 16px max(var(--gutter),env(safe-area-inset-left,0px));background:transparent;pointer-events:none}.brand{font-size:1.25rem;font-weight:500;letter-spacing:-.04em;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}.brand span{color:var(--accent)}.site-header nav{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:nowrap}.site-header nav a{display:inline-flex;align-items:center;min-height:44px;font-size:.75rem;color:var(--muted);position:relative}.site-header nav a:after{content:'';position:absolute;bottom:6px;left:0;right:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 220ms var(--ease)}.site-header nav a:hover:after,.site-header nav a[aria-current=page]:after{transform:scaleX(1)}.site-header nav a[aria-current=page]{color:var(--ink)}.theme-toggle{width:44px;min-height:44px;height:44px;padding:0;background:transparent;color:var(--ink);border:1px solid var(--divider);flex-shrink:0}.theme-toggle svg{width:18px;height:18px}.theme-sun,:root[data-theme=dark] .theme-moon{display:none}:root[data-theme=dark] .theme-sun{display:block}.skip-link{position:fixed;top:12px;left:16px;z-index:100;padding:12px 16px;background:var(--ink);color:var(--paper);transform:translateY(-200%)}.skip-link:focus{transform:none}
main,.cad-page main,.documents-page main{max-width:1328px;margin:0 auto;padding:32px var(--gutter) 0}.eyebrow{font-size:.75rem;letter-spacing:0;line-height:1.5;color:var(--muted)}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.muted,.hint{font-size:.8125rem;color:var(--muted)}.back-link{display:inline-flex;align-items:center;gap:16px;min-height:44px;font-size:.8125rem;margin-top:24px;color:var(--muted)}.back-link:hover{color:var(--ink)}.site-footer{max-width:1328px;margin:80px auto 0;padding:24px var(--gutter) 32px;display:flex;align-items:center;gap:24px;font-size:.75rem;position:relative}.site-footer:before{content:'';position:absolute;top:0;left:var(--gutter);right:var(--gutter);height:1px;background:var(--divider)}.site-footer p{margin-right:auto;font-size:.75rem}.site-footer>a:not(.brand){min-height:44px;display:flex;align-items:center;color:var(--muted)}.release-note{color:var(--muted);font-size:.75rem}
/* One introduction and upload layout for all three workspaces. */
.tool-intro,#introduction.tool-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);align-items:start;gap:clamp(40px,7vw,96px);margin:48px 0 64px;min-height:0;position:relative}.tool-copy{padding-top:20px;min-width:0}.tool-copy h1{font-size:clamp(2.375rem,4.4vw,3.75rem);line-height:1.08;letter-spacing:-.04em;margin:20px 0 24px;max-width:15ch}.tool-copy>p:not(.eyebrow):not(.format-note){max-width:36ch;font-size:1.0625rem}.tool-copy .format-note{font-size:.75rem;margin-top:24px;color:var(--muted)}.beta-label{display:inline-block;margin-left:12px;padding:1px 8px;border:1px solid var(--divider);border-radius:6px;font-size:.75rem;vertical-align:middle}.upload-panel,.document-card{min-width:0;background:var(--surface);border:1px solid var(--divider);border-radius:var(--radius);padding:24px;margin:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.panel-heading h2{font-size:1.25rem;font-weight:500;letter-spacing:0;line-height:1.4}.panel-heading>span{font-size:.75rem;color:var(--muted)}.drop,.cad-page .drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;min-height:184px;margin:0 0 16px;padding:24px 16px;background:var(--paper);border:1px dashed var(--divider);border-radius:20px;cursor:pointer;transition:background 180ms,border-color 180ms}.drop:hover,.drop:focus-within,.drop.is-dragging{border-color:var(--accent);background:var(--white)}.drop:focus-within{outline:2px solid var(--accent);outline-offset:4px}.drop.has-file{border-style:solid}.drop .upload-symbol{width:36px;height:36px;color:var(--muted);margin:0 0 4px}.drop strong,.cad-page .drop strong{font-size:1rem;letter-spacing:0;font-weight:400}.drop small,.cad-page .drop span{font-size:.75rem;color:var(--muted);line-height:1.6}.upload-input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1}.upload-input:disabled{cursor:wait}.upload-panel #convert,.upload-panel #inspect,.upload-panel #document-convert{width:100%;min-height:48px}.upload-panel .row{margin:16px 0 0}#filename,.selected-filename{font-size:.75rem;overflow-wrap:anywhere;max-width:100%}#filename:empty{display:none}#upload-status,.upload-panel #status,#document-status{font-size:.75rem;line-height:1.6;margin:16px 0 0;min-height:20px;color:var(--muted)}
select,input[type=number],input[type=text]{background:var(--paper);color:var(--ink);border:1px solid var(--divider);border-radius:12px;min-height:46px;padding:12px 12px;min-width:0}input[type=range],input[type=checkbox]{accent-color:var(--ink)}input[type=checkbox]{width:18px;height:18px}summary{cursor:pointer;min-height:44px;align-content:center;font-size:.875rem;letter-spacing:0}summary::marker{color:var(--muted)}details{border-top:1px solid var(--divider);padding:12px 0 0;margin-top:20px}details>p{margin:12px 0}details[open]::details-content{animation:detail-in 220ms var(--ease)}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:.75rem/1.6 ui-monospace,monospace;max-height:320px;overflow:auto;color:var(--muted)}.operation-field{display:grid;gap:12px;margin-bottom:20px}.operation-field label{display:grid;gap:12px;font-size:.8125rem}.operation-field select{width:100%;font-size:.9375rem}.document-fields{grid-template-columns:1fr 1fr;gap:16px}.document-help{font-size:.8125rem;margin:8px 0 20px;min-height:0}.document-actions{margin:20px 0 0;gap:12px}.document-card .document-actions{display:block}.document-card .document-actions button{width:100%}.document-fields .check-label{font-size:.75rem}.upload-panel .settings{grid-template-columns:1fr 1fr;padding:16px 0;gap:16px}.upload-panel details .hint{font-size:.75rem}.upload-panel .settings label{font-size:.75rem}.document-note{font-size:.8125rem}
#result,#cad-result,#document-result{scroll-margin-top:calc(var(--header-clearance) + 16px)}#comparison-stage{top:var(--header-clearance);scroll-margin-top:var(--header-clearance)}.workspace-heading h2{font-size:2rem}.workspace-heading p{font-size:.8125rem}#document-result{margin-top:64px}#document-result h2{overflow-wrap:anywhere;font-size:2rem;margin:12px 0}#document-result>.eyebrow{margin-bottom:8px}#result-summary{font-size:.8125rem}.result-checks{margin:20px 0}.document-preview h3{font-size:1.25rem}.document-preview{margin-top:32px}#document-warnings{font-size:.8125rem;background:var(--surface);color:var(--warning)}.table-scroll:focus-visible{outline-offset:3px}.cad-page .workspace{gap:20px}.cad-page .toolbar{border-radius:0}.view,.inspector,.panels,.toolbar{border-radius:20px}.toolbar{border-radius:20px 20px 0 0}.panels{border-radius:0 0 20px 20px}.canvas{background:repeating-conic-gradient(var(--grid) 0% 25%,var(--paper) 0% 50%) 0/16px 16px}.inspector{padding:24px}.viewport{background:#fdfdfb}.checks h2{font-size:2rem}.badge.passed{color:#376c42}:root[data-theme=dark] .badge.passed{color:#a3d5a8}:root[data-theme=dark] .badge.failed{color:#ffac94}.caption{font-size:.75rem;letter-spacing:0}.view-switch button,.zoom-tools button,.cad-page .toolbar button{min-height:44px}.palette label{min-height:44px}.palette-colour button{min-height:44px}
/* Landing page: a specific service catalogue, with an illustrative conversion. */
.home-hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:clamp(40px,6vw,96px);padding:64px 0 96px}.home-hero h1{font-size:clamp(3rem,5.7vw,5rem);line-height:1.05;letter-spacing:-.04em;margin:24px 0;max-width:12ch}.home-hero h1 span{color:var(--muted)}.hero-copy>p:not(.eyebrow){font-size:1.0625rem;max-width:39ch}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}.hero-actions a{min-height:48px}.text-link{display:inline-flex;align-items:center;gap:16px;min-height:44px;font-size:.875rem}.text-link:hover{color:var(--accent)}.conversion-study{position:relative;padding:40px 24px 24px;background:var(--surface);border-radius:32px;border:1px solid var(--divider);min-width:0}.study-label{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:.75rem;color:var(--muted);margin-bottom:32px}.study-label span:first-child{color:var(--ink)}.sample-page{width:72%;padding:24px;background:var(--paper);border:1px solid var(--divider);border-radius:7px;transform:rotate(-5deg);transform-origin:50% 100%;box-shadow:0 12px 30px #221c1b08;margin:0 0 0 8px}.sample-page .file-type{font-size:.75rem;color:var(--accent);letter-spacing:.08em}.sample-page h3{font-size:1.25rem;margin:16px 0 8px}.sample-page p{font-size:.75rem}.sample-lines{margin-top:24px;display:grid;grid-template-columns:1fr 40px;gap:12px}.sample-lines i{height:5px;background:var(--divider);border-radius:2px}.sample-lines i:nth-child(3n){width:72%}.sample-arrow{position:relative;text-align:right;margin:-20px 12px 8px;color:var(--accent);font-size:1.75rem}.sample-sheet{position:relative;margin-left:40px;background:var(--paper);border:1px solid var(--divider);border-radius:12px;overflow:hidden;box-shadow:0 12px 30px #221c1b08}.sheet-title{display:flex;align-items:center;justify-content:space-between;padding:16px 16px;font-size:.75rem;border-bottom:1px solid var(--divider)}.sheet-title span{color:var(--muted);font-size:.75rem}.sample-sheet table{width:100%;border-collapse:collapse;font-size:.75rem;text-align:left}.sample-sheet th,.sample-sheet td{font-weight:400;padding:12px 12px;border-bottom:1px solid var(--divider);border-right:1px solid var(--divider)}.sample-sheet th{background:var(--surface);font-size:.75rem;color:var(--muted)}.sample-sheet td:last-child{text-align:right}.sample-sheet tr:last-child td{border-bottom:0}.study-caption{font-size:.75rem;text-align:center;margin-top:20px;color:var(--muted)}.home-section{border-top:1px solid var(--divider);padding:64px 0}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:32px}.section-heading h2{margin-top:16px}.section-heading>p{max-width:36ch;font-size:.875rem}.tools-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.service-card{border:1px solid var(--divider);border-radius:var(--radius);padding:32px;background:var(--surface);min-width:0}.documents-card{grid-column:1/-1}.service-heading{display:flex;gap:24px;justify-content:space-between;align-items:flex-start;margin-bottom:24px}.service-heading h3{font-size:1.75rem}.service-heading p{font-size:.875rem;margin-top:8px;max-width:52ch}.service-number{font-size:.75rem;color:var(--muted)}.conversion-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px}.conversion-links a{border-top:1px solid var(--divider);padding:16px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;font-size:.875rem;transition:color 180ms}.conversion-links a span:last-child{color:var(--muted);transition:transform 220ms var(--ease)}.conversion-links a:hover{color:var(--accent)}.conversion-links a:hover span:last-child{transform:translateX(3px)}.service-bottom{border-top:1px solid var(--divider);padding-top:16px;display:flex;align-items:center;justify-content:space-between;gap:20px}.service-bottom p{font-size:.75rem}.service-bottom a{white-space:nowrap}.service-icon{width:100%;height:120px;margin:20px 0 24px;color:var(--ink)}.process-section{display:grid;grid-template-columns:1fr 1.2fr;gap:80px}.process-section h2{margin-top:16px;max-width:13ch}.process-list{margin:0;padding:0;list-style:none}.process-list li{padding:24px 0;border-bottom:1px solid var(--divider);display:grid;grid-template-columns:32px 1fr;gap:20px}.process-list li:first-child{padding-top:0}.process-list li>span{font-size:.75rem;color:var(--accent);padding-top:3px}.process-list h3{font-size:1.25rem;margin-bottom:8px}.process-list p{font-size:.875rem;max-width:47ch}.file-handling{display:grid;grid-template-columns:1fr 1.2fr;gap:80px}.file-handling h2{font-size:2rem}.file-handling details{margin:0;padding:12px 0;border-bottom:1px solid var(--divider);border-top:0}.file-handling summary{font-size:1rem}.file-handling p{font-size:.875rem;margin:8px 0 16px;max-width:60ch}
@supports(corner-shape:superellipse(1.5)){.upload-panel,.document-card,.service-card,.conversion-study,.view,.inspector{corner-shape:superellipse(1.5);border-radius:40px}.drop,.cad-page .drop{corner-shape:superellipse(1.5);border-radius:16px}}
@view-transition{navigation:auto}::view-transition-old(root){animation:page-out 160ms ease both}::view-transition-new(root){animation:page-in 340ms var(--ease) both}::view-transition-group(site-navigation),::view-transition-group(site-brand){animation-duration:340ms;animation-timing-function:var(--ease)}@keyframes page-out{to{opacity:0}}@keyframes page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes detail-in{from{opacity:.4;translate:0 -4px}to{opacity:1;translate:0 0}}
@media(max-width:1000px){.tool-intro,#introduction.tool-intro{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:40px}.home-hero{gap:32px}.home-hero h1{font-size:3.5rem}.conversion-study{padding:24px 16px}.sample-sheet{margin-left:20px}.sample-page{width:78%}.process-section,.file-handling{gap:40px}.service-bottom{align-items:flex-start;flex-direction:column;gap:8px}.conversion-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){:root{--header-height:calc(104px + env(safe-area-inset-top,0px))}.site-header{height:var(--header-height);display:grid;grid-template-columns:1fr auto;gap:0;padding:calc(8px + env(safe-area-inset-top,0px)) max(var(--gutter),env(safe-area-inset-right,0px)) 4px max(var(--gutter),env(safe-area-inset-left,0px))}.site-header .brand{font-size:1.25rem}.site-header nav{grid-row:2;grid-column:1/-1;gap:24px;justify-content:center}.site-header nav a{font-size:.75rem;min-height:44px}.site-header nav a:after{bottom:5px}main,.cad-page main,.documents-page main{padding:20px var(--gutter) 0}.tool-intro,#introduction.tool-intro{display:grid;grid-template-columns:1fr;gap:24px;margin:12px 0 40px;min-height:0}.tool-copy{padding-top:0}.tool-copy h1{font-size:2.625rem;margin:16px 0 16px;max-width:17ch}.tool-copy>p:not(.eyebrow):not(.format-note){font-size:.9375rem;max-width:42ch}.tool-copy .format-note{font-size:.75rem;margin-top:16px}.tool-copy .back-link{display:none}.upload-panel,.document-card{padding:24px;margin:0}.drop,.cad-page .drop{min-height:152px;padding:20px 16px}.panel-heading{margin-bottom:20px}.document-fields{gap:16px}.document-actions{flex-direction:row;align-items:center}.document-actions a{width:auto}.site-footer{margin-top:48px;padding-bottom:24px;gap:4px 20px;flex-wrap:wrap}.site-footer .brand{flex-basis:100%}.site-footer p{flex-basis:100%;margin-bottom:8px}.site-footer .release-note{margin-left:auto}.home-hero{grid-template-columns:1fr;padding:32px 0 48px;gap:40px}.home-hero h1{font-size:clamp(2.875rem,9vw,4.125rem);margin:16px 0 24px;max-width:13ch}.hero-copy>p:not(.eyebrow){font-size:1rem;max-width:38ch}.hero-actions{margin-top:24px}.conversion-study{padding:24px;max-width:540px;width:100%;margin:auto}.study-label{margin-bottom:24px}.sample-page{width:70%;padding:16px}.sample-sheet{margin-left:40px}.sample-page h3{margin-top:12px}.sample-lines{gap:12px;margin-top:16px}.sample-arrow{margin-top:-12px}.sample-sheet td{padding:8px 12px}.home-section{padding:40px 0}.section-heading{display:block;margin-bottom:24px}.section-heading>p{margin-top:16px}.section-heading h2{font-size:2.125rem}.tools-grid{grid-template-columns:1fr;gap:16px}.service-card{padding:24px}.conversion-links{column-gap:20px}.conversion-links a{font-size:.8125rem;min-height:64px}.service-heading{margin-bottom:24px}.service-heading h3{font-size:1.5rem}.service-heading p{font-size:.875rem}.service-bottom{flex-direction:row;align-items:center}.process-section,.file-handling{grid-template-columns:1fr;gap:24px}.process-section h2{max-width:17ch}.process-list li{gap:12px}.file-handling h2{font-size:1.75rem}.workspace-heading h2{font-size:1.5rem}.workspace-heading{gap:12px}.workspace-heading .download{white-space:nowrap;font-size:.75rem;padding:12px 16px}.view-switch button{font-size:.75rem;padding:8px 12px}.zoom-tools button,.zoom-tools select{min-height:44px}.toolbar{padding:12px}.outcome-controls{gap:12px;margin:16px 0}.outcome-controls>.control{min-width:0}.outcome-controls #keep-subject{font-size:.75rem;padding:12px 16px}.caption{font-size:.75rem}.caption span{font-size:.75rem}.status-row{gap:12px}.status-row button{font-size:.75rem;min-height:44px}.palette label{font-size:.75rem;min-height:44px}.palette-colour button{font-size:.75rem;min-height:44px}#document-result h2{font-size:1.75rem}.document-preview table{font-size:.75rem}}
@media(max-width:400px){.site-header nav{gap:24px}.tool-copy h1{font-size:2.5rem}.upload-panel,.document-card{padding:20px}.sample-sheet{margin-left:12px}.conversion-study{padding:20px}.conversion-links{grid-template-columns:1fr}.conversion-links a{min-height:56px}.hero-actions{gap:12px}.hero-actions .action{padding:12px 16px}.service-bottom{flex-direction:column;align-items:flex-start}.document-fields,.upload-panel .settings{grid-template-columns:1fr}.site-footer .release-note{margin-left:0}.view-switch button{padding-inline:8px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}@view-transition{navigation:none}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}::view-transition-old(root),::view-transition-new(root){animation:none}}
@media(prefers-contrast:more){:root{--muted:var(--ink);--divider:var(--ink)}}
.payment-intro{display:grid;grid-template-columns:1fr 1.2fr;gap:80px}.payment-intro h2{margin-top:16px}.payment-intro>div>p:not(.eyebrow):not(.preview-note){max-width:45ch;font-size:1.0625rem}.payment-intro .text-link{margin-top:20px}.preview-note{font-size:.75rem;line-height:1.6;color:var(--muted);margin-top:16px}.pricing-intro{padding:48px 0 40px;max-width:640px}.pricing-intro h1{font-size:clamp(2.625rem,5vw,4.25rem);line-height:1.07;letter-spacing:-.04em;margin:20px 0 24px}.pricing-intro>p:not(.eyebrow):not(.preview-note){font-size:1.25rem}.pricing-intro .preview-note{max-width:62ch;margin-top:24px}.payment-options{display:grid;grid-template-columns:1fr 1fr;gap:24px}.payment-options h2{font-size:2rem;margin:16px 0 20px}.payment-options .service-card{display:flex;flex-direction:column;align-items:flex-start}.payment-options p{font-size:.9375rem;max-width:40ch}.payment-options .eyebrow{font-size:.75rem}.payment-options ul{padding-left:16px;margin:24px 0 24px;flex:1;color:var(--muted);font-size:.875rem;line-height:2}.pricing-return{margin:32px 0}dialog{border:1px solid var(--divider);border-radius:28px;background:var(--paper);color:var(--ink);width:min(560px,calc(100% - 32px));max-height:calc(100svh - 32px);overflow:auto;padding:24px}dialog[open]{animation:detail-in 240ms var(--ease)}dialog::backdrop{background:#14110f66;backdrop-filter:blur(6px)}.dialog-heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:20px}.close-dialog{width:44px;height:44px;padding:0;font-size:1.5rem}dialog h2{font-size:2rem}.payment-steps{display:flex;gap:12px;padding:0;list-style:none;margin:24px 0}.payment-steps li{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--divider);border-radius:50%;font-size:.75rem;color:var(--muted)}.payment-steps li[aria-current]{background:var(--ink);color:var(--paper);border-color:var(--ink)}#payment-stage{min-height:140px}#payment-stage h3{font-size:1.5rem;margin-bottom:12px}#payment-stage p{font-size:.9375rem}.payment-controls{display:flex;justify-content:space-between;gap:16px;margin-top:24px}
@media(max-width:760px){.site-header nav{gap:24px}.site-header nav a{font-size:.75rem}.payment-intro{grid-template-columns:1fr;gap:24px}.payment-options{grid-template-columns:1fr;gap:16px}.pricing-intro{padding:20px 0 32px}.payment-options h2{font-size:2rem}.payment-intro>div>p:not(.eyebrow):not(.preview-note){font-size:1rem}}
@media(max-width:400px){.site-header nav{gap:16px}dialog{padding:24px}dialog h2{font-size:1.75rem}.payment-options .action{font-size:.8125rem;padding-inline:16px}}
/* A navigation snapshot must never intercept a control on the destination page. */
::view-transition{pointer-events:none}
@media(max-width:760px){.outcome-controls>.control[for=artwork-mode]{flex:1;flex-basis:0;min-width:0;max-width:none}.outcome-controls>.control[for=artwork-mode] select{font-size:.75rem;padding-inline:12px}.outcome-controls #keep-subject{align-self:flex-end;max-width:50%;margin:0}.outcome-controls #line-options{flex-basis:100%}.outcome-controls>.control>span{font-size:.75rem}.canvas{height:clamp(220px,34svh,300px)}}

.upload-panel details + #inspect{margin-top:20px}
/* Pin the comparison only during refinement, so it cannot cover the closed settings row. */
#comparison-stage{position:relative;top:auto}
#result[data-adjusting=true] #comparison-stage{position:sticky;top:var(--header-clearance)}
.artwork-page .canvas[data-viewer-ready=true]{touch-action:none;overflow-anchor:none}
.artwork-page .canvas[data-zoomed=true]{cursor:grab}
.artwork-page .canvas[data-dragging=true]{cursor:grabbing}
.artwork-page .canvas img{pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.artwork-page .palette{display:block;margin:24px 0 24px}
.palette-heading{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.palette-heading h3{font-size:1.25rem;font-weight:500;letter-spacing:0}
.palette-count{font-size:.75rem;color:var(--muted)}
.palette-heading .text-link{margin-left:auto;padding:4px 0;border:0;background:none;color:var(--muted);font-size:.75rem}
.palette-families{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px}
.palette-family{min-width:0;padding-top:8px;border-top:1px solid var(--divider)}
.palette-family[data-family="0"]{grid-column:1/-1}
.palette .palette-family-label{display:flex;align-items:center;gap:8px;min-height:36px;font-size:.75rem}
.palette input[type=checkbox]{width:16px;height:16px;accent-color:var(--ink);flex-shrink:0}
.palette-family-count{margin-left:auto;font:.75rem ui-monospace,monospace;color:var(--muted)}
.palette-swatches{display:flex;flex-wrap:wrap;gap:2px;padding:3px 0 8px}
.palette button.palette-swatch{position:relative;width:44px;height:44px;min-height:44px;padding:0;border:1px solid transparent;border-radius:12px;background:none;box-shadow:none}
.palette-swatch:before{content:'';position:absolute;inset:5px;border-radius:7px;background:var(--swatch);box-shadow:inset 0 0 0 1px #7774}
.palette button.palette-swatch[data-selected=true]{border-color:var(--accent)}
.palette button.palette-swatch:hover{background:var(--surface)}
.palette-swatch[data-included=false]:before{opacity:.3}
.palette-swatch[data-included=false]:after{content:'';position:absolute;left:7px;right:7px;top:21px;height:1px;background:var(--ink);transform:rotate(-45deg);box-shadow:0 0 0 1px var(--paper)}
.palette .palette-editor{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:20px;padding-top:16px;border-top:1px solid var(--divider)}
.palette-selected-name{font-size:.75rem;min-width:64px}
.palette .palette-editor input[type=color]{width:44px;height:44px;min-height:44px;cursor:pointer;padding:4px}
.palette-hex{font:.75rem ui-monospace,monospace;color:var(--muted);min-width:60px}
.palette .palette-editor label{display:flex;gap:8px;align-items:center;margin-left:auto;font-size:.75rem;min-height:44px}
.palette .palette-editor button{min-height:44px;font-size:.75rem;padding:8px 16px}
@supports(corner-shape:superellipse(1.5)){.palette button.palette-swatch,.palette-swatch:before{corner-shape:superellipse(1.5)}}
@media(max-width:600px){.palette-families{grid-template-columns:1fr;gap:12px}.palette-heading{gap:12px}.palette-heading .text-link{font-size:.75rem}.palette .palette-editor{gap:12px}.palette .palette-editor label{margin-left:0}.palette .palette-editor button{margin-left:auto}}
@media(forced-colors:active){.palette button.palette-swatch{border-color:ButtonText}.palette-swatch:before{forced-color-adjust:none}.palette button.palette-swatch[data-selected=true]{outline:2px solid Highlight;outline-offset:-2px}}
#advanced :is(input,select,button){scroll-margin-top:calc(var(--header-clearance) + clamp(200px,32svh,360px) + 160px)}
@media(max-width:760px){#advanced :is(input,select,button){scroll-margin-top:calc(var(--header-clearance) + clamp(180px,28svh,260px) + 180px)}}

/* Original SVG studies share a quiet technical drawing language. */
.home-hero{grid-template-columns:1fr 1.1fr;gap:clamp(32px,5vw,80px)}
.conversion-study{padding:24px 24px 20px;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 28%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 58%),var(--surface)}
.conversion-study:before{content:'';position:absolute;inset:12px;border:1px solid color-mix(in srgb,var(--paper) 65%,transparent);border-radius:24px;pointer-events:none;z-index:-1}
.conversion-study .study-label{margin-bottom:0;font-size:.75rem;letter-spacing:0}
.hero-illustration{width:calc(100% + 24px);max-width:none;display:block;margin:4px -12px -4px;overflow:visible}
.motion-study svg [data-motion]{transform-box:fill-box;transform-origin:center}
.svg-label{font-size:11px;fill:var(--muted)}.svg-heading{font-size:16px;fill:var(--ink);letter-spacing:-.4px}.svg-micro{font-size:8px;fill:var(--muted)}.svg-cell{font-size:12px;fill:var(--ink)}.svg-file{fill:var(--ink)}.accent-ink{color:var(--accent);fill:var(--accent)}
.study-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;font-size:.75rem;line-height:1.5;color:var(--ink)}
.study-footer figcaption{font-size:.875rem;letter-spacing:0}.study-footer figcaption span{color:var(--muted)}
.illustration-note{font-size:.75rem;margin-top:12px;color:var(--muted)}
.motion-control{flex-shrink:0;min-height:44px;padding:8px 12px;gap:8px;border-color:transparent;background:transparent;color:var(--muted);font-size:.75rem}
.motion-control svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.motion-control .pause-symbol,.motion-control .play-symbol{display:none}
[data-motion-state=playing] .motion-control .replay-symbol,[data-motion-state=paused] .motion-control .replay-symbol{display:none}
[data-motion-state=playing] .motion-control .pause-symbol,[data-motion-state=paused] .motion-control .play-symbol{display:block}
.service-study{margin:0 -12px 24px}.service-study>svg{width:100%;height:auto;display:block}.service-study .study-footer{margin:8px 12px 0;color:var(--muted);font-size:.75rem}
.service-card{transition:border-color 300ms,box-shadow 400ms var(--ease)}
.service-card:focus-within{border-color:var(--muted)}
.privacy-section{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:center}.privacy-copy h2{font-size:clamp(2.25rem,4.4vw,3.5rem);margin:16px 0 24px}.privacy-copy>p:not(.eyebrow){font-size:.9375rem;max-width:42ch;margin:12px 0}.privacy-copy .text-link{margin-top:12px}
.privacy-study{padding:24px;border:1px solid var(--divider);border-radius:28px;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--accent) 7%,transparent),transparent 65%)}.privacy-study>svg{display:block;width:100%;height:auto}.privacy-study .study-footer{font-size:.75rem;color:var(--muted)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.service-card:hover{border-color:color-mix(in srgb,var(--muted) 60%,var(--divider));box-shadow:0 16px 40px -32px color-mix(in srgb,var(--ink) 30%,transparent)}.hero-actions .action:hover{transform:translateY(-2px);box-shadow:0 8px 20px -10px var(--muted)}.text-link span{transition:transform 300ms var(--ease)}.text-link:hover span{transform:translateX(3px)}}
@media(max-width:1000px){.conversion-study{padding:24px 20px 16px}.privacy-section{gap:40px}}
@media(max-width:760px){.home-hero{grid-template-columns:1fr;gap:40px}.home-hero h1{max-width:13ch}.conversion-study{max-width:540px;padding:24px 24px 16px}.privacy-section{grid-template-columns:1fr;gap:24px}.privacy-study{max-width:540px;width:100%;margin:auto}.privacy-copy h2{font-size:2.5rem}.privacy-copy>p:not(.eyebrow){max-width:45ch}.service-study{margin-inline:-16px}}
@media(max-width:400px){.conversion-study{padding:20px 16px 16px}.study-footer figcaption{font-size:.75rem}.study-label span{font-size:.75rem}.privacy-study{padding:16px}.privacy-study .study-footer{gap:8px;font-size:.75rem}.service-study .study-footer{font-size:.75rem}}

.upload-privacy{font-size:.75rem;line-height:1.6;margin:12px 0 16px;max-width:54ch}.upload-privacy a{display:inline-flex;align-items:center;min-height:32px;text-decoration:underline;text-underline-offset:3px;color:var(--ink)}

/* Squash's graduated blur: independent masks keep the lower edge feathered. */
/* Content fades into the top edge; a short solid strip read as a line once blurred text passed beneath it. */
.site-header::before{content:"";position:absolute;z-index:0;inset:0 0 auto;height:calc(env(safe-area-inset-top,0px) + 72px);background:linear-gradient(to bottom,var(--paper) env(safe-area-inset-top,0px),color-mix(in srgb,var(--paper) 92%,transparent) calc(env(safe-area-inset-top,0px) + 16px),color-mix(in srgb,var(--paper) 70%,transparent) calc(env(safe-area-inset-top,0px) + 36px),color-mix(in srgb,var(--paper) 30%,transparent) calc(env(safe-area-inset-top,0px) + 56px),transparent);pointer-events:none}
.header-blur{position:absolute;inset:0 0 auto;height:var(--header-clearance);pointer-events:none}
.header-blur span{position:absolute;inset:0;-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));-webkit-mask-image:linear-gradient(to bottom,#000 var(--fade-start),transparent var(--fade-end));mask-image:linear-gradient(to bottom,#000 var(--fade-start),transparent var(--fade-end))}
/* Keep transition capture off the header: it would isolate its backdrop layers. */
.site-header>.brand,.site-header>nav{position:relative;z-index:1;pointer-events:auto}
.site-header>.brand{view-transition-name:site-brand}.site-header>nav{view-transition-name:site-navigation}
.theme-toggle{position:fixed;z-index:30;right:calc(var(--theme-inset) + env(safe-area-inset-right,0px));bottom:calc(var(--theme-inset) + env(safe-area-inset-bottom,0px));background:color-mix(in srgb,var(--paper) 12%,transparent);color:var(--muted);border-color:color-mix(in srgb,var(--ink) 12%,transparent);-webkit-backdrop-filter:blur(12px) saturate(1.25);backdrop-filter:blur(12px) saturate(1.25);box-shadow:inset 0 1px 0 #ffffff29,0 2px 8px #0000000f;view-transition-name:theme-toggle}
.theme-toggle:not(:disabled):hover{color:var(--ink);border-color:color-mix(in srgb,var(--ink) 24%,transparent)}
.site-footer{padding-bottom:calc(80px + env(safe-area-inset-bottom,0px))}
@media(max-width:760px){:root{--theme-inset:16px;--header-clearance:calc(120px + env(safe-area-inset-top,0px))}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.header-blur{display:none}.site-header,.theme-toggle{background:var(--paper)}}
@media(prefers-contrast:more),(prefers-reduced-transparency:reduce){.header-blur{display:none}.site-header,.theme-toggle{background:var(--paper)}.theme-toggle{color:var(--ink);border-color:var(--ink);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(forced-colors:active){.header-blur{display:none}.site-header,.theme-toggle{background:Canvas}.theme-toggle{color:ButtonText;border-color:ButtonText;-webkit-backdrop-filter:none;backdrop-filter:none}}

.fine-detail-control{margin-top:20px}.fine-detail-control .check{font-size:.875rem;color:var(--ink)}.fine-detail-control p{font-size:.75rem;margin:0 0 0 24px;max-width:65ch;line-height:1.6}.control:has(input:disabled){opacity:.55}
/* Pricing and readable legal documents. */
.pricing-status,.legal-status{padding:20px 24px;border:1px solid var(--divider);border-radius:22px;background:var(--surface);font-size:.8125rem;line-height:1.65;max-width:70ch}.pricing-status p{margin:8px 0 0;font-size:.8125rem}.price-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:40px 0 96px}.price-plan{padding:32px 24px;border-top:1px solid var(--divider)}.price-plan:nth-child(2){background:var(--surface);border-radius:28px;border-top-color:transparent}.price-plan h2{font-size:3.5rem;font-weight:500;letter-spacing:-.04em;margin:32px 0 16px}.price-plan h2>span{font-size:.75rem;letter-spacing:0;color:var(--muted)}.price-plan p{font-size:.875rem;color:var(--muted)}.price-plan .plan-quantity{font-size:1.25rem;color:var(--ink);margin-bottom:8px}.price-plan .plan-unit{font-size:.75rem;margin-bottom:24px}.price-plan .action{margin-top:20px;font-size:.75rem;padding-inline:16px}.price-explainer{display:grid;grid-template-columns:1fr 1.4fr;gap:64px;padding:64px 0;border-top:1px solid var(--divider)}.price-explainer h2,.price-faq h2{font-size:2.5rem;font-weight:500;line-height:1.1;letter-spacing:-.04em}.price-explainer p,.price-faq p{font-size:.875rem;line-height:1.75;color:var(--muted)}.price-faq{max-width:850px;padding:48px 0 64px}.price-faq details{padding:20px 0}.price-faq summary{font-size:1rem}.footer-legal{display:flex;gap:16px;font-size:.75rem}.legal-heading{padding:48px 0}.legal-heading h1{font-size:clamp(2.5rem,6vw,4.375rem);font-weight:500;letter-spacing:-.04em;line-height:1.08;margin:24px 0}.legal-heading>p:last-child{color:var(--muted);font-size:.9375rem}.legal-page main{max-width:1080px}.legal-content{max-width:76ch}.legal-content section{padding:24px 0;border-bottom:1px solid var(--divider);scroll-margin-top:180px}.legal-content h2{font-size:1.375rem;font-weight:500;letter-spacing:0;margin:12px 0 16px}.legal-content p,.legal-content blockquote{font-size:.9375rem;line-height:1.85;color:var(--muted);margin-bottom:16px}.legal-content a,.price-faq a{color:var(--accent)}.legal-related{display:flex;gap:20px;flex-wrap:wrap;align-items:center;padding:32px 0;font-size:.8125rem}.legal-related button{font-size:.75rem}.legal-status strong{color:var(--ink)}
@media(max-width:760px){.price-plans{grid-template-columns:1fr;gap:16px;margin:24px 0 48px}.price-plan{padding:24px 20px}.price-plan h2{margin-top:24px}.price-explainer{grid-template-columns:1fr;gap:20px;padding:32px 0}.price-explainer h2,.price-faq h2{font-size:2rem}.legal-heading{padding:20px 0}.legal-content p{font-size:.875rem}.footer-legal{flex-basis:100%;padding-top:12px}.pricing-status{padding:16px}}
@media print{.site-header,.theme-toggle,.site-footer,.skip-link,.legal-related button{display:none!important}.legal-page main{max-width:none;margin:0;padding:0}.legal-heading{padding:0}.legal-content{max-width:none}.legal-content section{break-inside:avoid}.legal-page{color:#000;background:#fff}.legal-content p{color:#222}}
/* Pricing: a compact introduction and one consistent comparison grid. */
.pricing-page main{max-width:1160px}.pricing-page .pricing-intro{text-align:center;padding:40px 0 40px;max-width:none;margin:0}.pricing-page .pricing-intro .eyebrow{justify-content:center;font-size:.75rem;margin-bottom:16px}.pricing-page .pricing-intro h1{font-size:clamp(2.5rem,5vw,4rem);line-height:1.1;letter-spacing:-.04em;font-weight:500;margin:0 0 20px;max-width:none}.pricing-page .pricing-intro>p:last-child{font-size:1rem;max-width:none;margin:0;color:var(--muted)}
.pricing-page .price-plans{gap:0;margin:0;border:1px solid var(--divider);border-radius:30px;overflow:hidden;background:var(--paper)}.pricing-page .price-plan{position:relative;padding:32px;display:flex;flex-direction:column;align-items:flex-start;border:0;border-radius:0;margin:0;background:none;min-width:0}.pricing-page .price-plan+.price-plan{border-left:1px solid var(--divider)}.pricing-page .price-plan:nth-child(2){background:color-mix(in srgb,var(--accent) 3%,var(--paper));border-radius:0}.pricing-page .price-plan .eyebrow{font-size:.75rem;margin:0 0 24px;color:var(--muted)}.pricing-page .price-plan .plan-quantity{font-size:1.25rem;letter-spacing:0;color:var(--ink);margin:0 0 24px}.pricing-page .price-plan h2{display:flex;align-items:baseline;gap:2px;font-variant-numeric:lining-nums tabular-nums;font-size:3.5rem;letter-spacing:-.04em;line-height:1.1;margin:0 0 12px;font-weight:500}.pricing-page .price-plan h2 .price-currency{font-size:2rem;color:var(--ink);letter-spacing:0;font-weight:400}.pricing-page .price-plan .plan-unit{margin:0 0 32px;font-size:.75rem}.pricing-page .price-plan .plan-detail{font-size:.8125rem;margin:0 0 8px}.plan-payment{font-size:.75rem;color:var(--muted)}.pricing-bottom{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:24px 0 64px}.pricing-page .pricing-status{padding:0;border:0;border-radius:0;background:none;max-width:none;line-height:1.5}.pricing-page .pricing-status strong{font-size:.75rem;font-weight:400;color:var(--muted)}.pricing-page .pricing-status p{font-size:.75rem;margin:4px 0 0;color:var(--muted)}.pricing-bottom .action{font-size:.75rem;white-space:nowrap;padding:12px 24px}.pricing-page .price-explainer{gap:64px;padding:48px 0}.pricing-page .price-faq{padding-top:32px}
@media(max-width:760px){.pricing-page .pricing-intro{padding:24px 0 32px}.pricing-page .pricing-intro h1{font-size:2.625rem}.pricing-page .pricing-intro>p:last-child{font-size:.875rem}.pricing-page .price-plans{border-radius:24px;gap:0}.pricing-page .price-plan{padding:24px;display:grid;grid-template-columns:1fr auto;column-gap:16px;align-items:baseline}.pricing-page .price-plan+.price-plan{border-left:0;border-top:1px solid var(--divider)}.pricing-page .price-plan .eyebrow{grid-column:1;grid-row:1;margin:0 0 12px}.pricing-page .price-plan .plan-quantity{grid-column:1;grid-row:2;font-size:1.25rem;margin:0 0 16px}.pricing-page .price-plan h2{grid-column:2;grid-row:1/3;font-size:2.625rem;align-self:center;margin:0}.pricing-page .price-plan h2 .price-currency{font-size:1.5rem}.pricing-page .price-plan .plan-unit{grid-column:2;grid-row:3;font-size:.75rem;text-align:right;margin:0}.pricing-page .price-plan .plan-detail{grid-column:1;grid-row:3;font-size:.75rem;margin:0}.plan-payment{grid-column:1/-1;font-size:.75rem;margin-top:8px}.pricing-bottom{flex-direction:column;align-items:flex-start;gap:20px;padding:24px 0 40px}.pricing-page .price-explainer{gap:16px}.pricing-page .price-explainer h2{margin-top:0}}
.billing-panel{max-width:900px;margin:32px auto;padding:24px;border:1px solid currentColor;border-radius:16px}
.billing-panel[hidden],[data-plan][hidden]{display:none!important}
.billing-panel h2{margin-top:0}
.billing-panel label{display:block;margin:20px 0 8px}
.billing-inline{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.billing-inline input{min-width:min(100%,280px);padding:12px;border:1px solid currentColor;border-radius:8px;background:transparent;color:inherit;font:inherit}
.billing-panel .action,.price-plan [data-plan]{cursor:pointer}
.price-plan [data-plan]{margin-top:16px}
.billing-panel [role=status]{min-height:1.5em}

/* Account access: a focused form alongside account context. */
.billing-panel{max-width:1120px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);padding:clamp(24px,4vw,48px);border-color:var(--divider);border-radius:24px;margin:64px auto;align-items:start}
.billing-panel [hidden]{display:none!important}.account-intro h2{font-size:clamp(2rem,4vw,3rem);line-height:1.08;letter-spacing:-.04em;margin:16px 0 20px;max-width:10ch}.account-intro>p:not(.account-eyebrow){line-height:1.65;max-width:34ch}.account-eyebrow{font-size:.75rem!important;letter-spacing:.08em;text-transform:uppercase}.account-test-note{display:inline-block;font-size:.75rem;margin-top:24px;opacity:.65}.account-content{min-width:0}.account-modes{display:flex;padding:4px;border:1px solid var(--divider);border-radius:999px;margin-bottom:24px;gap:4px}.account-modes button{padding:12px 8px;white-space:nowrap;flex:1;min-height:44px;border:0;border-radius:999px;background:transparent;color:inherit;font:inherit;font-size:.875rem;cursor:pointer}.account-modes button[aria-pressed=true]{background:var(--ink,#242220);color:var(--paper,#fdfdfb)}.account-content h3{font-size:1.5rem;letter-spacing:-.04em;line-height:1.2;margin:0 0 12px}.account-content p{font-size:.875rem;line-height:1.6}.account-content form{display:grid;gap:12px}.billing-panel label{margin:12px 0 0;font-size:.8125rem}.account-content input{width:100%;min-width:0;box-sizing:border-box;min-height:52px;padding:16px 16px;border:1px solid currentColor;border-radius:10px;background:transparent;color:inherit;font:inherit;font-size:1rem}.account-content .action{min-height:48px;justify-content:center;text-align:center;margin:0}.account-text-button{border:0;background:none;color:inherit;text-decoration:underline;text-underline-offset:4px;font:inherit;font-size:.8125rem;padding:16px 0;cursor:pointer;min-height:44px;display:block}.account-content button:disabled{opacity:.5;cursor:wait}.account-content :focus-visible{outline:2px solid currentColor;outline-offset:4px}#account-dashboard{display:grid;gap:16px}#account-identity{overflow-wrap:anywhere}#billing-balance{font-size:1.75rem;letter-spacing:-.04em;margin:0 0 8px}#billing-status{margin:16px 0 0;font-size:.8125rem}#billing-status:empty{display:none}#billing-status[data-error=true]{color:var(--warning)}#account-guest-balance{padding-top:16px;border-top:1px solid var(--divider);font-size:.8125rem}
@media(max-width:700px){.billing-panel{grid-template-columns:1fr;gap:32px;margin:40px auto}.account-intro h2{max-width:16ch}.account-test-note{margin-top:12px}.account-content{width:100%}}
.quality-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border:0;margin:0 0 16px;padding:0;min-width:0}.quality-choice legend{font-size:.75rem;color:var(--muted);margin-bottom:12px;padding:0}.outcome-controls>.quality-choice{flex-basis:100%;max-width:760px;margin:0}.quality-option{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:4px;align-items:start;padding:16px 16px;min-height:44px;border:1px solid var(--divider);border-radius:16px;background:var(--paper);cursor:pointer;transition:border-color 160ms,background 160ms}.quality-option input{grid-row:1/3;width:18px;height:18px;margin:1px 0 0;accent-color:var(--ink)}.quality-option:has(input:checked){border-color:var(--ink);background:var(--surface)}.quality-option:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:3px}.quality-option:has(input:disabled){opacity:.5;cursor:not-allowed}.quality-title{font-size:.875rem;color:var(--ink);display:flex;justify-content:space-between;gap:8px}.quality-cost{font-size:.75rem;color:var(--muted);white-space:nowrap}.quality-detail{font-size:.75rem;line-height:1.5;color:var(--muted)}.outcome-controls>.background-check{align-self:flex-end}.outcome-controls>#background-help,.outcome-controls>#quality-help{flex-basis:100%}
/* UI audit: accessible account entry and shared controls. */
.site-header{gap:32px}.site-header nav a{font-size:.875rem}.header-actions{display:flex;align-items:center;gap:16px;position:relative;z-index:1;pointer-events:auto}.account-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:.875rem;white-space:nowrap}.header-balance{color:var(--muted);font-size:.75rem}
.account-shortcut{display:inline-flex;align-items:center;min-height:44px;margin-top:16px;text-decoration:underline;text-underline-offset:4px;font-size:.875rem}.pricing-page main>.pricing-status{max-width:1120px;margin:0 auto 24px;padding:16px 20px;border:1px solid var(--divider);border-radius:16px;background:var(--surface);font-size:.875rem}.pricing-status p{font-size:.875rem}.price-plan [data-plan]{width:100%;margin-top:20px}.billing-panel{scroll-margin-top:calc(var(--header-height) + 24px)}#conversion-plans{scroll-margin-top:calc(var(--header-height) + 24px)}
.upload-privacy,.upload-panel .document-help,.sample-link,.comparison-instructions{font-size:.875rem;line-height:1.6}.sample-link{margin:12px 0 20px}.sample-link a{text-decoration:underline;text-underline-offset:3px;display:inline-block;padding-block:4px}.tool-copy .format-note,.drop small,.cad-page .drop span,.panel-heading>span{font-size:.875rem}.comparison-instructions{margin:0 0 16px;color:var(--muted)}.site-footer{padding-bottom:calc(32px + env(safe-area-inset-bottom,0px))}
@media(max-width:900px){.site-header{gap:20px}.site-header nav{gap:16px}.header-actions{gap:12px}.header-balance{display:none}}
@media(max-width:760px){:root{--header-height:calc(120px + env(safe-area-inset-top,0px));--header-clearance:calc(120px + env(safe-area-inset-top,0px))}.site-header{height:var(--header-height);display:grid;grid-template-columns:1fr auto;grid-template-rows:44px 44px;gap:0;padding:calc(8px + env(safe-area-inset-top,0px)) 20px 8px}.site-header>.brand{grid-row:1;grid-column:1}.header-actions{grid-row:1;grid-column:2;justify-content:end}.site-header>nav{grid-row:2;grid-column:1 / -1;justify-content:space-between;gap:8px;width:100%}.site-header nav a{font-size:.8125rem;min-height:44px}.account-link{font-size:.875rem}.account-intro h2{font-size:2rem;margin:8px 0 12px;max-width:none}.account-intro>p:not(.account-eyebrow){font-size:.875rem}.billing-panel{gap:24px;padding:24px}.account-test-note{margin-top:8px;font-size:.8125rem}.account-content p,.billing-panel label{font-size:.875rem}}
/* Repeat concise mode choices in the result; explanations stay beside the upload. */
.outcome-controls>.quality-choice{grid-template-columns:repeat(2,minmax(0,1fr));max-width:520px}.outcome-controls .quality-option{padding:12px 12px;align-items:center}.outcome-controls .quality-option input{grid-row:auto}.outcome-controls .quality-detail{display:none}.outcome-controls .quality-title{flex-wrap:wrap;column-gap:8px;row-gap:0}

/* Account uses the same quiet outline treatment as other shell controls. */
.account-link{min-width:44px;justify-content:center;border-radius:999px}.account-icon{width:22px;height:22px;flex-shrink:0}.account-link:hover{color:var(--accent)}

/* Design system pass. Type follows an Apple-like ramp (12 caption, 13 footnote, 14-15 subhead,
   16-17 body, 20-24 titles, 28+ display); nothing readable is set below 12px. */
:root{--spring:linear(0,.06 2%,.23 5%,.48 9%,.74 14%,.9 19%,.98 24%,1.02 30%,1.025 36%,1.01 46%,1);--spring-duration:520ms}
.theme-toggle{background:color-mix(in srgb,var(--paper) 72%,transparent)}
/* A control that waits for a file reads as inactive, not broken. */
button:disabled:not(.secondary):not(.theme-toggle){opacity:1;background:color-mix(in srgb,var(--ink) 7%,transparent);border-color:transparent;color:var(--muted)}
/* Disclosure rows: a trailing chevron that turns when the section opens. */
details>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px}
details>summary::-webkit-details-marker{display:none}
details>summary::after{content:"";flex-shrink:0;width:7px;height:7px;margin:0 8px 4px 0;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);transition:transform var(--spring-duration) var(--spring)}
details[open]>summary::after{transform:translateY(3px) rotate(225deg)}
details[open]::details-content{animation:detail-in var(--spring-duration) var(--spring)}
/* Spring motion for presses, selection and arrival. */
button,.action,.download{transition:background 180ms,border-color 180ms,color 180ms,transform var(--spring-duration) var(--spring)}
.quality-option{transition:border-color 160ms,background 160ms,transform var(--spring-duration) var(--spring)}
.quality-option:active{transform:scale(.985)}
::view-transition-new(root){animation:page-in var(--spring-duration) var(--spring) both}
.upload-panel,.document-card{animation:panel-in 640ms var(--spring) both}
@keyframes panel-in{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
/* Pricing: whole-pound prices keep pence for one format; the lowest unit price is marked. */
.pricing-page .price-plan:nth-child(2){background:none}
.pricing-page .price-plan.is-best-value{background:color-mix(in srgb,var(--accent) 4%,var(--paper))}
.plan-tag{display:inline-flex;align-items:center;margin-left:8px;padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--ink);font-size:.75rem;line-height:1.5}
@media(prefers-reduced-motion:reduce){.upload-panel,.document-card{animation:none}.quality-option:active{transform:none}}
/* The floating theme switch needs clear space below the last footer line. */
.site-footer{padding-bottom:calc(var(--theme-inset) + 64px + env(safe-area-inset-bottom,0px))}
/* One control shape: buttons, action links and pop-up pickers are capsules of one height;
   text fields stay rounded rectangles. Capsule ends are fully round, as on iOS. */
select:not([multiple]){border-radius:999px;min-height:48px;padding-inline:16px 40px}
html body :is(.action,.download){font-size:.875rem}
html body :is(input[type=text],input[type=number],input[type=email]){min-height:48px;font-size:.875rem}
/* Keyboard focus keeps its ring; pointer clicks do not leave one behind. */
:root[data-input=pointer] :is(:focus-visible,.drop:focus-within,.mode-option:has(input:focus-visible),.demo-canvas:has(.transform-scrubber:focus-visible),.reveal-comparison:focus-within){outline:none}
/* Every pop-up picker matches the home page picker: same padding, type and chevron. */
:root{--select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1.5 5 5 5-5' fill='none' stroke='%23221c1b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
:root[data-theme=dark]{--select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1.5 5 5 5-5' fill='none' stroke='%23f1ede7' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
select:not([multiple]){appearance:none;-webkit-appearance:none;border:1px solid var(--divider);border-radius:999px;background-color:var(--paper);background-image:var(--select-chevron);background-repeat:no-repeat;background-size:12px 8px;background-position:right 20px center;padding:12px 48px 12px 24px;color:var(--ink);font-size:.875rem;line-height:1.4;cursor:pointer;text-overflow:ellipsis}
.hero-conversion-picker select{background-image:none}
@media(forced-colors:active){select:not([multiple]){appearance:auto;-webkit-appearance:auto;background-image:none}}
/* Icon-only toolbar buttons are at least as wide as they are tall, so they read as circles. */
:is(.zoom-tools,.cad-page .toolbar) button{min-width:44px}
:is(.zoom-tools,.cad-page .toolbar) select{min-height:44px}

.smoothing-control{grid-column:1/-1;max-width:44rem;width:100%}.smoothing-control>span:first-child,.smoothing-scale{display:flex;justify-content:space-between;gap:1rem}.smoothing-control input[type=range]{width:100%;min-height:44px}.smoothing-control small{white-space:normal;line-height:1.55}.smoothing-control output{font-variant-numeric:tabular-nums}
.outcome-controls>.smoothing-control{flex-basis:100%;min-width:0}
.outcome-controls>.smoothing-control{flex:0 0 100%;max-width:none}.smoothing-control>:is(span,input,small){max-width:44rem}.smoothing-control>small{display:block}
@media(max-width:760px){.outcome-controls>.control[for=artwork-mode]{flex:0 0 100%;width:100%;max-width:none}}
/* The tag sits inside the label line so all three plans stay aligned. */
.plan-tag{padding:0 8px;line-height:inherit;vertical-align:baseline}
/* Corner editor: markers share the vector preview's box, so they follow zoom and pan. */
.corner-markers{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.corner-markers path{vector-effect:non-scaling-stroke}
.corner-marker-sharp{fill:var(--ink);stroke:var(--paper);stroke-width:1.5px;paint-order:stroke}
.corner-marker-round{fill:var(--paper);stroke:var(--ink);stroke-width:1.5px}
.corner-marker-changed{fill:none;stroke:var(--accent);stroke-width:2px}
.corner-marker-selected{fill:none;stroke:var(--accent);stroke-width:2.5px}
.artwork-page #corner-editor .corners{display:grid;gap:20px;margin:16px 0 8px}
.corner-counts{margin:0;font-size:.8125rem;font-variant-numeric:tabular-nums}
.corner-mode{width:max-content;max-width:100%}
.corner-sliders{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 32px}
.corner-sliders output{font-variant-numeric:tabular-nums}
.corner-sliders .smoothing-scale{display:flex;justify-content:space-between}
.corner-selected{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding-top:16px;border-top:1px solid var(--divider)}
#corner-selected-name{flex:1 1 14ch;font-size:.75rem;font-variant-numeric:tabular-nums}
.corner-selected button,.corner-actions button{min-height:44px;font-size:.75rem;padding:8px 16px}
.corner-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px}
#corner-note{margin:0;font-size:.75rem}
@media(max-width:760px){
  .corner-sliders{grid-template-columns:minmax(0,1fr)}
  .corner-mode{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;border-radius:24px}
  #corner-selected-name{flex-basis:100%;order:-1}
  .corner-selected button{flex:1 1 auto}
}
/* Colour count: Automatic, or 1-256 from a menu like Keep. */
.outcome-controls>.colour-control{flex:1;min-width:200px;max-width:400px}
.colour-control select{width:100%}
@media(max-width:760px){.outcome-controls>.colour-control{flex-basis:100%;max-width:none}}
/* Side panel: comparison on the left, tools on the right; one tool at a time, switched by the rail.
   One box: panel and rail share a border and background. Groups are flat: a small label, then a
   borderless tray of rows. Controls share one height (40px) and the toolbar's type size. */
.artwork-page .studio{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
.vector-inspector{display:grid;grid-template-columns:minmax(0,1fr);background:var(--surface);border:1px solid var(--divider);border-radius:24px;overflow:hidden}
.tool-rail{display:flex;gap:2px;padding:6px;order:-1;border-bottom:1px solid var(--divider);overflow-x:auto}
.tool-rail [role=tab]{flex:1 0 auto;flex-direction:column;gap:4px;min-height:56px;min-width:64px;padding:8px;border:0;border-radius:14px;background:transparent;color:var(--muted);font-size:.6875rem;line-height:1.2}
.tool-rail [role=tab] svg{width:20px;height:20px}
.tool-rail [role=tab]:hover{color:var(--ink);border-color:transparent}
.tool-rail [role=tab][aria-selected=true]{background:var(--paper);color:var(--ink)}
.tool-panels{min-width:0;padding:16px 18px 20px}
.tool-panel>.panel-title{font-size:.75rem;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 16px;line-height:16px}
.tool-panel>.muted,.tool-panel details>p.muted{font-size:.75rem;line-height:1.55;margin:0 0 16px}
/* Groups */
.tool-panel .outcome-controls{display:flex;flex-direction:column;align-items:stretch;gap:20px;margin:0}
.tool-panel .outcome-controls>*{flex:none;max-width:none;min-width:0;width:100%;margin:0}
.tool-panel .control,.tool-panel .quality-choice{display:flex;flex-direction:column;gap:8px;padding:0;border:0;background:none;font-size:.75rem}
.tool-panel .control>span:first-child,.tool-panel .quality-choice legend{color:var(--muted);font-size:.75rem;padding:0;margin:0}
.tool-panel select,.tool-panel input[type=number]{min-height:40px;padding:8px 36px 8px 14px;border-radius:12px;font-size:.8125rem;background-color:var(--paper)}
.tool-panel .panel-note{font-size:.75rem;color:var(--muted);line-height:1.55;margin:-12px 0 0}
/* Switch rows and actions */
.tool-panel .check{min-height:40px;font-size:.8125rem}
.tool-panel .check:has(input[role=switch]){flex-direction:row-reverse;justify-content:space-between;color:var(--ink);padding:0}
.tool-panel input[type=checkbox][role=switch]{appearance:none;-webkit-appearance:none;width:40px;height:24px;margin:0;border-radius:999px;background:var(--divider);position:relative;cursor:pointer;flex-shrink:0;transition:background 160ms}
.tool-panel input[type=checkbox][role=switch]:before{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--white);box-shadow:0 1px 2px #0003;transition:transform 160ms var(--ease)}
.tool-panel input[type=checkbox][role=switch]:checked{background:var(--accent)}
.tool-panel input[type=checkbox][role=switch]:checked:before{transform:translateX(16px)}
.tool-panel #background-help{margin:-16px 0 0;font-size:.75rem;line-height:1.55}
.tool-panel button{min-height:40px;padding:8px 16px;font-size:.8125rem;border-radius:12px}
.tool-panel .outcome-controls #keep-subject{width:auto;align-self:flex-start;margin:-12px 0 0;min-height:32px;padding:4px 0;border:0;background:none;color:var(--accent);font-size:.75rem}
.tool-panel .outcome-controls #keep-subject:hover{text-decoration:underline}
.tool-panel>.row{margin-top:24px;padding-top:16px;border-top:1px solid var(--divider)}
.tool-panel>.row button{width:100%}
/* Editors inside the panel */
.tool-panel details{margin:0;padding:0;border:0}
.tool-panel details>summary{display:none}
.tool-panel details[open]::details-content{animation:none}
.tool-panel .palette{margin:0}
.tool-panel .palette-heading{margin-bottom:12px}
.tool-panel .palette-heading h3{display:none}
.tool-panel .palette-heading .text-link{margin-left:auto}
.tool-panel .palette-families{grid-template-columns:minmax(0,1fr);gap:12px}
.tool-panel .palette .palette-editor{margin-top:16px}
.tool-panel .palette button.palette-swatch{border-radius:10px}
.tool-panel #corner-editor .corners{gap:20px;margin:0}
.tool-panel .corner-counts{font-size:.8125rem}
.tool-panel .corner-mode{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;width:100%;padding:2px;border-radius:12px}
.tool-panel .corner-mode button{min-height:36px;border-radius:10px;font-size:.75rem}
.tool-panel .corner-sliders{grid-template-columns:minmax(0,1fr);gap:20px}
.tool-panel .corner-selected{gap:8px;padding-top:16px}
.tool-panel #corner-selected-name{flex-basis:100%;order:-1;font-size:.75rem}
.tool-panel .corner-selected button{flex:1 1 auto;font-size:.75rem}
.tool-panel .corner-actions{gap:8px}
.tool-panel .corner-actions .check{flex:1}
.tool-panel .technical-summary{font-size:.75rem}
.tool-panel #config{max-height:320px;overflow:auto;font-size:.6875rem;background:var(--paper);border-radius:12px;padding:12px}
@media(prefers-reduced-motion:reduce){.tool-panel input[type=checkbox][role=switch],.tool-panel input[type=checkbox][role=switch]:before{transition:none}}
/* Wide screens: panel beside the comparison, rail on its outer edge, tops aligned, kept in view. */
@media(min-width:1100px){
  .artwork-page .studio{grid-template-columns:minmax(0,1fr) 400px}
  .artwork-page #comparison-stage{position:static;padding-top:0}
  .artwork-page #result[data-adjusting=true] .canvas{height:clamp(300px,47vh,600px)}
  /* Shorter than the comparison, so it stays pinned below the header while the comparison scrolls. */
  .vector-inspector{grid-template-columns:minmax(0,1fr) 68px;position:sticky;top:calc(var(--header-height) + 8px);align-self:start;max-height:calc(100vh - var(--header-height) - 16px)}
  .tool-rail{order:0;flex-direction:column;border-bottom:0;border-left:1px solid var(--divider);overflow:visible}
  .tool-rail [role=tab]{flex:none;min-width:0}
  .tool-panels{max-height:calc(100vh - var(--header-height) - 32px);overflow-y:auto;overscroll-behavior:contain}
}
/* Narrow screens: the comparison stays pinned while the panel below scrolls, as before the side panel. */
@media(max-width:1099px){.artwork-page .studio-canvas{display:contents}}
#result[data-state=dirty] #vector-placeholder .spinner{display:none}

/* Mode picker: one tile per tracing mode, on the upload card and in the Trace panel */
.mode-choice{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;border:0;margin:0;padding:0;min-width:0}
.mode-choice legend{font-size:.75rem;color:var(--muted);margin-bottom:12px;padding:0}
.mode-option{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:72px;padding:10px 6px;border:1px solid var(--divider);border-radius:14px;background:var(--paper);cursor:pointer;text-align:center;transition:border-color 160ms,background 160ms,transform var(--spring-duration) var(--spring)}
.mode-option input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.mode-icon{width:24px;height:24px;color:var(--ink)}
.mode-name{font-size:.75rem;line-height:1.2;color:var(--ink)}
.mode-option:hover{background:var(--surface)}
.mode-option:has(input:checked){background:var(--ink);border-color:var(--ink)}
.mode-option:has(input:checked) :is(.mode-icon,.mode-name){color:var(--paper)}
.mode-option:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.mode-option:has(input:disabled){opacity:.5;cursor:not-allowed}
.mode-option:active{transform:scale(.97)}
.mode-note{font-size:.75rem;line-height:1.5;color:var(--muted);margin:10px 0 16px}
.tool-panel .mode-choice{gap:6px;margin-top:4px}
.tool-panel .mode-choice legend{color:var(--muted);font-size:.75rem}
.tool-panel .mode-option{min-height:64px;padding:8px 4px;border-radius:12px}
@media(max-width:560px){.mode-choice{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.mode-option{transition:none}.mode-option:active{transform:none}}
@media(forced-colors:active){.mode-option:has(input:checked){outline:2px solid Highlight;outline-offset:-2px}}

/* Keep the tool index aligned with the navigation and contained within the page. */
.site-header nav .tools-menu{position:static;display:block;flex:0 0 auto;height:44px;min-height:44px}
.site-header>nav:has(.tools-menu){position:static;view-transition-name:none}
.site-header nav .tools-trigger{display:inline-flex;align-items:center;height:44px;min-height:44px;padding:0 6px;border:0;border-radius:0;background:none;font-size:.875rem;line-height:1.4;color:var(--muted);cursor:pointer;white-space:nowrap;transform:none}
.site-header nav .tools-menu.open>.tools-trigger{color:var(--ink)}
.site-header nav .tools-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
.conversion-pair{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);align-items:end;gap:12px;margin-bottom:20px}
.conversion-pair label{display:grid;gap:10px;min-width:0;font-size:.8125rem}
.conversion-pair select{width:100%;font-size:.9375rem}
.conversion-pair-arrow{align-self:end;display:grid;place-items:center;height:46px;color:var(--muted)}
@media(max-width:560px){.conversion-pair{grid-template-columns:1fr;gap:8px}.conversion-pair-arrow{height:16px;justify-content:start;padding-left:12px;transform:rotate(90deg)}}
.pdf-editor{border-top:1px solid var(--divider);padding-top:20px;margin:22px 0}
.pdf-editor-heading{display:flex;align-items:start;justify-content:space-between;gap:16px;margin-bottom:16px}
.pdf-editor-heading h3{font-size:1rem;font-weight:500}
.pdf-editor-heading p,.pdf-editor-count{font-size:.75rem;margin-top:4px}
.pdf-add-files{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 14px;border:1px solid var(--divider);border-radius:999px;background:var(--paper);font-size:.75rem;white-space:nowrap;cursor:pointer}
.pdf-add-files:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.pdf-add-files input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.tool-intro.pdf-workspace-active{grid-template-columns:minmax(0,1fr);gap:28px}
.pdf-workspace-active .tool-copy{padding-top:0}
.pdf-workspace-active .tool-copy h1{margin:10px 0 12px}
.pdf-workspace-active .document-card{width:100%}
.pdf-workspace{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr);min-height:600px;border:1px solid var(--divider);border-radius:16px;overflow:hidden;background:var(--paper)}
.pdf-sidebar{display:flex;flex-direction:column;min-width:0;max-height:760px;background:var(--surface);border-right:1px solid var(--divider)}
.pdf-sidebar-heading{display:flex;justify-content:space-between;padding:16px 16px 12px;font-size:.75rem;color:var(--muted)}
.pdf-page-list{display:flex;flex-direction:column;gap:4px;list-style:none;margin:0;padding:0 8px 12px;overflow:auto;min-height:0;flex:1}
.pdf-page-item{position:relative;min-width:0;padding:6px;border:1px solid transparent;border-radius:10px;background:transparent}
.pdf-page-item.is-selected{background:var(--paper);border-color:var(--divider)}
.pdf-page-item[draggable=true]{cursor:grab}
.pdf-page-item.is-dragging{opacity:.45}
.pdf-page-thumb{display:grid;place-items:center;height:112px;padding:6px;border-radius:6px;background:var(--paper);overflow:hidden}
.pdf-page-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.pdf-page-select{display:flex;align-items:center;gap:10px;width:100%;min-height:42px;border:0;background:none;color:var(--ink);text-align:left;cursor:pointer}
.pdf-page-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.pdf-page-position{font-size:.75rem;color:var(--muted);min-width:16px}
.pdf-page-details{min-width:0}
.pdf-page-name{display:block;font-size:.75rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdf-page-number{display:block;color:var(--muted);font-size:.6875rem}
.pdf-sidebar .pdf-add-files{margin:10px 12px 4px;flex-shrink:0}
.pdf-drop-hint{padding:0 14px 12px;font-size:.6875rem;color:var(--muted);line-height:1.4}
.pdf-sidebar.is-file-dragging{outline:2px dashed var(--accent);outline-offset:-6px}
.pdf-main-view{min-width:0;display:flex;flex-direction:column}
.pdf-page-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:66px;padding:12px 18px;border-bottom:1px solid var(--divider);background:var(--surface)}
.pdf-page-toolbar strong{display:block;font-size:.875rem;font-weight:500}
.pdf-page-toolbar span{display:block;font-size:.6875rem;color:var(--muted);overflow-wrap:anywhere}
.pdf-page-actions{display:flex;gap:6px;flex-wrap:wrap}
.pdf-page-actions button{min-height:38px;padding:6px 12px;border:1px solid var(--divider);border-radius:9px;background:var(--paper);color:var(--ink);font-size:.75rem;cursor:pointer}
.pdf-page-actions button:disabled{opacity:.4;cursor:default}
.pdf-page-stage{display:grid;place-items:center;min-height:500px;padding:28px;overflow:auto}
.pdf-page-stage img{display:block;max-width:100%;max-height:670px;object-fit:contain;box-shadow:0 8px 30px #0002;background:white}
.pdf-selected-position{padding:10px;text-align:center;color:var(--muted);font-size:.75rem}
.pdf-compression-option{display:flex;align-items:center;gap:10px;margin-top:18px;font-size:.8125rem}
.pdf-editor-count{margin-top:12px}
@media(max-width:700px){.pdf-editor-heading{display:block}.pdf-workspace{display:block;min-height:0}.pdf-sidebar{max-height:none;border-right:0;border-bottom:1px solid var(--divider)}.pdf-sidebar-heading{padding:10px 12px}.pdf-page-list{flex-direction:row;overflow-x:auto;overflow-y:hidden;min-height:0;padding:0 8px 8px}.pdf-page-item{flex:0 0 112px}.pdf-page-thumb{height:104px}.pdf-page-stage{min-height:420px;padding:18px}.pdf-page-stage img{max-height:540px}.pdf-page-toolbar{display:block;padding:10px 14px}.pdf-page-actions{margin-top:9px;flex-wrap:nowrap}.pdf-page-actions button{padding:5px 10px}.pdf-drop-hint{display:none}.pdf-sidebar .pdf-add-files{margin:6px 10px 10px;width:max-content}.pdf-page-select{gap:5px}.pdf-page-name{font-size:.6875rem}}
.tools-panel{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);z-index:25;width:min(980px,calc(100vw - 2 * var(--gutter)));max-height:calc(100dvh - var(--header-height) - 16px);overflow:auto;background:var(--surface);border:1px solid var(--divider);border-radius:20px;box-shadow:0 18px 44px #161a2426;padding:24px;pointer-events:auto}
.tools-panel-inner{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.tools-group h2{font-size:.75rem;font-weight:500;color:var(--muted);margin:0 0 10px;letter-spacing:.02em}
.tools-group a{display:flex;align-items:center;min-height:38px;margin:0 -8px;padding:7px 8px;border-radius:8px;font-size:.875rem;line-height:1.35;color:var(--ink);white-space:normal}
.tools-group a::after{display:none}
.tools-group a:hover,.tools-group a:focus-visible{background:var(--paper);color:var(--accent)}
@media(max-width:900px){.tools-panel-inner{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.site-header nav .tools-trigger{font-size:.8125rem}.tools-panel{top:calc(100% + 4px);padding:18px}.tools-panel-inner{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media(max-width:350px){.tools-panel-inner{grid-template-columns:1fr}.tools-group{border-bottom:1px solid var(--divider);padding-bottom:12px}}