:root{--ink:#302e2a;--muted:#817c72;--line:#e6e0d5;--paper:#fffdf9;--accent:#a34735;--soft:#f2ece2}*{box-sizing:border-box}body{margin:0;background:#f8f5ef;color:var(--ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);padding:10px 15px;min-height:42px}button:hover{border-color:#b6a28d}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}input,textarea,select{width:100%;border:1px solid var(--line);background:#fff;border-radius:9px;padding:11px 12px;color:var(--ink);outline:none;min-height:44px}textarea{resize:vertical;line-height:1.65}input:focus,textarea:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid #c98668;outline-offset:2px}input::placeholder,textarea::placeholder{color:#aaa397}label{display:block;font-size:13px;font-weight:550;margin:14px 0}label input,label textarea,label select{display:block;margin-top:7px;font-weight:400}h1,h2,h3,p{margin:0}h2{font-size:18px}h3{font-size:15px}.topbar{height:76px;padding:0 5%;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;background:var(--paper)}.brand{display:flex;gap:11px;align-items:center}.brand>span{display:grid;place-items:center;width:36px;height:40px;background:var(--accent);color:white;border-radius:7px;font:24px Georgia,serif}.brand b{font-size:16px}.brand small{margin-left:13px;border-left:1px solid var(--line);padding-left:13px;font-size:12px;font-weight:400;color:var(--muted)}nav{display:flex;align-items:center;gap:21px}nav button{border:0;background:none;padding:8px}nav a{font-size:13px;color:var(--muted)}main{display:grid;grid-template-columns:minmax(380px,480px) minmax(400px,1fr);max-width:1480px;margin:auto;align-items:start}.editor{padding:36px 36px 25px;border-right:1px solid var(--line);background:var(--paper)}.eyebrow{color:var(--accent);font-size:11px;letter-spacing:2px;font-weight:600}.intro h1{font-size:26px;line-height:1.5;margin:10px 0;font-family:"Songti SC","Noto Serif CJK SC",serif}.intro p{color:var(--muted);font-size:13px}.text-btn{color:var(--accent);padding:7px 0;border:0;min-height:32px;background:none;font-size:12px}.intro .text-btn{margin-top:12px}.draft-line{display:flex;gap:14px;align-items:center;border-bottom:1px solid var(--line);padding:12px 0;margin-top:18px;color:var(--muted);font-size:11px}.draft-line span{flex:1}.form-section{padding:26px 0;border-bottom:1px solid var(--line)}.section-heading{display:flex;align-items:center;gap:12px;margin-bottom:13px}.section-heading>span:first-child,.section-num{font-size:12px;color:var(--accent);font-family:Georgia,serif}.section-heading h2{font-size:16px}.section-heading .count{margin-left:auto;font-size:11px;color:var(--muted)}.row{display:flex;gap:12px}.row>*{flex:1;min-width:0}.hint{font-size:12px;color:var(--muted);font-weight:400;margin:8px 0;line-height:1.7}.optional{padding:0}summary{list-style:none;cursor:pointer;display:flex;gap:12px;padding:22px 0;font-size:15px;font-weight:600;align-items:center}summary::-webkit-details-marker{display:none}summary:after{content:'＋';margin-left:auto;color:var(--muted)}details[open] summary:after{content:'－'}.optional-tag{font-size:10px;font-weight:400;color:#9c9486;background:var(--soft);border-radius:4px;padding:2px 6px}.details-content{padding-bottom:12px}.product-card{border:1px solid var(--line);border-radius:12px;padding:16px;margin:16px 0;background:#fff}.product-head{display:flex;align-items:center;gap:8px}.product-head>b{flex:1;font-size:13px}.product-head button{font-size:12px;padding:4px 8px;min-height:34px}.product-head .remove{color:var(--accent)}.product-picture{display:flex;gap:13px;align-items:center;margin:15px 0}.upload-button{width:84px;height:106px;flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;overflow:hidden;border-style:dashed;background:#f5f1e9;color:#9a8b74;font-size:22px}.upload-button img{width:100%;height:100%;object-fit:contain}.picture-options{display:flex;flex-direction:column;align-items:flex-start}.picture-options .hint{margin:0}.picture-options button{border:0;background:none;color:var(--accent);padding:6px 0;font-size:12px;min-height:32px}.product-card label{font-size:12px;margin:11px 0}.product-card .row{gap:8px}.add-product{width:100%;border-style:dashed;background:#faf6ee;color:var(--accent)}.themes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.themes button{padding:7px 4px;font-size:10px;min-width:0}.themes i{display:grid;place-items:center;height:58px;background:var(--paper);color:var(--swatch);border-radius:5px;margin-bottom:6px;font:25px Georgia,serif}.themes button[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.privacy{font-size:11px;color:var(--muted);padding-top:25px}.preview{position:sticky;top:0;height:calc(100dvh - 76px);padding:32px 40px 14px;display:flex;flex-direction:column;min-height:500px}.preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.preview-header h2{font-size:22px;margin-top:5px;font-family:"Songti SC",serif}.preview-header>span{font-size:11px;color:var(--muted)}.view-tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:16px;gap:20px}.view-tabs button{border:0;background:none;border-radius:0;font-size:12px;padding:10px 3px;color:var(--muted)}.view-tabs button[aria-pressed=true]{border-bottom:2px solid var(--accent);color:var(--accent);font-weight:600}.preview-scroll{flex:1;overflow:auto;min-height:0;border-radius:12px;background:#eae5da;padding:24px}.preview-scroll canvas{display:block;width:100%;height:auto;max-width:530px;margin:0 auto 18px;box-shadow:0 8px 22px #443b2518}.page-label{text-align:center;font-size:11px;color:var(--muted);margin:18px 0 8px}.preview-actions{display:flex;gap:10px;margin-top:18px}.preview-actions .primary{flex:1}.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.primary:hover{background:#913c2c;border-color:#913c2c}.preview-note{font-size:11px;color:var(--muted);text-align:center;margin-top:10px}#empty-preview{text-align:center;padding:20px 12px}#empty-preview p{font-size:12px;color:var(--muted);margin-top:7px}.empty-art{width:65%;max-width:265px;aspect-ratio:3/4;background:#fffcf5;box-shadow:0 8px 25px #443b2520;margin:5px auto 30px;display:flex;flex-direction:column;justify-content:center;position:relative;padding:28px;border:10px solid #fdfaf4}.empty-art:before{content:'';position:absolute;inset:6px;border:1px solid #ba98746b}.empty-art span{font:28px/1.7 "Songti SC",serif;color:#755b40}.empty-art i{font-style:normal;font-size:10px;letter-spacing:3px;color:#a28f77;margin-top:25px}.mobile-bar,.preview-close{display:none}dialog{border:1px solid var(--line);border-radius:18px;background:var(--paper);padding:25px;width:calc(100% - 30px);max-width:520px;max-height:90dvh;color:var(--ink);overflow:auto}dialog::backdrop{background:#231c1766;backdrop-filter:blur(4px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.dialog-head button{font-size:24px;background:none;border:0;padding:0 8px}.draft-item{width:100%;text-align:left;margin-top:10px;display:flex;justify-content:space-between;gap:15px}.draft-item small{color:var(--muted);font-size:10px}.type-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.type-grid button{font-size:26px;color:var(--accent);padding:20px 8px}.type-grid b,.type-grid small{display:block}.type-grid b{font-size:14px;color:var(--ink)}.type-grid small{font-size:10px;color:var(--muted);font-weight:400}.export-item img{width:100%;max-height:58dvh;object-fit:contain;display:block;margin:18px auto 8px;border:1px solid var(--line)}.export-item a{display:block;text-align:center;background:var(--accent);color:white;border-radius:10px;padding:12px}.toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:#302e2a;color:#fff;font-size:13px;z-index:20;padding:12px 20px;border-radius:10px;max-width:90%;box-shadow:0 4px 20px #0002}.toast[hidden]{display:none}
@media(max-width:800px){.topbar{height:62px;padding:0 16px}.brand b{font-size:14px}.brand small{display:none}nav{gap:12px}nav button,nav a{font-size:12px}main{display:block}.editor{padding:28px 20px 105px;border:0}.intro h1{font-size:24px}.preview{display:none}.preview.mobile-open{display:flex;position:fixed;inset:0;z-index:10;background:#f8f5ef;height:100dvh;min-height:0;padding:22px 18px max(12px,env(safe-area-inset-bottom))}.preview-scroll{padding:16px}.preview-header{margin-bottom:12px}.preview-actions{margin-top:12px}.preview-close{display:block;padding-top:9px}.mobile-bar{position:fixed;bottom:0;left:0;right:0;background:#fffdf9f5;backdrop-filter:blur(8px);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:12px 18px max(12px,env(safe-area-inset-bottom));z-index:5;gap:10px}.mobile-bar span{font-size:11px;color:var(--muted)}.mobile-bar button{font-size:13px}.themes i{height:60px}input,textarea,select{font-size:16px}.product-head button{padding:4px 7px}.draft-line{font-size:11px}.preview-scroll canvas{box-shadow:0 4px 14px #443b251c}}
@media(prefers-reduced-motion:no-preference){button{transition:background .15s,border-color .15s}.preview.mobile-open{animation:appear .2s ease}@keyframes appear{from{opacity:.5;transform:translateY(12px)}to{opacity:1;transform:none}}}

/* Header and frame controls */
.header-upload{padding:16px;background:#f7f3eb;border:1px solid var(--line);border-radius:12px;margin:18px 0 22px}.field-caption{font-size:13px;font-weight:550;margin-bottom:12px}.field-caption .optional-tag{margin-left:6px}.header-upload-button{display:flex;align-items:center;justify-content:center;width:100%;height:124px;background:#fffdf9;border:1px dashed #c9baaa;overflow:hidden;padding:8px;color:var(--accent)}.header-upload-button img{max-width:100%;max-height:100%;object-fit:contain}.header-upload [hidden]{display:none}.header-tools{display:flex;gap:20px;margin-top:5px}.header-upload .hint{font-size:11px}.header-upload label{margin-bottom:0}.header-upload input[type=range]{accent-color:var(--accent);padding:0;background:none;border:0;min-height:30px}.border-options{border:0;padding:0;margin:22px 0}.border-options legend{padding:0;margin-bottom:10px;font-size:13px;font-weight:550}.borders{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.borders button{padding:8px 6px;font-size:11px}.borders button[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.border-demo{display:block;position:relative;width:60px;height:64px;margin:0 auto 7px;background:#faf5ec;color:var(--accent)}.border-demo:after{content:'';position:absolute;left:18px;right:18px;top:23px;height:16px;border-top:2px solid #c0ab92;border-bottom:1px solid #d8cdbf}.b-none{border:1px solid #eee6da}.b-line{border:1px solid currentColor}.b-double{border:3px double currentColor}.b-stamp{border:2px dashed currentColor}.b-corners{background:linear-gradient(currentColor,currentColor) 0 0/14px 2px,linear-gradient(currentColor,currentColor) 0 0/2px 14px,linear-gradient(currentColor,currentColor) 100% 0/14px 2px,linear-gradient(currentColor,currentColor) 100% 0/2px 14px,linear-gradient(currentColor,currentColor) 0 100%/14px 2px,linear-gradient(currentColor,currentColor) 0 100%/2px 14px,linear-gradient(currentColor,currentColor) 100% 100%/14px 2px,linear-gradient(currentColor,currentColor) 100% 100%/2px 14px,#faf5ec;background-repeat:no-repeat}.b-classic{border:3px double currentColor;border-radius:9px 0 9px 0}.b-classic:before{content:'◆';position:absolute;left:0;right:0;text-align:center;font-size:9px;top:2px}.border-color-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:8px}.border-color-row[hidden]{display:none}.border-color-row label{font-size:12px;margin:0}.border-color-row input{width:38px;height:34px;min-height:34px;padding:3px}.border-color-row .hint{font-size:10px}.border-color-row .text-btn{font-size:11px}