:root{--bg: #f7fbff;--ink: #3b4c63;--muted: #6b849e;--paper: #ffffff;--panel: #ffffff;--line: #d7e9fb;--line-strong: #b8d8f6;--accent: #3b9bff;--accent-dark: #2b86e8;--ok: #3b9bff;--ok-hover: #2b86e8;--print: #ff8a3d;--print-dark: #f97316;--warn: #e07a2f;--gold: #ffcd4a;--mint: #5ee0b5;--shadow: 0 10px 28px rgba(59, 155, 255, .1);--radius: 20px;--sans: "Nunito", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;color-scheme:light}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%;background:radial-gradient(900px 480px at 8% -10%,#fff8e8 0%,transparent 55%),radial-gradient(800px 420px at 100% 0%,#e0f2fe 0%,transparent 55%),radial-gradient(700px 500px at 50% 100%,#fff3c4 0%,transparent 50%),linear-gradient(180deg,#f4fbff,#fff 55%,#fff8ee);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.45}body{padding:max(20px,env(safe-area-inset-top)) 20px max(28px,env(safe-area-inset-bottom))}.app{max-width:1180px;margin:0 auto}.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;margin-bottom:22px;padding-bottom:18px;border-bottom:3px solid transparent;border-image:linear-gradient(90deg,#9ad0ff,#b8f0ea,#ffe08a,#ffc08a) 1}.brand{display:flex;align-items:center;gap:14px}.logo{width:72px;height:72px;flex:none;object-fit:contain;filter:drop-shadow(0 6px 12px rgba(59,155,255,.18))}h1{font-family:var(--sans);font-weight:800;font-size:clamp(1.9rem,3.6vw,2.5rem);letter-spacing:-.03em;margin:0;line-height:1.05;color:#4a8fd6}.tag{margin:4px 0 0;color:var(--muted);font-size:.92rem}.privacy{margin:0;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:#4a8fd6;border:1px solid #cfe8ff;background:#f3f9ff;padding:7px 12px;border-radius:999px}.layout{display:grid;gap:20px}@media(min-width:980px){.layout{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:start}}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);border-color:#d7e9fb}.panel-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:16px}.step{margin:0 0 2px;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:#ff8a3d;font-weight:800}h2{font-family:var(--sans);font-weight:800;font-size:1.45rem;letter-spacing:-.03em;margin:0;color:#4a8fd6}.hint{margin:0;color:var(--muted);font-size:.85rem}.group{border:0;margin:0 0 16px;padding:0;min-width:0}.group legend{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;padding:0;font-weight:600}.select-wrap{display:block}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;min-height:50px;font:inherit;font-size:16px;font-weight:600;color:var(--ink);background-color:#fff;background-image:linear-gradient(45deg,transparent 50%,#7ec4ff 50%),linear-gradient(135deg,#7ec4ff 50%,transparent 50%);background-position:calc(100% - 18px) calc(50% - 3px),calc(100% - 12px) calc(50% - 3px);background-size:6px 6px,6px 6px;background-repeat:no-repeat;border:2px solid #cfe8ff;border-radius:14px;padding:12px 40px 12px 14px;cursor:pointer}.select:hover{border-color:#7ec4ff}.select:focus{outline:none;border-color:#7ec4ff;box-shadow:0 0 0 4px #7ec4ff47}.chip-group{display:grid;gap:8px}.chip-group-label{font-size:.72rem;color:var(--muted)}.chip-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:8px}.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:flex;align-items:center;gap:10px;text-align:left;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;padding:9px 10px;border-radius:12px;cursor:pointer;min-height:52px;transition:border-color .15s ease,background .15s ease,color .15s ease}.chip:hover{border-color:var(--ink)}.chip[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.chip-aspect{flex:none;width:18px;height:22px;border:1.5px solid currentColor;border-radius:2px;opacity:.85}.chip-copy{display:grid;gap:1px;min-width:0}.chip-copy strong{font-size:.86rem;font-weight:650;letter-spacing:-.02em}.chip-copy em{font-style:normal;font-size:.72rem;opacity:.7}.seg{display:flex;flex-wrap:wrap;gap:6px}.seg button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-weight:600;padding:8px 13px;border-radius:999px;cursor:pointer;min-height:40px;transition:background .15s ease,color .15s ease,border-color .15s ease}.seg button:hover{border-color:var(--ink)}.seg button[aria-pressed=true]{background:#7ec4ff;color:#fff;border-color:#7ec4ff}.custom-size{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.custom-size label{display:grid;gap:4px;font-size:.82rem;color:var(--muted)}.custom-size span{display:flex;align-items:center;gap:6px;color:var(--ink)}.custom-size input,.slider input[type=range]{font:inherit;font-size:16px;accent-color:#7ec4ff}.custom-size input[type=number]{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 10px;color:var(--ink);width:100%;max-width:7rem}.inline-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:10px}.size-readout{margin:0;font-variant-numeric:tabular-nums;font-size:.85rem;color:var(--muted)}.rotate-paper{margin-top:8px}.stage-wrap{position:relative;background:#f3f9ff;border-radius:16px;overflow:hidden;aspect-ratio:1;touch-action:none;overscroll-behavior:contain;box-shadow:inset 0 0 0 2px #d7e9fb}.cropper{display:block;width:100%;height:100%;cursor:grab;touch-action:none}.crop-badge{position:absolute;left:12px;bottom:12px;z-index:1;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:#4a8fd6;background:#ffffffe0;border:1px solid #d7e9fb;padding:5px 8px;border-radius:999px;pointer-events:none}.dropzone{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:24px;text-align:center;color:#4a8fd6;background:radial-gradient(circle at 50% 38%,rgba(255,205,74,.28),transparent 46%),linear-gradient(180deg,#f7fbff,#eef7ff);cursor:pointer}.dropzone.hidden{display:none}.dropzone.drag{outline:2px dashed var(--gold);outline-offset:-12px}.drop-kicker{margin:0;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#ff8a3d;font-weight:800}.drop-title{font-family:var(--sans);font-weight:800;font-size:1.7rem;letter-spacing:-.03em;margin:0;color:#4a8fd6}.drop-sub{margin:0;color:#6b849e;font-size:.9rem}.crop-tools{margin-top:14px;display:grid;gap:10px}#tilt-label input[type=range]{width:100%}.tool-row{display:flex;flex-wrap:wrap;gap:8px}.status{margin:0;font-size:.88rem;color:var(--warn)}.status.info{color:#2c4a3e}.layout-opts{display:grid;gap:2px}.check{display:flex;align-items:center;gap:8px;min-height:40px;cursor:pointer}.check input{width:17px;height:17px;accent-color:#7ec4ff}.slider{display:grid;gap:4px;color:var(--muted);font-size:.9rem}.slider strong{color:var(--ink);font-weight:600}.slider.disabled{opacity:.4;pointer-events:none}.ticket{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:4px 0 12px;padding:0;background:#f3f9ff;color:#4a8fd6;border:1px solid #d7e9fb;border-radius:12px;overflow:hidden}.ticket div{margin:0;padding:12px 12px 13px;border-right:1px solid #d7e9fb}.ticket div:last-child{border-right:0}.ticket dt{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:#8bb4d9}.ticket dd{margin:4px 0 0;font-variant-numeric:tabular-nums;font-weight:650;font-size:.84rem;letter-spacing:-.02em;white-space:nowrap}.measured{display:grid;gap:4px;margin-top:8px;font-size:.9rem;color:var(--muted)}.measured span:last-child{display:flex;align-items:center;gap:6px;color:var(--ink)}.measured input{font:inherit;font-size:16px;border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 10px;width:6.5rem}.measured-hint{margin:4px 0 0;font-size:.82rem;color:var(--muted)}.fit-hint{margin:-4px 0 12px;font-size:.85rem;color:var(--muted)}.preview-frame{background:linear-gradient(180deg,rgba(255,255,255,.5),transparent 40%),repeating-conic-gradient(#dbeafe,#dbeafe 25%,#eff6ff 0%,#eff6ff 50%) 50% 50% / 18px 18px;border:1px solid #d7e9fb;border-radius:12px;padding:22px 18px;display:flex;justify-content:center;align-items:center;min-height:240px}.preview{display:block;max-width:100%;height:auto;background:#fff;box-shadow:0 16px 40px #1e18102e}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}.actions .btn-accent{grid-column:1 / -1}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid transparent;font:inherit;font-weight:600;padding:10px 14px;border-radius:11px;cursor:pointer;min-height:44px;transition:background .15s ease,border-color .15s ease,transform .12s ease}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:#7ec4ff;color:#fff}.btn-primary:hover:not(:disabled){background:#6bb6f7}.btn-accent{background:#ffb37a;color:#fff}.btn-accent:hover:not(:disabled){background:#ff9d5c}.btn-ghost{background:#fff;border-color:#cfe8ff;color:#4a8fd6}.btn-ghost:hover:not(:disabled){border-color:#7ec4ff;background:#f3f9ff}.btn:focus-visible,.chip:focus-visible,.seg button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.print-note{margin:12px 0 0;font-size:.86rem;color:var(--muted)}.print-note strong{color:var(--ink);font-weight:600}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}@media(max-width:720px){.ticket{grid-template-columns:1fr 1fr}.ticket div:nth-child(2){border-right:0}.actions{position:sticky;bottom:8px;z-index:2;padding-top:4px}}@media(prefers-reduced-motion:reduce){.btn,.chip,.seg button{transition:none}}