:root{--ink:#1a2332;--ink-muted:#5a6a7a;--paper:#f4f7f9;--paper-sheet:#fff;--surface:#ffffffb8;--surface-solid:#eef3f6;--border:#c5d0da;--border-strong:#8a9aab;--accent:#0d7377;--accent-hover:#095c5f;--accent-soft:#0d73771f;--danger:#b42318;--danger-soft:#b423181a;--success:#0f7a45;--success-soft:#0f7a451f;--focus:#0d7377;--shadow-sheet:0 1px 0 #1a23320f, 0 18px 40px #1a23321f;--shadow-rail:0 1px 0 #1a23320a;--font-display:"Sora", system-ui, sans-serif;--font-body:"Sora", system-ui, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--text:var(--ink-muted);--text-h:var(--ink);--bg:var(--paper);--code-bg:var(--surface-solid);--accent-border:var(--accent-hover);font-family:var(--font-body);color:var(--text-h);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--ink:#e8eef2;--ink-muted:#9aabba;--paper:#121820;--paper-sheet:#1a222c;--surface:#1a222cd9;--surface-solid:#1e2833;--border:#2f3d4c;--border-strong:#4a5d70;--accent:#2dd4bf;--accent-hover:#5eead4;--accent-soft:#2dd4bf24;--danger:#f87171;--danger-soft:#f871711f;--success:#4ade80;--success-soft:#4ade8024;--focus:#2dd4bf;--shadow-sheet:0 1px 0 #0000004d, 0 20px 48px #00000073;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:radial-gradient(ellipse 120% 80% at 100% 0%, #0d737714, transparent 50%), radial-gradient(ellipse 90% 60% at 0% 100%, #1a23320f, transparent 45%), linear-gradient(165deg, var(--paper) 0%, color-mix(in srgb, var(--paper) 88%, var(--border)) 100%);background-attachment:fixed;min-height:100svh;margin:0}@media (prefers-color-scheme:dark){body{background:radial-gradient(120% 80% at 100% 0,#2dd4bf12,#0000 50%),radial-gradient(90% 60% at 0 100%,#00000059,#0000 45%),linear-gradient(165deg,#0e141b 0%,#121820 100%)}}#root{width:100%;max-width:1280px;margin:0 auto}h1,h2,h3{font-family:var(--font-display);color:var(--text-h);letter-spacing:-.02em;font-weight:600}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.app{min-height:100svh;padding:var(--space-5) clamp(1rem, 3.5vw, 2.5rem) var(--space-7);gap:var(--space-5);flex-direction:column;display:flex}.header{gap:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--border);grid-template-columns:auto 1fr;align-items:end;display:grid}.brand-mark{flex-direction:column;gap:.15rem;display:flex}.brand-kicker{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);font-size:.7rem;font-weight:500}.header h1{letter-spacing:-.04em;margin:0;font-size:clamp(1.65rem,3.5vw,2.35rem);font-weight:700;line-height:1.1}.maker-credit{align-items:baseline;gap:.4rem;margin:.35rem 0 0;display:flex}.maker-label{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);font-size:.72rem;font-weight:400}.maker-name{font-family:var(--font-display);letter-spacing:-.02em;color:var(--accent);font-size:.95rem;font-weight:600}.subtitle{max-width:36rem;color:var(--text);align-self:center;margin:0;font-size:.95rem;line-height:1.55}.colophon{align-items:center;gap:var(--space-3);padding-top:var(--space-4);flex-direction:column;margin-top:auto;display:flex}.colophon-rule{background:linear-gradient(90deg, transparent, var(--border-strong), transparent);width:min(12rem,40%);height:1px;display:block}.colophon-text{align-items:baseline;gap:.45rem;margin:0;display:flex}.colophon-text .maker-name{font-size:1.05rem}.site-link{font-family:var(--font-mono);letter-spacing:.04em;color:var(--accent);font-size:.75rem;text-decoration:none;transition:color .15s}.site-link:hover{color:var(--accent-hover);text-decoration:underline}.main{gap:var(--space-5);flex:1;grid-template-columns:minmax(260px,300px) minmax(0,1fr);align-items:start;display:grid}@media (width<=900px){.header{grid-template-columns:1fr;align-items:start}.main{grid-template-columns:1fr}}.rail{top:var(--space-4);gap:var(--space-4);padding:var(--space-4);background:var(--surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-rail);flex-direction:column;display:flex;position:sticky}@media (width<=900px){.rail{position:static}}.rail-section{gap:var(--space-3);flex-direction:column;display:flex}.rail-section+.rail-section{padding-top:var(--space-4);border-top:1px solid var(--border)}.rail-title{font-size:.72rem;font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-muted);margin:0;font-weight:500}.field{gap:var(--space-1);text-align:left;flex-direction:column;display:flex}.field>span{color:var(--text-h);font-size:.82rem;font-weight:500}.field select,.field input[type=file],.page-indicator input{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--paper-sheet);width:100%;color:var(--text-h);font:inherit;padding:.55rem .65rem;font-size:.9rem;transition:border-color .15s,box-shadow .15s}.field select:hover,.page-indicator input:hover{border-color:var(--border-strong)}.field select:focus,.page-indicator input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}.field small{color:var(--text);font-size:.75rem;line-height:1.4}.file-drop{align-items:flex-start;gap:var(--space-1);padding:var(--space-3);border:1px dashed var(--border-strong);border-radius:var(--radius-sm);background:var(--accent-soft);cursor:pointer;flex-direction:column;transition:border-color .15s,background .15s;display:flex;position:relative}.file-drop:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent-soft) 80%, var(--accent))}.file-drop input[type=file]{opacity:0;cursor:pointer;border:none;padding:0;position:absolute;inset:0}.file-drop-label{color:var(--accent);font-size:.88rem;font-weight:600}.file-drop-hint{color:var(--text);font-size:.72rem;line-height:1.35}.batch-info{gap:var(--space-2);padding:var(--space-3);background:var(--surface-solid);border:1px solid var(--border);border-radius:var(--radius-sm);display:grid}.info-row{justify-content:space-between;align-items:baseline;gap:var(--space-2);color:var(--text);font-size:.85rem;display:flex}.info-row strong{font-family:var(--font-mono);color:var(--text-h);font-size:.82rem;font-weight:500}.actions{gap:var(--space-2);flex-direction:column;display:flex}button{font:inherit;cursor:pointer;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--paper-sheet);color:var(--text-h);padding:.55rem .9rem;transition:background .15s,border-color .15s,opacity .15s}button:hover:not(:disabled){border-color:var(--border-strong)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;letter-spacing:-.01em;width:100%;font-weight:600}button.primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}button.ghost{color:var(--accent);background:0 0;border:none;padding:.1rem .25rem;font-size:.78rem;font-weight:500}button.ghost:hover:not(:disabled){text-decoration:underline}button.danger{width:100%;color:var(--danger);border-color:color-mix(in srgb, var(--danger) 35%, var(--border));background:0 0;padding:.45rem .75rem;font-size:.82rem;font-weight:500}button.danger:hover:not(:disabled){background:var(--danger-soft);border-color:var(--danger)}.status,.error,.hint{margin:0;font-size:.82rem;line-height:1.4}.status{padding:var(--space-2) var(--space-3);background:var(--success-soft);color:var(--success);border-radius:var(--radius-sm)}.error{padding:var(--space-2) var(--space-3);background:var(--danger-soft);color:var(--danger);border-radius:var(--radius-sm)}.hint{color:var(--text);font-family:var(--font-mono);font-size:.75rem}.sheet-stage{gap:var(--space-4);flex-direction:column;min-width:0;display:flex}.sheet-toolbar{justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.sheet-toolbar h2{margin:0;font-size:1rem;font-weight:600}.sheet-meta{font-family:var(--font-mono);color:var(--ink-muted);letter-spacing:.04em;font-size:.72rem}.pagination{align-items:center;gap:var(--space-2);display:flex}.pagination button{padding:.35rem .7rem;font-size:.8rem;font-weight:500}.pagination button:hover:not(:disabled){background:var(--accent-soft);border-color:var(--accent)}.page-indicator{color:var(--text);font-size:.82rem;font-family:var(--font-mono);align-items:center;gap:.3rem;display:flex}.page-indicator input{text-align:center;width:3.25rem;padding:.3rem}.sheet{aspect-ratio:210/297;background:var(--paper-sheet);border:1px solid var(--border);width:min(100%,520px);max-height:min(72vh,780px);box-shadow:var(--shadow-sheet);margin:0 auto;padding:clamp(.5rem,1.5vw,.85rem);position:relative}.sheet:before,.sheet:after{content:"";border-color:var(--accent);opacity:.45;pointer-events:none;border-style:solid;width:10px;height:10px;position:absolute}.sheet:before{border-width:2px 0 0 2px;top:-1px;left:-1px}.sheet:after{border-width:0 2px 2px 0;bottom:-1px;right:-1px}.grid{background:var(--border);gap:2px;width:100%;height:100%;display:grid}.grid-2-horizontal{grid-template-rows:1fr;grid-template-columns:1fr 1fr}.grid-2-vertical{grid-template-rows:1fr 1fr;grid-template-columns:1fr}.grid-3-row{grid-template-rows:1fr;grid-template-columns:repeat(3,1fr)}.grid-4-grid{grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr}.grid-4-grid .slot-top-left{grid-area:1/1}.grid-4-grid .slot-top-right{grid-area:1/2}.grid-4-grid .slot-bottom-left{grid-area:2/1}.grid-4-grid .slot-bottom-right{grid-area:2/2}.slot{background:var(--paper-sheet);flex-direction:column;min-height:0;display:flex;overflow:hidden}.slot-header{justify-content:space-between;align-items:center;gap:var(--space-2);background:color-mix(in srgb, var(--surface-solid) 70%, var(--paper-sheet));border-bottom:1px solid var(--border);padding:.3rem .45rem;font-size:.72rem;display:flex}.slot-label{color:var(--text-h);align-items:center;gap:.4rem;min-width:0;font-weight:600;display:flex}.slot-index-badge{font-family:var(--font-mono);color:var(--ink-muted);border:1px solid var(--border);white-space:nowrap;border-radius:2px;padding:.05rem .3rem;font-size:.65rem;font-weight:400}.slot-body{cursor:pointer;background:linear-gradient(90deg, transparent 49.5%, color-mix(in srgb, var(--border) 55%, transparent) 50%, transparent 50.5%), linear-gradient(transparent 49.5%, color-mix(in srgb, var(--border) 55%, transparent) 50%, transparent 50.5%);background-size:100% 100%;flex:1;place-items:center;min-height:64px;transition:background-color .15s;display:grid;position:relative}.slot-body:hover{background-color:var(--accent-soft)}.slot-body:focus-within{outline:2px solid var(--focus);outline-offset:-2px;z-index:1}.slot-body input[type=file]{opacity:0;cursor:pointer;position:absolute;inset:0}.slot-body.has-image{background:var(--paper-sheet)}.preview-image-container{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;min-height:0;padding:.35rem;display:flex;position:relative}.preview-image-container img{object-fit:contain;max-width:100%;max-height:calc(100% - 1.35rem)}.file-name-badge{white-space:nowrap;text-overflow:ellipsis;max-width:92%;font-family:var(--font-mono);background:color-mix(in srgb, var(--ink) 82%, transparent);color:var(--paper-sheet);pointer-events:none;border-radius:2px;padding:.12rem .4rem;font-size:.65rem;position:absolute;bottom:4px;left:50%;overflow:hidden;transform:translate(-50%)}.placeholder{color:var(--ink-muted);text-align:center;z-index:0;padding:.5rem;font-size:.78rem;font-weight:500}@media (width<=560px){.sheet{aspect-ratio:210/297;width:100%;max-height:none}.slot-header{flex-wrap:wrap}.pagination{justify-content:space-between;width:100%}}