:root{--ink:#252b26;--red:#b83227;--muted:#85877f;--line:#e4e4db}*{box-sizing:border-box}body{margin:0;background:#f6f6ef;color:var(--ink);font-family:Inter,"Yu Gothic","Microsoft YaHei",sans-serif;font-size:14px}header{height:92px;max-width:1320px;margin:auto;padding:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;font-family:serif;font-size:25px;font-weight:700;letter-spacing:3px}.brandmark{display:grid;place-items:center;border:2px solid var(--red);color:var(--red);width:42px;height:45px;border-radius:3px;transform:rotate(-5deg);font-size:28px}.brand small{display:block;font:9px sans-serif;letter-spacing:2px;margin-top:5px}.header-note{color:#74786e;font-size:12px}.dot,.live-dot{display:inline-block;width:6px;height:6px;background:#748b65;border-radius:50%;margin:0 8px}main{max-width:1224px;margin:auto;padding:0 24px}.intro{padding:46px 0 36px}.eyebrow{font-size:10px;letter-spacing:2px;color:#92978c}h1{font-family:"Yu Mincho","SimSun",serif;font-size:42px;font-weight:500;letter-spacing:3px;margin:16px 0}h1 span{color:var(--red)}.intro p{color:#85897e;font-size:13px;line-height:1.8}.workspace{display:grid;grid-template-columns:360px 1fr;background:#fffef9;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 8px 30px #3c422808}.controls{padding:27px 28px;border-right:1px solid var(--line)}.section-title{display:flex;align-items:center;gap:10px;margin-bottom:20px}.section-title>span{font-size:10px;color:var(--red);border:1px solid #e8d9cd;border-radius:50%;padding:5px}.section-title h2{font-size:14px;font-weight:600;letter-spacing:1px;margin:0}.second{margin-top:28px}label{display:block;font-size:12px;margin-bottom:9px;color:#60695b}label small{font-size:10px;color:#9a9c91;margin-left:5px}textarea,input:not([type]),select{width:100%;border:1px solid #dddfd4;background:#fafaf5;border-radius:6px;padding:12px;color:var(--ink);font-family:inherit;font-size:13px;outline:none}textarea{resize:vertical;min-height:68px;max-height:150px;font-size:16px;line-height:1.6}textarea:focus,input:focus,select:focus{border-color:#b2a48b;outline:2px solid #b8322715}.help{display:flex;justify-content:space-between;font-size:10px;color:#999c91;margin:8px 0 18px}button{cursor:pointer;font-family:inherit}.styles{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.style{border:1px solid var(--line);border-radius:6px;background:#fffef9;padding:14px 3px 12px;color:#636d5d}.style.selected{border-color:var(--red);background:#fcf2eb;box-shadow:inset 0 0 0 1px #b8322710}.mini{display:flex;align-items:center;justify-content:center;height:36px;width:36px;margin:0 auto 12px;border:2px solid var(--red);font:11px serif;color:var(--red);font-style:normal;line-height:1.2}.mini.round{border-radius:50%;font-size:9px}.mini.oval{border-radius:50%;width:25px;font-size:11px;writing-mode:vertical-rl}.style strong,.style small{display:block}.style strong{font-size:12px}.style small{font-size:9px;margin-top:5px;color:#989b91}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}select{padding:10px 5px;font-size:11px}.color-row{display:flex;align-items:center;justify-content:space-between;margin:22px 0}.color-row label{margin:0}.swatches{display:flex;align-items:center;gap:9px}.swatch{border:3px solid #fff;width:23px;height:23px;background:var(--swatch);border-radius:50%;padding:0}.swatch.active{outline:1px solid #a9ac9d}input[type=color]{width:24px;height:25px;border:0;background:transparent;padding:0;cursor:pointer}.range-label{display:flex;justify-content:space-between;margin-top:19px}output{color:#85897c;font-size:11px}input[type=range]{width:100%;accent-color:var(--red);height:5px;cursor:pointer}.switch-row{display:flex;justify-content:space-between;align-items:center;margin-top:22px}.switch-row label{margin:0}input[type=checkbox]{accent-color:var(--red);width:16px;height:16px}.reset{background:none;border:0;color:#93998b;padding:0;margin-top:25px;font-size:11px}.preview{padding:26px 30px;min-width:0}.preview-head{display:flex;justify-content:space-between;align-items:center;font-size:12px}.preview-head small{color:#969b8e;font-size:9px;margin-left:10px;letter-spacing:1px}.live-dot{margin-left:0}.preview-head button{border:1px solid var(--line);background:#fffef9;border-radius:5px;padding:7px 10px;font-size:10px;color:#7e8578}.stage{height:480px;margin:20px 0 23px;border:1px solid #e8e8e0;border-radius:7px;position:relative;display:flex;align-items:center;justify-content:center;background:#f1f1e9}.stage.checker{background-color:#fcfcf8;background-image:conic-gradient(#e9eae3 25%,transparent 0 50%,#e9eae3 0 75%,transparent 0);background-size:20px 20px}canvas{width:340px;height:340px;max-width:85%;object-fit:contain;filter:drop-shadow(0 3px 1px #612b1a04)}.stage-note{position:absolute;bottom:22px;font-size:10px;letter-spacing:2px;color:#a0a593}.preview-bottom{display:flex;justify-content:space-between;align-items:center;gap:14px}.preview-bottom strong{font-size:13px;font-weight:500}.preview-bottom p{color:#959b8e;font-size:10px;margin:7px 0}.preview-bottom button{background:var(--red);border:0;border-radius:5px;color:white;padding:15px 23px;font-size:12px;box-shadow:0 3px 9px #b8322720}.preview-bottom button:hover{background:#962a22}.tips{display:flex;align-items:center;gap:14px;margin-top:28px;padding-top:23px;border-top:1px solid var(--line)}.tips>span{font:27px serif;color:#b5b9aa}.tips strong{font-size:11px;font-weight:500;color:#777f6d}.tips p{font-size:10px;color:#9ca18f;line-height:1.8;margin:5px 0}#status{font-size:11px;color:var(--red);margin-top:12px;min-height:16px}footer{display:flex;justify-content:space-between;margin:30px 0;color:#9b9f92;font-size:9px;letter-spacing:1px}button:focus-visible{outline:2px solid var(--red);outline-offset:3px}@media(min-width:1500px){.intro{padding-top:60px}.stage{height:510px}}@media(max-width:850px){header{padding:0 24px;height:75px}.header-note{font-size:10px}.workspace{grid-template-columns:300px 1fr}.controls{padding:23px 18px}.preview{padding:23px 18px}.stage{height:430px}canvas{width:280px;height:280px}.preview-bottom{align-items:stretch;flex-direction:column}.preview-head small{display:none}h1{font-size:36px}}@media(max-width:640px){main{padding:0 16px}.header-note{display:none}.intro{padding:30px 0 22px}h1{font-size:31px}.workspace{display:flex;flex-direction:column}.controls{border-right:0;border-bottom:1px solid var(--line);padding:24px}.preview{padding:22px}.stage{height:360px}canvas{width:280px;height:280px}.preview-bottom{flex-direction:row;align-items:center}.preview-bottom button{padding:14px 12px}footer{gap:12px;line-height:1.7}footer span:last-child{display:none}}

/* Shared iGenTrade identity */
.brand{font-family:Inter,"Yu Gothic","Microsoft YaHei",sans-serif;font-size:23px;letter-spacing:.3px}.brand small{font-size:9px;letter-spacing:1px}.header-note{max-width:380px;text-align:right;line-height:1.8;color:#5b6475}.tool-nav{margin-bottom:24px;font-size:11px}.tool-nav a,.site-foot a{color:#0b6e4f;text-decoration:none}.tool-nav a:hover,.site-foot a:hover{text-decoration:underline}.site-foot{display:block;line-height:1.8;letter-spacing:0;font-size:11px;color:#5b6475;padding:4px 0 16px}.site-foot p{margin:8px 0}@media(max-width:850px){.header-note{max-width:230px;font-size:10px}}@media(max-width:640px){header{height:auto;min-height:105px;align-items:flex-start;flex-direction:column;justify-content:center;gap:12px;padding:17px 24px}.header-note{display:block;max-width:none;text-align:left;font-size:9px}.brand{font-size:21px}.brand small{font-size:8px}.tool-nav{margin-bottom:20px}.site-foot{font-size:10px}}

.font-help{font-size:10px;color:#7e8578;line-height:1.7;margin:12px 0}.font-credit{font-size:10px}.font-help[hidden]{display:none}

.styles{grid-template-columns:repeat(2,minmax(0,1fr))}#subtitle:disabled{opacity:.5;cursor:not-allowed}
