@font-face{font-family:Silkscreen;src:url('./vendor/pixel.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--bg:#080808;--panel:#111;--line:#343434;--text:#f4f2ed;--muted:#99958e;--accent:#b8ac98}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,'Noto Sans TC','PingFang TC','Microsoft JhengHei',sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);border-radius:0;color:inherit;background:#171717;min-height:44px;padding:12px 16px}button:hover{background:#262626}button:disabled{opacity:.45;cursor:wait}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.mono{font-family:Silkscreen,monospace;letter-spacing:.07em}.skip{position:fixed;top:-100px;z-index:500;background:#eee;color:#111;padding:14px}.skip:focus{top:0}::selection{background:#e8e2d8;color:#080808}
.site-header{position:sticky;top:0;z-index:100;background:#090909;border-bottom:1px solid #303030}.header-inner{max-width:1190px;margin:auto;padding:17px 25px;display:flex;align-items:center;min-height:76px;gap:36px}.brand{font-family:Silkscreen,monospace;font-size:25px;letter-spacing:.06em;white-space:nowrap;background:none;border:0;padding:0;min-height:40px}.brand span{color:#a69b87}.brand .pixel-mark{font-family:monospace;font-size:25px;margin-right:10px}.brand sup{font-size:8px;vertical-align:top;position:relative;top:8px;margin-left:4px}.hamburger{display:none}.tool-menu-wrap{position:relative}.all-tools-button{background:none;font-size:13px;font-weight:700;border:1px solid #555;min-width:135px}.all-tools-button span{margin-left:25px;color:#a69b87}.tools-menu{position:absolute;left:0;top:100%;padding:15px 8px 8px;width:min(730px,calc(100vw - 340px));max-height:75dvh;overflow:auto;background:#111;border:1px solid #444;box-shadow:10px 10px 0 #000;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;z-index:110}.tools-menu a{padding:13px 10px;min-height:44px;display:flex;align-items:center;font-size:13px}.tools-menu a:hover,.tools-menu a[aria-current=page]{background:#282726}.tools-menu a:focus-visible{outline-offset:-2px}.private-tag{margin-left:auto;font-size:9px;color:#827c73;white-space:nowrap}
main{max-width:1190px;margin:auto;padding:0 25px 85px;min-height:65vh}.hero-eyebrow{display:flex;gap:11px;align-items:center;border-bottom:1px solid #333;padding:32px 0 20px;color:#a8a29a;font-size:10px}.alive-dot{height:8px;width:8px;background:#c0b6a6;display:inline-block}.hero-index{margin-left:auto;color:#777}.hero-content{padding:100px 0 112px}.hero-kicker{font-size:11px;color:#b7ad9b;letter-spacing:.16em}.hero-content h1{font-size:clamp(43px,7.1vw,91px);line-height:1.22;letter-spacing:-.07em;font-weight:800;margin:28px 0 27px}.hero-content h1 em{color:#a89e8f;font-style:normal}.hero-desc{color:#a8a49d;line-height:2.1;font-size:16px}.primary{background:#e9e4da;color:#0c0c0c;border-color:#e9e4da;font-weight:700}.primary:hover{background:white;color:#080808}.primary-launch{display:flex;align-items:center;gap:100px;margin-top:34px;padding:20px 26px;font-size:14px;min-height:65px}.primary-launch span{font-size:21px}.home-divider{border-block:1px solid #404040;display:flex;justify-content:space-between;padding:19px 0;font-size:10px;color:#aaa}.tool-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#333;border:1px solid #333;margin-top:25px}.tool-catalog a{position:relative;text-align:left;display:flex;align-items:flex-end;min-height:185px;padding:27px;background:#111}.tool-catalog a:hover{background:#1e1e1e}.tool-catalog strong{font-size:22px;letter-spacing:-.03em;padding-right:22px}.catalog-arrow{position:absolute;right:23px;bottom:27px;font-size:20px;color:#b3a99a}.faq-section{margin:95px 0 40px}.faq-section h2{font-size:25px;padding-bottom:25px}.faq-section h2 span{color:#847b6d;font-size:12px}.faq-section details{border-top:1px solid #333;padding:21px 0}.faq-section summary{cursor:pointer;font-weight:600;line-height:1.6}.faq-section p{color:#aaa;line-height:1.9;margin:15px 0 0;font-size:14px;max-width:880px}
#workspace{padding:45px 0;min-height:70vh}#toolTitle{font-size:clamp(27px,3.5vw,39px);letter-spacing:-.04em;margin:0 0 35px}.upload-hero{text-align:center;border:1px dashed #575047;background:#111;padding:70px 16px 65px;margin:20px 0 30px}.upload-pixel{display:block;color:#c2b6a3;font:48px monospace;margin-bottom:30px}.huge-upload{display:flex;align-items:center;justify-content:space-between;gap:45px;margin:auto;padding:21px 30px;min-width:min(85%,320px);font-size:15px;font-weight:800}.huge-upload span{font-size:21px}.upload-hero.has-files{padding:16px}.upload-hero.has-files .upload-pixel{display:none}.upload-hero.has-files .huge-upload{min-width:0;margin:auto;padding:12px 20px}.upload-hero.dragging{border:2px solid var(--accent);background:#24201c}.file-list{list-style:none;padding:0;margin:0 0 25px}.file-list li{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px solid #343434;padding:14px;margin-bottom:8px;background:#121212}.filename{font-size:13px;overflow-wrap:anywhere;min-width:0}.filesize{display:block;color:#aaa39a;font-size:12px;margin-top:7px}.file-actions{display:flex;gap:5px;flex-shrink:0}.file-actions button{padding:8px 12px}.controls{border:1px solid var(--line);padding:25px;background:#111}.field{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;font-size:14px;min-width:0}.field:last-child{margin-bottom:0}.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.field label,.field>span{color:#c9c3b9}.field input:not([type=checkbox]):not([type=range]),.field select,.field textarea{width:100%;min-height:44px;background:#0b0b0b;color:#eee;border:1px solid #454545;padding:10px 12px;border-radius:0}.field textarea{min-height:160px;resize:vertical;line-height:1.6}.check{display:flex;align-items:center;gap:10px}.check input{width:18px;height:18px;accent-color:var(--accent)}.edit-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px}.preview-wrap{display:flex;align-items:flex-start;justify-content:center;background:#181818;padding:12px;border:1px solid #333;position:sticky;top:100px}.preview-wrap canvas{display:block;max-width:100%;height:auto;background:white;cursor:crosshair;touch-action:manipulation}.signature-pad{width:100%;height:140px;background:#fff;touch-action:none;display:block;border:1px solid #555}.secondary{background:transparent}.clear-sign{margin-top:10px}.run-button{display:block;width:100%;padding:20px;margin-top:25px;min-height:62px}.progress-wrap{margin-top:25px}.progress-wrap progress{display:block;width:100%;height:12px;accent-color:var(--accent)}.progress-wrap span{display:block;margin-top:10px;font-size:13px;color:#c6bcad}.notice{padding:16px 18px;border:1px solid #80674b;background:#1d1812;line-height:1.8;margin:20px 0;overflow-wrap:anywhere}.error{border-color:#a76d5c;background:#241713;color:#f0d2c9}.result{margin-top:30px;padding:26px;border:1px solid #766f65;background:#181818}.result h2{font-size:23px;margin:0 0 15px}.result p{font-size:14px;color:#bcb5aa;line-height:1.8;white-space:pre-line;overflow-wrap:anywhere}.result-actions{display:flex;gap:12px;flex-wrap:wrap}.result-actions a,.result-actions button{display:inline-flex;align-items:center;justify-content:center;padding:15px 22px;min-height:50px}.footer-inner{max-width:1190px;margin:auto;display:flex;align-items:center;gap:24px;justify-content:space-between;color:#817c76;padding:24px 25px;font-size:10px}footer{border-top:1px solid #303030}.footer-inner a{color:#ccc;font-size:12px}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:200;border:1px solid #6b6356;background:#1f1d1a;padding:16px 24px;max-width:calc(100vw - 32px);font-size:14px;box-shadow:5px 5px 0 #000}
@media(max-width:1000px){.tools-menu{grid-template-columns:repeat(2,minmax(0,1fr))}.private-tag{display:none}}
@media(max-width:768px){.header-inner{padding:13px 15px;min-height:66px;gap:13px}.hamburger{width:35px;height:40px;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:4px;background:none;border:0}.hamburger span{display:block;width:24px;height:2px;background:#eee}.brand{font-size:18px}.brand .pixel-mark{font-size:19px;margin-right:5px}.tool-menu-wrap{position:static}.all-tools-button{display:none}.tools-menu{position:absolute;top:100%;left:0;right:0;width:100%;max-width:100%;max-height:calc(100dvh - 66px);box-shadow:0 12px 30px #000;border-inline:0;grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}.tools-menu a{padding:17px 12px;border-bottom:1px solid #282828;font-size:13px}main{padding:0 17px 55px}.hero-eyebrow{padding:24px 0 17px;font-size:8px}.hero-content{padding:65px 0 78px}.hero-content h1{font-size:clamp(39px,9.5vw,65px);line-height:1.28}.hero-desc{font-size:13px}.primary-launch{width:100%;justify-content:space-between;gap:12px}.home-divider{font-size:8px;gap:10px}.tool-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-catalog a{min-height:165px;padding:18px}.tool-catalog strong{font-size:17px}.catalog-arrow{right:17px;bottom:19px}.faq-section{margin-top:65px}.footer-inner{flex-wrap:wrap;font-size:9px;padding:23px 17px;gap:15px}.footer-inner span:nth-child(2){display:none}#workspace{padding-top:30px}.upload-hero{padding:65px 12px}.huge-upload{min-width:84%}.edit-layout{grid-template-columns:1fr;gap:20px}.preview-wrap{position:static}.controls{padding:18px}.file-list li{flex-wrap:wrap}.file-actions{margin-left:auto}.field-row{gap:12px}.result{padding:20px}.result-actions>*{width:100%}.signature-pad{height:150px}}
@media(max-width:400px){.tool-catalog{grid-template-columns:1fr}.tool-catalog a{min-height:145px}.brand{font-size:16px}.field-row{grid-template-columns:1fr}.tools-menu a{font-size:12px;padding:15px 8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.edit-layout.single{grid-template-columns:1fr}
/* Grouped tool index and readable guides */
.tools-menu{width:min(940px,calc(100vw - 325px));grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 14px;padding:22px 18px}.menu-group{min-width:0}.menu-group h2{font-size:12px;letter-spacing:.03em;color:#bfb19a;margin:0 0 10px;padding:0 10px 10px;border-bottom:1px solid #3d3830;line-height:1.7}.menu-group>div{display:grid;grid-template-columns:1fr}.menu-group a{padding:10px;min-height:42px;line-height:1.6}.catalog-groups{display:block}.catalog-category{padding-top:55px;scroll-margin-top:100px}.category-heading{display:flex;gap:18px;align-items:center}.category-heading>span{font-size:12px;color:#8e8372}.category-heading h2{font-size:25px;margin:0;letter-spacing:-.02em}.category-description{color:#a39c92;font-size:14px;line-height:1.9;margin:16px 0 0;max-width:840px}.catalog-category .tool-catalog{margin-top:22px}.catalog-category .tool-catalog a{min-height:145px}.catalog-category .tool-catalog strong{font-size:21px}.category-index{display:flex;flex-wrap:wrap;gap:10px;padding:24px 0 0}.category-index a,.related-tools a{display:inline-flex;align-items:center;min-height:44px;border:1px solid #3c3832;padding:10px 15px;color:#d4cbbb;font-size:13px}.category-index a:hover,.related-tools a:hover{background:#25211c;border-color:#9e907b}.tool-guide,.about-tools{margin-top:65px;padding:45px 0 10px;border-top:1px solid #34302b;max-width:900px}.tool-guide h2,.about-tools h2{font-size:25px;letter-spacing:-.025em;line-height:1.6}.tool-guide h3{font-size:17px;margin:32px 0 14px}.tool-guide p,.tool-guide li,.about-tools p{font-size:14px;color:#b2aaa0;line-height:2}.tool-guide ol{padding-left:23px}.tool-guide li{padding-left:5px;margin-bottom:10px}.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:12px;line-height:1.8;color:#8d8272;margin-bottom:30px}.breadcrumbs a{color:#cbbda7}.related-tools{display:flex;flex-wrap:wrap;gap:10px}.footer-inner nav{display:flex;flex-wrap:wrap;gap:22px}#catalog{scroll-margin-top:100px}
@media(max-width:1100px) and (min-width:769px){.tools-menu{grid-template-columns:repeat(2,minmax(0,1fr));width:calc(100vw - 310px)}}
@media(max-width:768px){.tools-menu{width:100%;grid-template-columns:1fr;gap:26px;padding:22px 17px}.menu-group h2{padding-inline:10px;font-size:13px}.menu-group>div{grid-template-columns:repeat(2,minmax(0,1fr))}.menu-group a{font-size:13px;padding:13px 10px;min-height:48px}.category-index{gap:8px}.category-index a{font-size:12px;padding:9px 12px}.catalog-category{padding-top:40px}.category-heading{gap:14px}.category-heading h2{font-size:22px}.category-description{font-size:13px}.catalog-category .tool-catalog a{min-height:135px}.catalog-category .tool-catalog strong{font-size:17px}.tool-guide,.about-tools{margin-top:45px;padding-top:30px}.tool-guide h2,.about-tools h2{font-size:22px}.tool-guide p,.tool-guide li,.about-tools p{font-size:13px}.footer-inner nav{gap:17px}}
.catalog-category .tool-catalog{background:transparent;border:0;gap:10px}.catalog-category .tool-catalog a{border:1px solid #34302b}

.editor-status{font-size:13px;line-height:1.7;color:#b8b2a8;overflow-wrap:anywhere}.editor-actions{display:flex;flex-wrap:wrap;gap:10px}.editor-actions button{flex:1;min-width:125px}.preview-wrap canvas{background:#fff;cursor:crosshair}

/* V8 navigation with three quick tools and two complete tool menus. */
.header-inner{gap:22px}.top-navigation{display:flex;align-items:center;gap:8px}.top-tool,.all-tools-button{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;min-width:0;min-height:44px;padding:10px 12px;font-size:12px;border:1px solid #454545;background:#111;font-weight:600}.all-tools-button span{margin-left:12px}.top-tool:hover,.top-tool[aria-current=page],.all-tools-button[aria-expanded=true]{background:#282726;border-color:#867d70}.tools-menu{width:min(900px,calc(100vw - 315px));display:block;left:0;top:100%;padding:22px 18px}.menu-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 14px}.menu-panel-title,.mobile-quick-tools{display:none}.conversion-note{line-height:1.75;color:#bbb4a9;font-size:13px}
@media(max-width:1200px) and (min-width:769px){.private-tag{display:none}.header-inner{gap:15px;padding-inline:20px}.brand{font-size:21px}.top-navigation{gap:5px}.top-tool,.all-tools-button{padding:9px;font-size:11px}.all-tools-button span{margin-left:7px}.menu-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.tools-menu{width:calc(100vw - 270px)}}
@media(max-width:768px){.header-inner{gap:13px}.top-navigation{display:none}.tools-menu{left:0;right:0;width:100%;padding:20px 17px;max-height:calc(100dvh - 66px)}.menu-panel{grid-template-columns:1fr;gap:22px}.menu-panel+.menu-panel{margin-top:30px;padding-top:25px;border-top:1px solid #484037}.menu-panel-title{display:block;font-size:17px;margin:0;color:#eee}.mobile-quick-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:25px}.mobile-quick-tools a{min-height:46px;padding:9px 6px;display:flex;align-items:center;justify-content:center;border:1px solid #4d473f;background:#191715;font-size:12px}.menu-group>div{grid-template-columns:repeat(2,minmax(0,1fr))}}

.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}/* Header status and pixel language control. */
.header-actions{margin-left:auto;display:flex;align-items:center;gap:13px;flex-shrink:0}.header-actions .private-tag{display:inline-block;margin-left:0;font-size:8px;color:#a39c91}.language-wrap{position:relative}.language-button{display:flex;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:6px;border:0;background:transparent;color:#d0c7b8}.language-chevron{font-size:11px}.language-button:hover,.language-button[aria-expanded=true]{background:transparent;color:#fff}.pixel-globe{flex-shrink:0}.language-menu{position:absolute;top:100%;right:0;width:160px;padding:9px;background:#111;border:1px solid #49443d;box-shadow:6px 6px 0 #000;z-index:112}.language-menu button{display:block;width:100%;padding:12px;min-height:44px;background:transparent;border:0;text-align:left;font-size:13px}.language-menu button:hover,.language-menu button[aria-pressed=true]{background:#292622;color:#fff}.language-menu button[aria-pressed=true]{box-shadow:inset 3px 0 #c7bba5}
.contact-link{padding:0;min-height:32px;border:0;background:transparent;font-size:12px;color:#ccc}.report-problem{position:fixed;right:20px;bottom:20px;z-index:120;min-height:44px;display:flex;align-items:center;gap:9px;padding:11px 15px;background:#161513;border:1px solid #675f53;box-shadow:4px 4px 0 #000;font-size:12px}.report-problem:hover{background:#302c26}.contact-overlay{position:fixed;inset:0;z-index:300;background:#000c;padding:20px;display:flex;align-items:center;justify-content:center;overflow:auto}.contact-dialog{position:relative;width:min(480px,100%);max-height:calc(100dvh - 40px);overflow:auto;background:#111;border:1px solid #70685c;box-shadow:8px 8px 0 #000;padding:32px}.contact-close{position:absolute;right:12px;top:12px;width:44px;height:44px;border:0;background:transparent;font-size:24px}.contact-close:hover{background:transparent;color:#e4cfab}.contact-kicker{margin:0 44px 22px 0;font-size:9px;color:#a99d8a}.contact-dialog h2{margin:0 0 20px;font-size:25px}.contact-dialog p{line-height:1.8}.contact-dialog #contactIntro{font-size:14px;color:#c5beb3}.contact-email{display:block;width:fit-content;margin:23px 0 18px;color:#e6d9c4;font-size:clamp(15px,4.5vw,20px);overflow-wrap:anywhere;text-decoration:underline;text-underline-offset:5px}.copy-email{min-height:44px;border:1px solid #5d5549;padding:10px 14px;font-size:12px}.contact-status{font-size:12px;color:#dfd0b7;min-height:1.8em;margin:9px 0}.contact-hint{font-size:12px;color:#9b958d;margin-bottom:0}.toast{bottom:82px}.footer-inner{padding-bottom:88px}
@media(max-width:1000px) and (min-width:769px){.header-inner{gap:10px}.brand{font-size:18px}.top-tool,.all-tools-button{font-size:10px;padding:8px 6px}.all-tools-button span{margin-left:4px}.header-actions{gap:7px}.header-actions .private-tag{font-size:7px}.language-button{width:40px}.tools-menu{max-height:calc(100dvh - 76px)}}
@media(max-width:768px){.header-inner{gap:10px}.header-actions{gap:8px}.header-actions .private-tag{font-size:7px}.language-button{width:40px}.language-menu{width:155px}.report-problem{right:16px;bottom:16px}.contact-dialog{padding:28px 23px}.contact-overlay{padding:16px}.contact-dialog{max-height:calc(100dvh - 32px)}}
@media(max-width:380px){.header-inner{gap:7px;padding-inline:12px}.brand{font-size:15px}.brand .pixel-mark{margin-right:2px;font-size:17px}.brand sup{margin-left:1px}.hamburger{width:30px;flex-shrink:0}.header-actions{gap:5px}.language-button{width:36px;padding:4px;gap:2px}.header-actions .private-tag{font-size:7px}.contact-dialog{padding-inline:18px}}