:root{--bg:#f1ece2;--surface:#faf7f1;--text:#2b2622;--muted:#7a7064;--border:#ddd3c2;--accent:#a8352b;--accent-soft:#f1dcd5;--warn:#b7791f;--original:#2e8b57;--simplified:#8a5cc2;--rubbing:#1e1c1a;--rubbing-ink:#ebe4d6;--rubbing-muted:#8c8378;--rubbing-hover:#ebe4d61a;--radius:6px;--serif:"Songti TC", "Noto Serif TC", "Source Han Serif TC", "PMingLiU", "STSong", serif;--sans:system-ui, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#171513;--surface:#211e1b;--text:#ebe4d8;--muted:#a0968a;--border:#38322c;--accent:#d8675b;--accent-soft:#45251f;--warn:#e0a84a;--original:#6fcf97;--simplified:#b89ae6;--rubbing:#0f0e0d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:var(--sans);margin:0;line-height:1.6}.page{max-width:1320px;margin:0 auto;padding:28px 16px 40px}.masthead{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px;display:flex}.brand{align-items:center;gap:14px;display:flex}.seal-mark{background:var(--accent);color:#fbf3ec;width:52px;height:52px;font-family:var(--preview-font,var(--serif));box-shadow:inset 0 0 0 3px var(--accent), inset 0 0 0 5px #fbf3ecd9;border-radius:4px;flex:none;place-items:center;font-size:34px;line-height:1;display:grid;transform:rotate(-3deg)}h1{font-family:var(--serif);letter-spacing:.08em;margin:0;font-size:1.9rem;font-weight:700}.lede{color:var(--muted);margin:2px 0 0}.workspace{gap:16px;display:grid}.column{align-content:start;gap:16px;min-width:0;display:grid}@media (width<=999px){.column{display:contents}.panel-input{order:1}.panel-preview{order:2}.panel-output{order:3}}@media (width>=1000px){.workspace{grid-template-columns:minmax(340px,5fr) 7fr;gap:24px}.column-edit{grid-template-rows:auto 1fr;align-content:stretch}.column-view{align-content:stretch}.panel-output,.panel-preview{flex-direction:column;display:flex}.panel-output textarea,.panel-preview .rubbing{flex:1}}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.panel-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;margin-bottom:10px;display:flex}.panel-title{font-family:var(--serif);letter-spacing:.04em;margin:0;font-size:1.05rem;font-weight:700;display:block}.panel>.panel-title{margin-bottom:10px}.hint,.stats{color:var(--muted);margin:8px 0 0;font-size:.85rem}.stats{margin:0 0 10px}textarea{width:100%;font:inherit;color:inherit;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);resize:vertical;padding:10px 12px;font-size:1.15rem;line-height:1.7}#output{font-size:1.3rem}textarea:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button,select{font:inherit;color:inherit}button{cursor:pointer}select{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:4px 8px}.button-primary{background:var(--accent);color:#fff;border-radius:var(--radius);border:none;padding:6px 18px}.script-hint{margin-top:4px}.script-mode{color:var(--muted);align-items:center;gap:10px;margin-top:12px;font-size:.9rem;display:flex}.options{gap:10px;margin-top:12px;display:grid}.toggle{cursor:pointer;align-items:center;gap:8px;font-weight:600;display:inline-flex}.toggle input{width:17px;height:17px;accent-color:var(--accent)}.option .hint{margin-top:2px}.view-controls{align-items:center;gap:10px;display:flex}.segmented{border:1px solid var(--border);border-radius:var(--radius);display:inline-flex;overflow:hidden}.segmented button{background:0 0;border:none;padding:3px 12px;font-size:.9rem}.segmented button+button{border-left:1px solid var(--border)}.segmented button[aria-pressed=true]{background:var(--accent-soft);color:var(--accent);font-weight:600}.rubbing{background-color:var(--rubbing);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");border-radius:4px;padding:20px 22px;position:relative;box-shadow:inset 0 0 40px #0000008c}.preview{min-height:3.2em;color:var(--rubbing-ink);font-family:var(--preview-font,var(--serif));white-space:pre-wrap;overflow-wrap:anywhere;text-shadow:0 0 1px #ebe4d659;font-size:clamp(2.1rem,3.4vw,3rem);line-height:1.55}.preview.vertical{writing-mode:vertical-rl;width:100%;height:min(62vh,560px);min-height:0;line-height:1.45;overflow:auto hidden}.preview .empty{font-family:var(--sans);color:var(--rubbing-muted);font-size:1rem}.preview .cell{white-space:nowrap}.font-status{color:var(--rubbing-muted);margin:0;font-size:.8rem;position:absolute;inset:auto 12px 8px auto}.preview .char{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;border-radius:2px;padding:0}.preview .char:hover,.preview .char.active{background:var(--rubbing-hover)}.preview .original{box-shadow:inset 0 -3px 0 var(--original)}.preview .simplified{box-shadow:inset 0 -3px 0 var(--simplified)}.preview .variant{border-top:3px solid var(--accent)}.preview .no-glyph{-webkit-text-decoration:underline wavy var(--warn) 2px;text-decoration:underline wavy var(--warn) 2px;text-underline-offset:6px}.preview .no-seal{font-family:var(--serif);color:var(--rubbing-muted)}.preview.vertical .original,.preview.vertical .simplified{box-shadow:none;border-right:3px solid var(--original)}.preview.vertical .simplified{border-right-color:var(--simplified)}.preview.vertical .variant{border-top:none;border-left:3px solid var(--accent)}.export{flex-wrap:wrap;align-items:center;gap:8px 16px;margin-bottom:12px;font-size:.9rem;display:flex}.panel-preview .detail-panel{margin:0 0 12px}.panel-preview .stats{margin:12px 0 4px}.panel-preview .legend{margin:0 0 4px}.panel-preview>.hint{margin:0}.export .button-primary{margin-left:auto}.swatch-picker{color:var(--muted);align-items:center;gap:6px;display:inline-flex}.swatch-picker input{border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:4px;width:32px;height:24px;padding:0}.swatch-picker input:disabled{opacity:.35;cursor:not-allowed}.legend{color:var(--muted);flex-wrap:wrap;gap:4px 16px;margin:12px 0 0;padding:0;font-size:.82rem;list-style:none;display:flex}.swatch{vertical-align:-2px;border-radius:2px;width:14px;height:14px;margin-right:6px;display:inline-block}.swatch.variant{border-top:3px solid var(--accent)}.swatch.original{border-bottom:3px solid var(--original)}.swatch.simplified{border-bottom:3px solid var(--simplified)}.swatch.no-glyph{border-bottom:3px dotted var(--warn)}.swatch.no-seal{background:var(--muted);opacity:.4}.detail-panel{border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--radius);background:var(--bg);margin-top:12px;padding:12px 14px}.detail-panel p{margin:0 0 6px}.detail-title{font-weight:600}.detail-note{font-family:var(--serif);font-size:.92rem}.detail-links{font-size:.9rem}.detail-links a{color:var(--accent)}.variant-options{flex-wrap:wrap;gap:8px;margin-bottom:6px;display:flex}.variant-option{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);align-items:center;gap:8px;padding:4px 12px;display:flex}.variant-option[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}.variant-option .native{font-size:1.5rem}.about{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-top:24px;padding:0 16px}.about summary{cursor:pointer;font-family:var(--serif);letter-spacing:.04em;padding:14px 0;font-weight:700}.about-body{gap:4px 32px;padding-bottom:16px;display:grid}@media (width>=760px){.about-body{grid-template-columns:repeat(2,minmax(0,1fr))}}.about-body h3{font-family:var(--serif);margin:8px 0 4px;font-size:1rem}.about-body p{color:var(--muted);margin:0 0 8px;font-size:.92rem}.footer{color:var(--muted);text-align:center;margin-top:20px;font-size:.82rem}.footer p{margin:4px 0}.footer a{color:var(--accent)}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (width<=560px){.masthead{flex-direction:column}h1{font-size:1.6rem}.seal-mark{width:44px;height:44px;font-size:28px}}
