*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--paper:oklch(96% .012 82);--paper-2:oklch(92% .018 82);--ink:oklch(22% .022 160);--muted:oklch(46% .022 160);--line:oklch(82% .025 82);--forest:oklch(34% .07 158);--forest-dark:oklch(27% .055 158);--accent:oklch(68% .17 48);--danger:oklch(54% .18 28);--success:oklch(47% .11 154);--surface:oklch(99% .008 82);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--space-12:3rem;--space-16:4rem;--radius:.45rem;--ease:cubic-bezier(.25,1,.5,1)}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{min-width:20rem;background:var(--paper);color:var(--ink);font-family:"Source Han Sans SC","Noto Sans CJK SC","PingFang SC","Microsoft YaHei",sans-serif;font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img,canvas{max-width:100%}[hidden]{display:none!important}
.container{width:min(74rem,calc(100% - 2rem));margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:1rem;top:-5rem;z-index:1000;background:var(--ink);color:var(--paper);padding:.75rem 1rem}.skip-link:focus{top:1rem}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.header{position:sticky;top:0;z-index:100;background:color-mix(in oklch,var(--paper) 94%,transparent);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.nav{height:4.5rem;display:flex;align-items:center;justify-content:space-between}.logo{display:inline-flex;gap:.6rem;align-items:center;font-weight:760;letter-spacing:-.02em}.logo span{display:grid;place-items:center;width:2.25rem;height:2.25rem;background:var(--forest);color:var(--paper);font-weight:800;font-size:.8rem}.nav-links{display:flex;list-style:none;gap:2rem}.nav-links a{color:var(--muted);font-size:.9rem;font-weight:650}.nav-links a:hover{color:var(--forest)}.mobile-toggle{display:none;border:1px solid var(--line);background:transparent;padding:.55rem .8rem;border-radius:var(--radius);min-height:2.75rem}
.hero{border-bottom:1px solid var(--line);overflow:hidden}.hero-layout{min-height:34rem;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(15rem,.7fr);gap:clamp(2rem,7vw,7rem);align-items:center;padding-block:clamp(4rem,8vw,7rem)}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--forest);font-size:.72rem;font-weight:800}.hero h1{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:clamp(2.7rem,6.2vw,5.6rem);font-weight:700;line-height:1.05;letter-spacing:-.055em;margin:.9rem 0 1.5rem}.hero h1 em{color:var(--forest);font-style:normal}.hero-sub{max-width:38rem;color:var(--muted);font-size:clamp(1rem,1.5vw,1.2rem)}.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
.hero-index{align-self:stretch;border-left:1px solid var(--line);padding-left:clamp(1.5rem,4vw,4rem);display:flex;flex-direction:column;justify-content:center}.index-number{font-family:"Songti SC",serif;font-size:clamp(5rem,10vw,8rem);line-height:.8;color:var(--accent);font-weight:700}.index-label{margin-top:1rem;font-weight:750}.hero-index ul{list-style:none;border-top:1px solid var(--line);margin-top:2rem;padding-top:1rem;color:var(--muted);font-size:.9rem}.hero-index li{padding:.25rem 0}
.btn{min-height:2.9rem;border:1px solid transparent;border-radius:var(--radius);padding:.7rem 1.15rem;display:inline-flex;align-items:center;justify-content:center;font-weight:750;transition:transform 120ms var(--ease),background 120ms,color 120ms,border-color 120ms}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--forest);color:var(--paper)}.btn-primary:hover{background:var(--forest-dark)}.btn-secondary{background:var(--surface);border-color:var(--line)}.btn-secondary:hover,.btn-quiet:hover{border-color:var(--forest);color:var(--forest)}.btn-quiet{background:transparent;border-color:transparent;text-decoration:underline;text-underline-offset:.3em}.icon-button{width:2.8rem;height:2.8rem;border:1px solid var(--line);background:transparent;border-radius:50%;font-size:1.7rem;line-height:1}.icon-button:hover{background:var(--ink);color:var(--paper)}
.tools-section{padding-block:clamp(4rem,8vw,7rem)}.section-heading{display:flex;justify-content:space-between;gap:2rem;align-items:end;margin-bottom:2rem}.section-heading h2,.workspace h2,.privacy-strip h2{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:clamp(2rem,4vw,3.2rem);line-height:1.15;letter-spacing:-.035em;margin-top:.5rem}.tool-search{width:min(24rem,100%);display:flex;align-items:center;border-bottom:2px solid var(--ink);padding:.45rem 0}.tool-search input{width:100%;border:0;background:transparent;outline:0}.tool-search span{font-size:1.5rem}.category-filters{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:1rem;margin-bottom:1rem;scrollbar-width:thin}.filter-button{white-space:nowrap;border:1px solid var(--line);background:transparent;border-radius:2rem;padding:.5rem .95rem;font-size:.86rem;font-weight:700}.filter-button:hover,.filter-button.is-active{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.tools-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--ink)}.tool-card{appearance:none;text-align:left;background:transparent;border:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:3rem 1fr auto;gap:1rem;align-items:center;padding:1.4rem 1rem;min-height:7.2rem;transition:background 180ms var(--ease),padding 180ms var(--ease)}.tool-card:nth-child(odd){border-right:1px solid var(--line)}.tool-card:hover{background:var(--surface);padding-left:1.5rem}.tool-no{font-variant-numeric:tabular-nums;color:var(--accent);font-size:.8rem;font-weight:800}.tool-card strong{display:block;font-size:1.12rem;margin-bottom:.15rem}.tool-card small{color:var(--muted);font-size:.86rem}.arrow{font-size:1.35rem;color:var(--forest)}.empty-search{text-align:center;padding:4rem 1rem;color:var(--muted)}
.workspace{background:var(--ink);color:var(--paper);padding-block:clamp(3rem,7vw,6rem)}.workspace .eyebrow{color:var(--accent)}.workspace-head{display:flex;justify-content:space-between;align-items:start;gap:2rem;border-bottom:1px solid oklch(42% .02 160);padding-bottom:2rem;margin-bottom:2rem}.workspace-head p:last-child{color:oklch(76% .018 160);margin-top:.65rem}.workspace .icon-button{color:var(--paper);border-color:oklch(42% .02 160)}.tool-panel{animation:panel-in 380ms var(--ease)}@keyframes panel-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.field{display:grid;gap:.4rem;margin-bottom:1.2rem}.field label{font-size:.85rem;font-weight:750}.field small{color:oklch(72% .018 160);font-size:.78rem}.field input,.field textarea,.field select{width:100%;border:1px solid oklch(46% .02 160);background:oklch(27% .018 160);color:var(--paper);border-radius:var(--radius);padding:.8rem .9rem}.field textarea{resize:vertical;min-height:7rem}.field input::placeholder,.field textarea::placeholder{color:oklch(68% .018 160)}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--accent);outline:2px solid color-mix(in oklch,var(--accent) 40%,transparent);outline-offset:0}.field input[type=range]{padding:.65rem 0;border:0;background:transparent}.field-wide{grid-column:1/-1}
.drop-zone{position:relative;display:grid;place-items:center;text-align:center;gap:.35rem;border:1px dashed oklch(58% .025 160);background:oklch(25% .018 160);padding:3rem 1rem;margin-bottom:1.5rem;transition:border-color 160ms,background 160ms}.drop-zone:hover,.drop-zone.is-dragging{border-color:var(--accent);background:oklch(29% .025 160)}.drop-zone input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.drop-zone strong{font-size:1.1rem}.drop-zone span{font-size:.84rem;color:oklch(72% .018 160)}.drop-zone.compact{padding:2rem 1rem}.file-list{list-style:none;margin:0 0 1.5rem}.file-list li{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid oklch(39% .02 160);padding:.75rem 0;font-size:.9rem}.file-list li span:last-child{color:oklch(72% .018 160);font-variant-numeric:tabular-nums}
.form-grid,.compare-grid,.inline-fields,.studio-grid{display:grid;gap:1rem}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.compare-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:.5rem}.inline-fields{grid-template-columns:auto auto;align-items:start}.inline-fields .grow{width:min(46rem,70vw)}.inline-fields .short{width:7rem}.align-end{align-self:end;margin-bottom:1.2rem}.studio-grid{grid-template-columns:minmax(0,1fr) minmax(17rem,.72fr);gap:2rem}.image-preview,.qr-preview{min-height:20rem;background:oklch(26% .018 160);display:grid;place-items:center;align-content:center;padding:1.5rem}.image-preview canvas{max-height:26rem;object-fit:contain}.image-preview p{color:oklch(72% .018 160);font-size:.8rem;margin-top:1rem}.check-row{display:flex;align-items:center;gap:.55rem;margin:-.25rem 0 1.25rem;font-size:.86rem}.check-row input{width:1.1rem;height:1.1rem;accent-color:var(--accent)}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid oklch(42% .02 160);margin-bottom:1.5rem}.metrics div{padding:1rem;border-right:1px solid oklch(42% .02 160)}.metrics div:last-child{border:0}.metrics strong{display:block;font-size:1.5rem;font-variant-numeric:tabular-nums}.metrics span{color:oklch(72% .018 160);font-size:.78rem}.button-row{display:flex;flex-wrap:wrap;gap:.65rem;margin:.75rem 0 1.25rem}.result-box,.diff-output{background:oklch(27% .018 160);border-left:3px solid var(--accent);padding:1rem;white-space:pre-wrap;overflow-wrap:anywhere;min-height:3.7rem;color:oklch(88% .012 160)}.diff-output{margin-top:1.25rem;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.85rem;line-height:1.75}.diff-add{color:oklch(78% .12 150)}.diff-remove{color:oklch(75% .14 28)}
.segmented{display:inline-flex;border:1px solid oklch(46% .02 160);padding:.25rem;border-radius:var(--radius);margin-bottom:1.5rem}.segmented button{border:0;background:transparent;color:oklch(76% .018 160);padding:.55rem .9rem;border-radius:.25rem}.segmented button.is-active{background:var(--paper);color:var(--ink)}.qr-preview{gap:1rem}.qr-preview #qr-output{background:var(--surface);padding:1rem;min-width:12rem;min-height:12rem;display:grid;place-items:center}.qr-preview img,.qr-preview canvas{display:block;max-width:100%;height:auto}.status-line{min-height:1.5rem;font-size:.86rem;color:oklch(76% .018 160)}.status-line.is-error{color:oklch(77% .14 28)}.divider{height:1px;background:oklch(42% .02 160);margin:2.5rem 0}.converter-block h3{margin-bottom:1rem}.unit-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.result-large{font-size:1.2rem;font-weight:750}
.privacy-strip{background:var(--accent);padding-block:clamp(4rem,8vw,7rem);color:var(--ink)}.privacy-layout{display:grid;grid-template-columns:.35fr 1.2fr 1fr;align-items:start;gap:clamp(1.5rem,5vw,5rem)}.privacy-strip .eyebrow{color:var(--ink)}.privacy-strip h2{margin:0}.privacy-strip p:last-child{max-width:32rem}
.footer{background:var(--forest-dark);color:oklch(90% .02 158);padding:3rem 0}.footer-grid{display:grid;grid-template-columns:1fr auto auto;gap:3rem;align-items:end}.footer-logo{color:var(--paper);margin-bottom:.65rem}.footer-logo span{background:var(--accent);color:var(--ink)}.footer p{color:oklch(75% .03 158);font-size:.86rem}.footer nav{display:flex;gap:1.5rem;font-size:.86rem}.footer nav a:hover{color:var(--accent)}
.toast{position:fixed;right:1rem;bottom:max(1rem,env(safe-area-inset-bottom));z-index:500;max-width:min(26rem,calc(100% - 2rem));background:var(--surface);color:var(--ink);border-left:4px solid var(--success);padding:.85rem 1rem;box-shadow:0 1rem 3rem oklch(15% .02 160/.24);transform:translateY(150%);opacity:0;transition:transform 260ms var(--ease),opacity 180ms}.toast.is-visible{transform:none;opacity:1}.toast.is-error{border-color:var(--danger)}
/* Existing legal pages */
.legal-page{width:min(50rem,calc(100% - 2rem));margin:0 auto;padding:4rem 0 6rem}.legal-page h1{font-family:"Songti SC",serif;font-size:clamp(2.4rem,6vw,4rem);line-height:1.1;margin-bottom:.75rem}.legal-page .update-date{color:var(--muted);font-size:.86rem;margin-bottom:3rem}.legal-page h2{font-size:1.25rem;margin:2.5rem 0 .75rem}.legal-page p,.legal-page li{color:var(--muted);margin-bottom:.75rem}.legal-page ul{padding-left:1.25rem}
@media (max-width:760px){.container{width:min(100% - 1.25rem,74rem)}.mobile-toggle{display:block}.nav-links{display:none;position:absolute;left:0;right:0;top:4.5rem;background:var(--paper);border-bottom:1px solid var(--line);padding:1rem;flex-direction:column;gap:0}.nav-links.is-open{display:flex}.nav-links a{display:block;padding:.75rem}.hero-layout{grid-template-columns:1fr;min-height:auto}.hero-index{border-left:0;border-top:1px solid var(--line);padding:2rem 0 0;display:grid;grid-template-columns:auto 1fr;gap:.5rem 1rem;align-items:end}.hero-index ul{grid-column:1/-1}.section-heading{align-items:stretch;flex-direction:column}.tool-search{width:100%}.tools-list{grid-template-columns:1fr}.tool-card:nth-child(odd){border-right:0}.studio-grid,.compare-grid,.privacy-layout{grid-template-columns:1fr}.inline-fields{grid-template-columns:1fr}.inline-fields .grow,.inline-fields .short{width:100%}.form-grid,.unit-grid{grid-template-columns:1fr 1fr}.metrics{grid-template-columns:1fr 1fr}.metrics div:nth-child(2){border-right:0}.metrics div:nth-child(-n+2){border-bottom:1px solid oklch(42% .02 160)}.footer-grid{grid-template-columns:1fr;align-items:start;gap:1.5rem}.footer nav{flex-wrap:wrap}.copyright{justify-self:start}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}