:root{color:#17202b;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--green:#087a3f;--green-dark:#056432;--green-soft:#eaf8f0;--ink:#17202b;--muted:#68717d;--border:#dfe4e8;--surface-soft:#f6f8f9;--coral:#f06d5f;--warning:#b66a0b;--danger:#b9362b;background:#f4f6f7;font-family:Inter,Noto Sans JP,Yu Gothic UI,Hiragino Kaku Gothic ProN,system-ui,sans-serif}*{box-sizing:border-box}html{background:#f4f6f7;min-width:320px}body{min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button,label,summary,select,input[type=range]{-webkit-tap-highlight-color:transparent}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline:2px solid var(--green);outline-offset:2px}label:has(input:focus-visible){outline:2px solid var(--green);outline-offset:2px}button:disabled,input:disabled,select:disabled{cursor:not-allowed;opacity:.52}img{max-width:100%;display:block}.visually-hidden{clip:rect(0, 0, 0, 0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}#root{min-height:100vh}.app-shell{border:1px solid var(--border);background:#fff;border-radius:14px;width:min(1440px,100% - 32px);min-height:calc(100vh - 32px);margin:16px auto;overflow:hidden;box-shadow:0 18px 50px #17202b14}.app-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:32px;min-height:94px;padding:20px 26px;display:flex}.app-header h1,.app-header p,.panel-heading h2,.panel-heading p,.export-summary h2,.export-summary p,.settings-section h2{margin:0}.app-header h1{letter-spacing:-.035em;font-size:clamp(1.5rem,2.2vw,1.9rem);line-height:1.25}.app-header p{color:var(--muted);margin-top:6px;font-size:.9rem}.privacy-note{color:var(--muted);align-items:center;gap:9px;font-size:.82rem;line-height:1.45;display:flex}.privacy-note svg{color:var(--green);flex:none}.workspace{grid-template-columns:360px minmax(0,1fr);min-height:700px;display:grid}.settings-rail{border-right:1px solid var(--border);background:#fff}.settings-section{border-bottom:1px solid var(--border);padding:20px}.settings-section h2{letter-spacing:-.01em;margin-bottom:14px;font-size:.98rem;line-height:1.4}.settings-section h2>span{color:var(--green-dark)}.drop-zone{min-height:214px;color:var(--green-dark);text-align:center;border:1.5px dashed var(--green);cursor:pointer;background:linear-gradient(#fff,#fbfdfc);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:24px 20px 18px;transition:border-color .16s,background-color .16s,transform .16s;display:flex}.drop-zone.is-dragging{background:var(--green-soft);border-style:solid;transform:translateY(-2px)}.drop-zone>strong{margin-top:2px;font-size:.95rem}.drop-zone>span,.drop-zone small{color:var(--muted);font-size:.75rem}.button{cursor:pointer;border:1px solid #0000;border-radius:9px;justify-content:center;align-items:center;gap:9px;min-height:42px;padding:0 18px;font-size:.86rem;font-weight:700;transition:transform .14s,box-shadow .14s,background-color .14s;display:inline-flex}.button:not(:disabled):active{transform:translateY(1px)}.button-primary{color:#fff;background:var(--green);box-shadow:0 7px 18px #06a64f2e}.button-primary:not(:disabled):hover{background:var(--green-dark);box-shadow:0 9px 20px #06a64f3d}.button-compact{min-height:38px;margin:2px 0;padding:0 15px}.file-summary{border:1px solid color-mix(in srgb, var(--green), white 38%);background:#fff;border-radius:9px;grid-template-columns:38px minmax(0,1fr) 34px;align-items:center;gap:9px;min-width:0;margin-top:10px;padding:8px;display:grid}.file-summary img{object-fit:cover;border:1px solid var(--border);border-radius:6px;width:38px;height:38px}.file-summary>div{flex-direction:column;gap:2px;min-width:0;display:flex}.file-summary strong{text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;overflow:hidden}.file-summary span{color:var(--muted);font-size:.7rem}.icon-button{width:34px;height:34px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;padding:0;display:grid}.icon-button:hover{color:var(--danger);background:#fff3f1}.preset-selector{grid-template-columns:repeat(5,1fr);gap:7px;display:grid}.preset-selector button{min-width:0;height:38px;color:var(--ink);border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:8px;padding:0 4px;font-size:.76rem;font-weight:700;position:relative}.preset-selector button.is-selected{color:#fff;background:var(--green);border-color:var(--green)}.preset-selector button svg{color:var(--green);border:1px solid var(--green);background:#fff;border-radius:50%;padding:2px;position:absolute;top:-7px;right:-5px}.setting-hint{color:var(--muted);margin:9px 0 0;font-size:.72rem}.controls-section{border-bottom:0}.control-group{border:1px solid var(--border);border-radius:10px;margin-top:10px;padding:13px}.control-heading,.control-heading>span{align-items:center;display:flex}.control-heading{justify-content:space-between;gap:14px}.control-heading>span{gap:8px;font-size:.82rem;font-weight:700}.control-heading svg,.advanced-controls svg{color:var(--green-dark)}.outline-symbol{width:18px;height:18px;box-shadow:0 0 0 1.5px var(--ink);border:2px solid #fff;border-radius:50%}.toggle{cursor:pointer;background:#cbd2d7;border:0;border-radius:999px;align-items:center;width:43px;height:24px;padding:2px;transition:background-color .16s;display:flex}.toggle span{background:#fff;border-radius:50%;width:20px;height:20px;transition:transform .16s;display:block;box-shadow:0 1px 4px #17202b38}.toggle.is-on{background:var(--green)}.toggle.is-on span{transform:translate(19px)}.range-control{margin-top:12px;display:block}.range-control>span{color:var(--muted);justify-content:space-between;align-items:center;font-size:.72rem;font-weight:600;display:flex}.range-control output{min-width:48px;color:var(--ink);text-align:center;background:var(--surface-soft);border:1px solid var(--border);border-radius:6px;padding:3px 7px;font-size:.72rem}.range-control input{width:100%;height:4px;accent-color:var(--green);cursor:pointer;margin:13px 0 6px}.range-control small{color:var(--muted);justify-content:space-between;font-size:.64rem;display:flex}.advanced-controls{border:1px solid var(--border);border-radius:10px;margin-top:10px}.advanced-controls summary{cursor:pointer;align-items:center;gap:8px;min-height:42px;padding:0 13px;font-size:.8rem;font-weight:700;list-style:none;display:flex}.advanced-controls summary::-webkit-details-marker{display:none}.advanced-controls summary:after{content:"+";color:var(--muted);margin-left:auto;font-size:1rem}.advanced-controls[open] summary:after{content:"−"}.advanced-body{border-top:1px solid var(--border);gap:7px;padding:2px 13px 14px;display:grid}.advanced-body>label:first-child{color:var(--muted);grid-template-columns:58px 1fr;align-items:center;padding-top:12px;font-size:.72rem;display:grid}.advanced-body select{min-height:36px;color:var(--ink);border:1px solid var(--border);background:#fff;border-radius:7px;padding:0 9px;font-size:.75rem}.text-button{min-height:34px;color:var(--green-dark);cursor:pointer;background:0 0;border:0;justify-self:start;align-items:center;gap:6px;padding:0;font-size:.72rem;font-weight:700;display:inline-flex}.button-refresh{width:100%;color:var(--muted);border-color:var(--border);background:#fff;margin-top:12px}.button-refresh.needs-refresh{color:var(--coral);border-color:color-mix(in srgb, var(--coral), white 38%);background:#fff8f6}.preview-workspace{background:#fff;min-width:0}.message{border-radius:9px;margin:14px 18px 0;padding:11px 13px;font-size:.78rem}.message-error{color:var(--danger);background:#fff3f1;border:1px solid #f1c3be;grid-template-columns:20px 1fr 28px;align-items:center;gap:9px;display:grid}.message-error button{width:28px;height:28px;color:inherit;cursor:pointer;background:0 0;border:0;border-radius:6px;place-items:center;padding:0;display:grid}.message-warning{color:#704307;background:#fff9ec;border:1px solid #ead5a6}.message-warning summary{cursor:pointer;align-items:center;gap:8px;font-weight:700;display:flex}.message-warning ul{margin:10px 0 0 28px;padding:0}.panel-heading{justify-content:space-between;align-items:center;gap:16px;min-height:42px;display:flex}.panel-heading h2{font-size:1rem;line-height:1.4}.panel-heading p{color:var(--muted);margin-top:2px;font-size:.7rem}.processing-status{color:var(--muted);align-items:center;gap:7px;font-size:.75rem;display:flex}.panel-status-row{justify-content:flex-end;align-items:center;gap:12px;display:flex}.cancel-processing{border:1px solid var(--border-strong);min-height:30px;color:var(--muted-strong);background:var(--surface);border-radius:7px;align-items:center;gap:4px;padding:4px 9px;font-size:.72rem;font-weight:650;display:inline-flex}.cancel-processing:hover{border-color:var(--danger);color:var(--danger)}.processing-status.phase-ready,.processing-status.phase-exporting{color:var(--green-dark)}.processing-status.phase-error{color:var(--danger)}.source-panel{border-bottom:1px solid var(--border);min-height:468px;padding:14px 18px 18px}.source-empty{color:#9aa2aa;background:var(--surface-soft);border:1px dashed #cbd1d6;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:380px;display:flex}.source-empty strong{color:var(--muted);font-size:.9rem}.source-empty span{font-size:.74rem}.source-stage{padding-top:8px}.source-image-frame{border:1px solid var(--border);border-radius:10px;width:min(100%,780px);max-height:570px;margin:0 auto;position:relative;overflow:hidden}.source-image-frame>img{object-fit:contain;width:100%;height:100%}.checkerboard{background-color:#fff;background-image:linear-gradient(45deg,#eef1f2 25%,#0000 25%),linear-gradient(-45deg,#eef1f2 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#eef1f2 75%),linear-gradient(-45deg,#0000 75%,#eef1f2 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.grid-overlay{position:absolute;inset:0}.grid-overlay span{color:#fff;border:1.5px dashed var(--green);text-shadow:0 1px 2px #00000073;background:#06a64f0a;place-items:start;padding:4px;font-size:clamp(.55rem,1vw,.72rem);font-weight:800;display:grid;position:absolute}.source-meta{width:min(100%,780px);color:var(--muted);justify-content:space-between;margin:7px auto 0;font-size:.7rem;display:flex}.progress-track{background:#e9edef;border-radius:999px;height:3px;margin-top:12px;overflow:hidden}.progress-track span{background:var(--green);border-radius:inherit;height:100%;transition:width .18s;display:block}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.output-panel{padding:14px 18px 18px}.output-heading>span{color:var(--muted);font-size:.7rem}.output-empty{color:#969fa7;background:var(--surface-soft);border-radius:10px;justify-content:center;align-items:center;gap:10px;min-height:154px;font-size:.78rem;display:flex}.output-layout{grid-template-columns:minmax(0,1fr) 198px;gap:14px;display:grid}.stamp-grid{grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:7px;display:grid}.stamp-grid button{aspect-ratio:1;min-width:0;color:var(--muted);background:var(--surface-soft);border:1px solid var(--border);cursor:pointer;border-radius:8px;grid-template-rows:minmax(0,1fr) 15px;padding:5px;display:grid;position:relative}.stamp-grid button.is-selected{background:var(--green-soft);border-color:var(--green);box-shadow:0 0 0 1px var(--green)}.stamp-grid button>span{z-index:1;color:#fff;background:#626b74;border-radius:5px;place-items:center;min-width:20px;height:20px;padding:0 5px;font-size:.64rem;font-weight:800;display:grid;position:absolute;top:4px;left:4px}.stamp-grid button.is-selected>span{background:var(--green)}.stamp-grid img{object-fit:contain;width:100%;height:100%}.stamp-grid small{text-overflow:ellipsis;white-space:nowrap;align-self:end;font-size:.58rem;overflow:hidden}.derived-previews{grid-template-columns:1fr 1fr;align-content:start;gap:8px;display:grid}.derived-previews figure{border:1px solid var(--border);border-radius:9px;min-width:0;margin:0;padding:8px}.derived-previews figure:first-child{grid-column:1/-1}.derived-previews figcaption{margin-bottom:6px;font-size:.7rem;font-weight:700}.derived-previews figure>div{aspect-ratio:1;border-radius:6px;place-items:center;display:grid;overflow:hidden}.derived-previews figure>div.tab-preview{aspect-ratio:96/74}.derived-previews img{object-fit:contain;width:100%;height:100%}.derived-previews small{color:var(--muted);margin-top:5px;font-size:.6rem;display:block}.export-bar{border-top:1px solid var(--border);background:#fff;justify-content:space-between;align-items:center;gap:28px;min-height:112px;padding:17px 24px;display:flex}.export-summary h2{font-size:.85rem}.export-summary p{color:var(--muted);margin-top:4px;font-size:.68rem}.output-specs{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.output-specs span{color:#4c5761;border:1px solid var(--border);border-radius:7px;align-items:center;gap:6px;min-height:30px;padding:0 10px;font-size:.67rem;display:inline-flex}.output-specs svg{color:var(--green)}.export-action{text-align:center;flex-direction:column;align-items:stretch;gap:7px;min-width:min(100%,330px);display:flex}.button-export{min-height:50px;font-size:.95rem}.export-action small{color:var(--muted);font-size:.66rem}@media (max-width:1080px){.workspace{grid-template-columns:330px minmax(0,1fr)}.output-layout{grid-template-columns:1fr}.derived-previews{grid-template-columns:repeat(2,minmax(100px,150px))}.derived-previews figure:first-child{grid-column:auto}}@media (max-width:820px){.app-shell{width:100%;min-height:100vh;box-shadow:none;border:0;border-radius:0;margin:0}.app-header{flex-direction:column;align-items:flex-start;gap:12px;min-height:0;padding:18px 16px}.privacy-note{font-size:.72rem}.workspace{display:block}.settings-rail{border-right:0}.settings-section{padding:18px 16px}.controls-section{border-bottom:1px solid var(--border)}.source-panel,.output-panel{padding-left:16px;padding-right:16px}.source-panel{min-height:0}.source-empty{text-align:center;min-height:250px;padding:20px}.source-image-frame{max-height:none}.stamp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.export-bar{flex-direction:column;align-items:stretch;padding:18px 16px 24px}.export-action{width:100%}}@media (max-width:440px){.preset-selector{gap:5px}.preset-selector button{font-size:.7rem}.drop-zone{min-height:196px}.panel-heading{flex-direction:column;align-items:flex-start;gap:5px}.panel-status-row{justify-content:space-between;width:100%}.source-meta{flex-direction:column;align-items:flex-start;gap:3px}.stamp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.output-specs{display:grid}}