:root{--ink:#1f1e1c;--ink-2:#5d5a54;--ink-3:#8f8b84;--panel:#f6f4ef;--panel-2:#ece9e2;--line:#dcd8cf;--accent:#e8562a;--accent-ink:#fff;--mat:#fcfcfa;--mat-line:#20805242;--mat-line-fine:#2080521a;--mat-ink:#6f7d75;--warn:#d99a00;--bad:#d23b2a;--radius:6px;color-scheme:light}@media (prefers-color-scheme:dark){:root{--ink:#ecebe7;--ink-2:#b4b0a8;--ink-3:#85817a;--panel:#1e1d1b;--panel-2:#2a2926;--line:#3a3834;--mat:#1d211f;--mat-line:#5ac88c29;--mat-line-fine:#5ac88c0f;--mat-ink:#8a978f;color-scheme:dark}}*{box-sizing:border-box}html,body{height:100%;margin:0}body{color:var(--ink);background:var(--panel);grid-template:"bar bar bar""tray canvas inspector"minmax(0,1fr)"hints canvas inspector"/200px 1fr 300px;font:13px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;display:grid;overflow:hidden}button,input,select{font:inherit;color:inherit}.bar{border-bottom:1px solid var(--line);background:var(--panel);grid-area:bar;align-items:center;gap:10px;padding:8px 12px;display:flex}.brand{letter-spacing:-.03em;margin-right:6px;font-size:17px;font-weight:800}.brand span{color:var(--accent)}.group{gap:2px;display:flex}.spacer{flex:1}.summary{color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.btn{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:6px;min-height:30px;padding:4px 10px;display:inline-flex}.btn:hover:not(:disabled){background:var(--panel-2)}.btn:disabled{opacity:.4;cursor:default}.btn.icon{width:30px;padding:4px}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}.btn.primary:hover{background:color-mix(in srgb, var(--accent), #000 10%)}.btn.primary-soft{border-color:var(--accent);color:var(--accent);font-weight:600}#peek[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--panel)}.btn.danger{color:var(--bad)}#zoom-label{font-variant-numeric:tabular-nums;min-width:56px}.side{display:contents}.tray{border-right:1px solid var(--line);flex-direction:column;grid-area:tray;min-height:0;display:flex}h2{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin:0;font-size:11px;font-weight:650}.panel-head{justify-content:space-between;align-items:center;gap:8px;min-height:26px;display:flex}.tray .panel-head{padding:10px 12px 8px}#count{color:var(--ink-3);margin-left:4px}#tray-list{flex:1;grid-template-columns:repeat(2,1fr);grid-auto-rows:max-content;align-content:start;gap:6px;padding:0 12px 12px;display:grid;overflow-y:auto}.tray-item{aspect-ratio:1;background:var(--panel-2);cursor:grab;outline-offset:1px;border-radius:4px;outline:2px solid #0000;position:relative;overflow:hidden}.tray-item img{object-fit:cover;width:100%;height:100%;display:block}.tray-item.selected{outline-color:var(--accent)}.tray-item.hidden img{opacity:.3;filter:grayscale()}.tray-item .idx{color:#fff;text-align:center;font-variant-numeric:tabular-nums;background:#0000008c;border-radius:9px;min-width:18px;padding:0 4px;font-size:10px;line-height:18px;position:absolute;top:3px;left:3px}.tray-item.detached .idx{background:var(--accent)}.tray-item button{color:#fff;cursor:pointer;opacity:0;background:#0000008c;border:0;border-radius:4px;width:24px;height:24px;padding:2px;position:absolute;bottom:3px}.tray-item button svg{width:100%;height:100%}.tray-item .eye{left:3px}.tray-item .del{right:3px}.tray-item:hover button,.tray-item.hidden .eye,.tray-item button:focus-visible{opacity:1}.tray-item.drop-before{box-shadow:inset 3px 0 0 var(--accent)}.tray-item.drop-after{box-shadow:inset -3px 0 0 var(--accent)}.tray-item.lifted{opacity:.35}.tray-item.drop-target{outline-color:var(--accent);outline-style:dashed}.local-note{border-top:1px solid var(--line);color:var(--ink-3);align-items:flex-start;gap:6px;margin:0;padding:8px 12px 10px;font-size:11.5px;display:flex}.local-note svg{color:var(--ink-2);flex:none;margin-top:1px}.hints{border-top:1px solid var(--line);border-right:1px solid var(--line);grid-area:hints}.hint{color:var(--ink-3);margin:0;padding:10px 12px 12px;font-size:11.5px}#canvas{background-color:var(--mat);background-image:linear-gradient(var(--mat-line) 1px, transparent 1px), linear-gradient(90deg, var(--mat-line) 1px, transparent 1px), linear-gradient(var(--mat-line-fine) 1px, transparent 1px), linear-gradient(90deg, var(--mat-line-fine) 1px, transparent 1px);background-size:calc(var(--mm) * 10) calc(var(--mm) * 10), calc(var(--mm) * 10) calc(var(--mm) * 10), calc(var(--mm) * 5) calc(var(--mm) * 5), calc(var(--mm) * 5) calc(var(--mm) * 5);--mm:2px;grid-area:canvas;position:relative;overflow:auto}#pages{flex-direction:column;align-items:center;gap:28px;min-width:min-content;padding:36px 40px 60px;display:flex}#pages.empty{display:none}.page-label{color:var(--mat-ink);font-variant-numeric:tabular-nums;text-align:center;margin-bottom:6px;font-size:11px}.sheet{background:#fff;position:relative;overflow:hidden;box-shadow:0 0 0 1px #0000000f,0 2px 4px #00000014,0 10px 30px #0000001f}.guides{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.guides .marks{stroke:#000;stroke-width:.15px}.guides .cut{stroke:#9a9a9a;stroke-width:.12px;stroke-dasharray:1 1}.frame,.tray-item,#peek{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.frame{cursor:grab;z-index:1;isolation:isolate;position:absolute;overflow:hidden}.frame.manual{z-index:2}#pages.peek .frame{background:#00000012}#pages.peek .frame img{filter:none!important}.frame.pending img{filter:grayscale()}.frame:active{cursor:grabbing}.frame img{max-width:none;filter:var(--photo-filter,none);user-select:none;pointer-events:none;position:absolute}.frame:after{content:"";border:var(--bw) solid var(--bc);border-radius:inherit;pointer-events:none;position:absolute;inset:0}.frame:hover{outline:1px solid color-mix(in srgb, var(--accent), transparent 40%)}.frame.selected{outline:2px solid var(--accent);touch-action:none}.frame.dragging{opacity:.4;pointer-events:none}.frame.drop-target{outline:3px dashed var(--accent);outline-offset:-3px}.grip{z-index:3;background:var(--accent);cursor:move;opacity:0;border:2px solid #fff;border-radius:50%;width:18px;height:18px;padding:0;position:absolute;top:5px;left:50%;translate:-50%;box-shadow:0 1px 3px #0006}.frame:hover .grip,.frame.selected .grip{opacity:1}.handle{z-index:3;border:2px solid var(--accent);background:#fff;width:11px;height:11px;display:none;position:absolute}.frame.manual.selected .handle{display:block}.handle[data-h=nw]{cursor:nwse-resize;top:0;left:0}.handle[data-h=ne]{cursor:nesw-resize;top:0;right:0}.handle[data-h=sw]{cursor:nesw-resize;bottom:0;left:0}.handle[data-h=se]{cursor:nwse-resize;bottom:0;right:0}.dpi{z-index:3;color:#fff;font-variant-numeric:tabular-nums;background:#0009;border-radius:3px;padding:1px 5px;font-size:10px;display:none;position:absolute;bottom:4px;right:4px}.frame.selected .dpi,.frame.low .dpi,.frame.meh .dpi{display:block}.frame.meh .dpi{background:var(--warn)}.frame.low .dpi{background:var(--bad)}.snap{z-index:4;pointer-events:none;background:#ff2bd6;position:absolute}.snap.v{width:1px;top:0;bottom:0}.snap.h{height:1px;left:0;right:0}.ghost{z-index:100;object-fit:cover;pointer-events:none;border:2px solid #fff;border-radius:4px;width:72px;height:72px;margin:-36px;position:fixed;top:0;left:0;box-shadow:0 6px 20px #0006}.empty-state{border:2px dashed var(--mat-line);text-align:center;width:min(380px,100% - 32px);height:fit-content;color:var(--mat-ink);background:var(--mat);border-radius:12px;margin:auto;padding:32px 28px;display:none;position:absolute;inset:0}#pages.empty+.empty-state{display:block}.empty-state .big{color:var(--ink);margin:0 0 6px;font-size:20px;font-weight:650}.empty-state p{margin:0 0 18px}.inspector{border-left:1px solid var(--line);grid-area:inspector;overflow-y:auto}.panel{border-bottom:1px solid var(--line);flex-direction:column;gap:8px;padding:14px 14px 16px;display:flex}.panel h2{margin-bottom:2px}.panel>.btn{justify-content:flex-start}.panel>select{align-self:flex-start}.btn.mini,select.mini{height:26px;min-height:0;padding:0 9px;font-size:12px;font-weight:600}select.mini{color:var(--ink-2);background-position:right 7px center;padding-right:22px}.seg.iconic button{justify-content:center;align-items:center;gap:6px;display:inline-flex}.seg.iconic svg{width:16px;height:16px}.row{align-items:center;gap:6px;min-height:28px;display:flex}.row .lbl{color:var(--ink-2);flex:0 0 82px}.row .lbl:empty{display:none}.row>.seg,.row>input[type=range]{flex:1;min-width:0}.num{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);align-items:center;display:inline-flex;overflow:hidden}.num input{font-variant-numeric:tabular-nums;background:0 0;border:0;width:58px;padding:4px 6px}.num .unit{color:var(--ink-3);white-space:nowrap;padding-right:7px;font-size:11px}select{appearance:none;field-sizing:content;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='m1 1 4 4 4-4' fill='none' stroke='%238f8b84' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 8px center / 9px 6px;text-overflow:ellipsis;cursor:pointer;max-width:100%;height:28px;padding:0 24px 0 8px}select:hover{background-color:var(--panel-2)}input[type=range]{accent-color:var(--accent)}input[type=color]{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);width:34px;height:28px;padding:2px}.check{cursor:pointer;align-items:center;gap:6px;display:flex}.check input{accent-color:var(--accent)}.seg{border-radius:var(--radius);background:var(--panel-2);gap:2px;padding:2px;display:flex}.seg button{min-width:0;color:var(--ink-2);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:4px;flex:1;padding:4px 6px}.seg button[aria-pressed=true]{background:var(--panel);color:var(--ink);box-shadow:0 1px 2px #00000026}.seg.layouts{grid-template-columns:repeat(3,1fr);display:grid}.seg.layouts button{flex-direction:column;align-items:center;gap:2px;padding:6px 2px;font-size:11px;display:flex}.seg.layouts button[aria-pressed=true]{color:var(--accent)}.grid4{grid-template-columns:1fr 1fr;gap:6px 10px;display:grid}.grid4 .row .lbl{flex-basis:auto;min-width:14px}.grid4 .row .num input{width:100%}.grid4 .num{flex:1}.mono{border-radius:var(--radius);background:var(--panel-2);flex-direction:column;gap:8px;margin:2px 0 4px;padding:10px;display:flex}.mono .seg{background:var(--line)}.mono .seg button{padding:4px 2px;font-size:12px}.mono .val{text-align:right;width:34px;color:var(--ink-2);font-variant-numeric:tabular-nums;flex:none;margin:0}textarea.code{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);width:100%;min-height:220px;color:var(--ink);tab-size:2;resize:vertical;white-space:pre;padding:8px 10px;font:12px/1.5 ui-monospace,SF Mono,Menlo,Consolas,monospace;overflow:auto}textarea.code:focus{outline:2px solid color-mix(in srgb, var(--accent), transparent 50%);outline-offset:-1px}.code-status{color:var(--ink-2);font-variant-numeric:tabular-nums;margin:0;font-size:12px}.code-status.error{color:var(--bad);white-space:pre-wrap;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}.instructions summary{cursor:pointer;color:var(--ink-2);font-size:12px}.instructions pre{border-radius:var(--radius);background:var(--panel-2);white-space:pre-wrap;max-height:320px;margin:8px 0 0;padding:10px;font:11px/1.5 ui-monospace,SF Mono,Menlo,Consolas,monospace;overflow:auto}.note{color:var(--ink-3);margin:0;font-size:12px}.sel-head{align-items:center;gap:10px;display:flex}.sel-head img{object-fit:cover;border-radius:4px;width:48px;height:48px}.sel-name{min-width:0}.sel-name strong{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.meta{color:var(--ink-2);font-variant-numeric:tabular-nums;margin:0;font-size:11.5px}.drop-overlay{z-index:50;background:color-mix(in srgb, var(--accent), transparent 80%);border:4px dashed var(--accent);pointer-events:none;place-items:center;display:none;position:fixed;inset:0}.drop-overlay p{background:var(--accent);color:#fff;border-radius:10px;padding:14px 22px;font-size:17px;font-weight:650}body.dropping .drop-overlay{display:grid}.toast{z-index:60;background:var(--ink);max-width:calc(100% - 32px);color:var(--panel);opacity:0;pointer-events:none;border-radius:8px;padding:9px 14px;transition:all .2s;position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);box-shadow:0 6px 24px #0000004d}.toast.show{opacity:1;transform:translate(-50%)}.hint.touch{display:none}@media (hover:none){.hint.mouse{display:none}.hint.touch{display:block}.tray-item.selected button,.tray-item.hidden .eye{opacity:1}}@media (pointer:coarse){button,select,input{touch-action:manipulation}input,select,textarea.code{font-size:16px}.btn{min-height:38px}.btn.icon{width:38px}.btn.mini,select.mini{height:34px}.grip{width:30px;height:30px;top:8px}.handle{width:22px;height:22px}.tray-item button{width:28px;height:28px}.seg button{padding:7px 6px}}@media (width<=900px),(height<=560px) and (orientation:landscape){body{height:100dvh}.bar{gap:6px;padding:8px}.bar .spacer,.summary,.wide-only,.bar .zoom{display:none}.bar #peek{margin-left:auto}.side{overscroll-behavior:contain;background:var(--panel);flex-direction:column;grid-area:side;min-height:0;display:flex;overflow-y:auto}.tray,.inspector,.hints{border:0}.tray{border-bottom:1px solid var(--line);flex:none}.inspector{overflow:visible}.tray .panel-head{padding:10px 16px 8px}#tray-list{scroll-snap-type:x proximity;padding:2px 16px 12px;scroll-padding-inline:16px;display:flex;overflow:auto hidden}.local-note{border-top:0;padding:0 16px 12px}.tray-item{scroll-snap-align:start;flex:0 0 76px}.panel{padding:14px 16px 16px}.hint{padding:12px 16px 24px}#pages{gap:16px;padding:16px 12px 24px}}@media (width<=900px) and (orientation:portrait){body{grid-template:"bar""canvas"minmax(0,1fr)"side"minmax(0,1fr)/100%}.side{border-top:1px solid var(--line)}}@media (width<=900px) and (orientation:landscape),(height<=560px) and (orientation:landscape){body{grid-template:"bar bar""canvas side"minmax(0,1fr)/minmax(0,1.25fr) minmax(260px,1fr)}.side{border-left:1px solid var(--line)}.bar{padding:5px 8px}}@media print{html,body{background:#fff;height:auto;display:block;overflow:visible}.ui,.page-label,.dpi,.grip,.handle,.snap{display:none!important}#canvas{background:0 0;overflow:visible}#pages{padding:0;display:block;--mm:1mm!important}.page{break-after:page}.page:last-child{break-after:auto}.sheet{box-shadow:none}.frame.diffused img{image-rendering:pixelated}.frame{outline:none!important}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}