:root{--paper: #faf6ef;--ink: #2c2620;--muted: #8a8075;--accent: #d85a30;--accent-ink: #4a1b0c;--line: #e6ddd0;--ok: #1d9e75}*{box-sizing:border-box;margin:0}body{font-family:Noto Sans Thai,system-ui,sans-serif;background:var(--paper);color:var(--ink)}.page{max-width:480px;margin:0 auto;padding:16px 16px 48px}.center{text-align:center}.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:18px;letter-spacing:.02em;padding:8px 0 16px}.brand-mark{color:var(--accent);font-size:22px}.stepper{margin-left:auto;display:flex;gap:6px}.dot{width:8px;height:8px;border-radius:50%;background:var(--line)}.dot.on{background:var(--accent)}.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 2px 0 var(--line)}.card h2{font-size:20px;margin-bottom:6px}.muted{color:var(--muted);font-size:14px;margin:6px 0 14px;line-height:1.6}.ok{color:var(--ok);font-size:14px;margin:10px 0}.dropzone{width:100%;padding:36px 16px;border:2px dashed var(--line);border-radius:12px;background:var(--paper);color:var(--muted);font-size:15px;cursor:pointer}.dropzone:active{border-color:var(--accent);color:var(--accent)}.field-label{display:block;font-size:13px;color:var(--muted);margin:16px 0 8px}.chip-row{display:flex;flex-wrap:wrap;gap:8px}.chip{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 14px;border-radius:10px;border:1.5px solid var(--line);background:#fff;font-size:14px;font-weight:600;color:var(--ink);cursor:pointer}.chip small{font-weight:400;font-size:11px;color:var(--muted)}.chip.sel{border-color:var(--accent);background:#fdf0ea;color:var(--accent-ink)}.primary{width:100%;margin-top:20px;padding:14px;background:var(--accent);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer}.primary:disabled{opacity:.4}input,textarea{width:100%;padding:12px;margin-bottom:8px;border:1.5px solid var(--line);border-radius:10px;font:inherit;background:#fff}textarea{min-height:72px;resize:vertical}.pages-scroll{display:flex;gap:10px;overflow-x:auto;padding:8px 0 12px}.page-thumb{flex:0 0 120px;min-height:120px;border-radius:8px;border:1px solid var(--line);background:var(--paper);padding:10px;display:flex;flex-direction:column;gap:4px}.thumb-img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;border:1px solid var(--line);background:#fff}.page-no{font-size:12px;font-weight:700;color:var(--accent-ink)}.tmpl{font-size:11px;color:var(--muted)}.cap{font-size:11px;color:var(--ink);margin-top:auto;font-style:italic}.qr{width:240px;margin:16px auto;display:block;border-radius:12px;border:1px solid var(--line)}.ghost{background:none;border:1.5px solid var(--line);border-radius:10px;padding:10px 14px;font:inherit;font-size:14px;font-weight:600;color:var(--accent-ink);cursor:pointer}.ghost:active{border-color:var(--accent)}.ghost.small{padding:6px 12px;font-size:13px}.ghost.block{width:100%;margin:4px 0 10px}.editor-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.edit-strip{display:flex;gap:10px;overflow-x:auto;padding:10px 2px 6px;margin:0 -2px;-webkit-overflow-scrolling:touch}.strip-item{flex:0 0 56px;background:none;border:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:3px;font:inherit;cursor:pointer}.strip-item .edit-canvas.mini{width:56px}.strip-item.cur .edit-canvas.mini{outline:2px solid var(--accent);outline-offset:1px}.strip-label{font-size:11px;color:var(--muted);white-space:nowrap}.strip-item.cur .strip-label{color:var(--accent-ink);font-weight:700}.dirty-dot{color:var(--accent);font-style:normal;font-size:9px;margin-left:2px}.edit-page-title{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:10px 0 8px;font-size:15px}.sel-hint{font-size:12px;color:var(--accent);font-weight:600}.edit-canvas{position:relative;width:100%;aspect-ratio:1;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}.edit-canvas.mini{border-radius:6px}.slot{position:absolute;background-color:var(--paper);background-repeat:no-repeat;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;overflow:hidden;-webkit-tap-highlight-color:transparent}.edit-canvas.mini .slot{cursor:default;border-width:.5px}.slot.empty{border:1.5px dashed var(--line);background-color:var(--paper)}.slot.sel{outline:3px solid var(--accent);outline-offset:-3px}.slot.sel:after{content:"✓";position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:700;line-height:22px}.slot-label{font-size:11px;color:var(--muted);padding:4px;line-height:1.4}