:root{--bg:#eef1f4;--panel:#fff;--line:#c9d1db;--line-soft:#e3e8ee;--ink:#111a24;--muted:#5b6876;--accent:#1d4ed8;--accent-soft:#dbe6ff;--danger:#c81e1e;--danger-soft:#fdecec;--warn-soft:#fff4d6;--ok:#157f3b;--font:-apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--ink);font:16px/1.4 var(--font);-webkit-tap-highlight-color:transparent;margin:0}button,input,select,textarea{font:inherit;color:inherit}button{border:1px solid var(--line);background:var(--panel);cursor:pointer;white-space:nowrap;border-radius:10px;justify-content:center;align-items:center;gap:6px;min-height:44px;padding:0 14px;display:inline-flex}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.toggle[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent-soft)}button.danger{color:var(--danger);border-color:#f2b8b8}button.ghost{background:0 0;border-color:#0000}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--accent-soft);outline-offset:1px;border-color:var(--accent)}input,textarea,select{border:1px solid var(--line);background:#fff;border-radius:10px;width:100%;min-height:44px;padding:8px 10px}textarea{resize:vertical;min-height:70px}label{color:var(--muted);gap:4px;font-size:14px;display:grid}label>input,label>textarea,label>select{color:var(--ink);font-size:16px}.eyebrow{letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:0;font-size:12px;font-weight:600}.page{max-width:760px;padding-block:24px 48px;padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));gap:16px;margin:0 auto;display:grid}.page h1{text-wrap:balance;margin:0;font-size:26px}.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;gap:12px;padding:16px;display:grid}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.row>label{flex:140px}.muted{color:var(--muted)}.notice{background:var(--warn-soft);border-radius:10px;padding:10px 12px;font-size:15px}.notice.error{background:var(--danger-soft);color:var(--danger)}.brand{align-items:center;gap:10px;font-size:18px;font-weight:700;display:flex}.brand img{width:32px;height:32px}.sketch-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.sketch-item{background:var(--panel);border:1px solid var(--line);border-radius:12px;align-items:center;gap:8px;padding:6px 6px 6px 14px;display:flex}.sketch-item .open{text-align:left;background:0 0;border:0;flex:1;justify-content:flex-start;gap:2px;min-width:0;padding:6px 0;display:grid}.sketch-item .open b{text-overflow:ellipsis;font-size:17px;overflow:hidden}.sketch-item .open span{color:var(--muted);white-space:normal;font-size:14px}.chip{background:var(--line-soft);color:var(--muted);white-space:nowrap;border-radius:999px;align-items:center;gap:4px;padding:2px 10px;font-size:13px;font-weight:600;display:inline-flex}.chip.pending{background:var(--warn-soft);color:#8a5a00}.chip.conflict,.chip.error{background:var(--danger-soft);color:var(--danger)}.chip.saved{color:var(--ok);background:#e3f5e9}.editor-shell{flex-direction:column;height:100%;display:flex}.topbar{top:env(safe-area-inset-top,0px);z-index:5;background:var(--panel);border-bottom:1px solid var(--line);padding-block:8px;padding-left:max(12px, env(safe-area-inset-left,0px));padding-right:max(12px, env(safe-area-inset-right,0px));flex-wrap:wrap;align-items:center;gap:8px;display:flex;position:sticky}.topbar .title{border-color:#0000;flex:160px;min-width:0;font-size:18px;font-weight:700}.topbar .title:hover{border-color:var(--line)}.topbar .spacer{flex:1}.editor{flex:1;grid-template-columns:minmax(0,1fr) 340px;min-height:0;display:grid}.editor-main{flex-direction:column;gap:12px;min-width:0;min-height:0;padding:10px 12px 32px;display:flex;overflow:auto}.swatch{background:#e5e7eb;border:1.5px solid #374151;border-radius:3px;flex:none;width:28px;height:20px}.swatch.half{width:16px}.swatch.long{width:34px;height:8px}.swatch.area{background:repeating-linear-gradient(45deg,#d6dbe1 0 4px,#fff 4px 8px)}.swatch.free{background:#fff;border-style:dashed}.canvas-area{flex-direction:column;gap:8px;min-width:0;display:flex}.canvas-scroll{border:1px solid var(--line-soft);background:#f7f9fb;border-radius:12px;flex:1;min-height:260px;position:relative;overflow:auto}.canvas-scroll svg{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;display:block}.picker{z-index:3;background:var(--panel);border:1px solid var(--line);border-radius:12px;gap:4px;width:184px;padding:6px;display:grid;position:absolute;box-shadow:0 8px 24px #111a242e}.picker button{text-align:left;border-color:#0000;justify-content:flex-start;gap:10px;min-height:48px}.picker button:hover,.picker button:focus-visible{background:var(--accent-soft)}.picker small{color:var(--muted);font-size:12px;display:block}.block-tools{z-index:2;color:#fff;background:#111a24;border-radius:12px;gap:6px;width:300px;padding:8px;display:grid;position:absolute;box-shadow:0 6px 18px #111a2440}.block-tools-name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;overflow:hidden}.block-tools-row{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.block-tools-row button{color:#fff;background:#24313f;border-color:#24313f;min-height:40px;padding:0 6px;font-size:14px}.block-tools-row button.danger{color:#ffb4b4;border-color:#24313f}.sheet-backdrop{z-index:20;background:#111a2459;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.sheet{background:var(--panel);border-radius:16px;gap:12px;width:min(520px,100%);max-height:100%;padding:16px;display:grid;overflow:auto;box-shadow:0 16px 40px #111a244d}.sheet-head{justify-content:space-between;align-items:center;gap:8px;font-size:18px;display:flex}.sheet.viewer img{object-fit:contain;background:#000;border-radius:10px;width:100%;max-height:70vh}.kind-choices{flex-wrap:wrap;gap:6px;display:flex}.kind-choices button{gap:8px;padding:0 10px;font-size:15px}.kind-choices button[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent-soft);font-weight:600}.goods-space{gap:8px;display:grid}.goods-space+.goods-space{border-top:1px solid var(--line-soft);padding-top:12px}.goods-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.goods-head .ghost{color:var(--accent);font-weight:600}.goods-list{gap:6px;margin:0;padding:0;list-style:none;display:grid}.goods-row{border:1px solid var(--line-soft);border-radius:10px;align-items:center;gap:6px;padding:4px;display:flex}.goods-row.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.goods-row>button:not(.goods-open){flex:none;min-height:40px;padding:0 10px}.goods-open{text-align:left;white-space:normal;background:0 0;border:0;flex:1;justify-content:flex-start;min-width:0;padding:4px 6px}.goods-open>span:last-child{min-width:0;display:grid}.goods-open small{color:var(--muted);font-size:13px}.goods-open .goods-note{font-style:italic}.add-photo{border:1px solid var(--accent);min-height:44px;color:var(--accent);cursor:pointer;border-radius:10px;align-items:center;padding:0 14px;font-size:15px;font-weight:600;display:inline-flex}.add-photo.disabled{opacity:.5;cursor:default}.add-photo input{opacity:0;width:1px;height:1px;position:absolute}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;display:grid}.photo{aspect-ratio:1;background:var(--line-soft);max-width:100%;color:var(--muted);border-radius:10px;padding:0;font-size:13px;position:relative;overflow:hidden}.photo img{object-fit:cover;width:100%;height:100%}.photo .chip{font-size:11px;position:absolute;bottom:4px;left:4px}.canvas-tools{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;display:flex}.side{background:var(--panel);border-left:1px solid var(--line);flex-direction:column;gap:16px;padding:12px 14px;display:flex;overflow:auto}.side section{gap:10px;display:grid}table.summary{border-collapse:collapse;width:100%;font-size:15px}table.summary td,table.summary th{border-bottom:1px solid var(--line-soft);text-align:left;padding:7px 4px}table.summary th{color:var(--muted);font-size:12px;font-weight:600}table.summary .num{text-align:right;font-variant-numeric:tabular-nums}.dot{vertical-align:-1px;border:1px solid #00000026;border-radius:3px;width:12px;height:12px;margin-right:8px;display:inline-block}.fill{color:var(--muted);gap:4px;font-size:14px;display:grid}.fill b{color:var(--ink)}.bar{background:var(--line-soft);border-radius:4px;height:8px;overflow:hidden}.bar i{background:var(--accent);height:100%;display:block}.bar i.over{background:var(--danger)}.size-inputs{grid-template-columns:1fr 1fr;gap:8px;display:grid}.actions{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.dialog{border:1px solid var(--line);background:var(--panel);border-radius:14px;gap:10px;padding:14px;display:grid}@media (max-width:1000px){.editor-shell{height:auto;min-height:100%}.editor{grid-template-columns:minmax(0,1fr)}.topbar .title{flex-basis:calc(100% - 130px)}.editor-main{padding-left:max(12px, env(safe-area-inset-left,0px));padding-right:max(12px, env(safe-area-inset-right,0px));overflow:visible}.sheet-backdrop{align-items:flex-end;padding:0}.sheet{max-height:88vh;padding-bottom:max(16px, env(safe-area-inset-bottom,0px));border-radius:16px 16px 0 0}.canvas-scroll{flex:none;min-height:0}.side{border-left:0;border-top:1px solid var(--line);padding-left:max(14px, env(safe-area-inset-left,0px));padding-right:max(14px, env(safe-area-inset-right,0px))}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
