:root{--bg:#0a0d12;--panel:#11171f;--panel2:#171f29;--line:#2a3441;--text:#f4f7fa;--muted:#98a7b8;--mint:#5ee1b4;--pink:#ff4f81;--shadow:0 24px 70px rgba(0,0,0,.35)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% -10%,#17352f 0,transparent 32rem),var(--bg);color:var(--text);font:16px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input{font:inherit}button{cursor:pointer}.topbar{height:64px;padding:0 clamp(18px,4vw,56px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(10,13,18,.9);position:sticky;top:0;z-index:20;backdrop-filter:blur(14px)}.brand{display:flex;gap:11px;align-items:center;color:var(--text);font-weight:800;text-decoration:none}.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:var(--mint);color:#07110e;border-radius:9px;transform:rotate(-4deg)}.privacy{margin:0;color:#c7d0d9;font-size:.875rem}.privacy span{color:var(--mint);margin-right:7px}main{width:min(1480px,100%);margin:auto;padding:28px clamp(16px,3.5vw,52px) 64px}.tool-shell{background:var(--panel);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);overflow:hidden}.tool-heading{display:flex;align-items:end;justify-content:space-between;padding:24px 28px 20px;border-bottom:1px solid var(--line)}.eyebrow{color:var(--mint);font-size:.75rem;letter-spacing:.15em;font-weight:800;margin:0 0 5px}.tool-heading h1,.section-heading h2{font-size:clamp(1.65rem,3vw,2.4rem);line-height:1.1;margin:0;letter-spacing:-.04em}.history-actions{display:flex;gap:8px}.quiet,.secondary{border:1px solid var(--line);color:var(--text);background:var(--panel2);border-radius:10px;padding:10px 14px}.quiet:disabled{opacity:.4;cursor:not-allowed}.workspace{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);min-height:650px}.controls{padding:22px;border-right:1px solid var(--line);overflow:auto}.controls fieldset{border:0;padding:0 0 20px;margin:0 0 20px;border-bottom:1px solid var(--line)}.controls fieldset:last-child{border-bottom:0}.controls legend{font-weight:800;margin-bottom:12px}.template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.template-card{min-height:100px;padding:10px 6px;background:#0d1218;border:1px solid var(--line);color:var(--text);border-radius:12px;display:flex;flex-direction:column;align-items:center;gap:3px}.template-card.active{border-color:var(--mint);box-shadow:inset 0 0 0 1px var(--mint);background:#10231f}.template-card small{color:var(--muted);font-size:.68rem}.mini-shirt,.mini-pants,.mini-tee{display:block;width:28px;height:25px;background:var(--mint);clip-path:polygon(25% 0,40% 10%,60% 10%,75% 0,100% 25%,83% 45%,74% 35%,74% 100%,26% 100%,26% 35%,17% 45%,0 25%)}.mini-pants{clip-path:polygon(14% 0,86% 0,100% 100%,58% 100%,50% 45%,42% 100%,0 100%)}.mini-tee{clip-path:none;border-radius:5px;display:grid;place-items:center;color:#07110e;font-weight:900}.upload{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border:1px dashed #557083;background:#0d1218;border-radius:12px;cursor:pointer}.upload span{font-weight:800}.upload small{color:var(--muted)}#imageUpload{position:absolute;left:-9999px}.range-row{display:flex;justify-content:space-between;margin:14px 0 5px;color:#d6dde5;font-size:.875rem}input[type=range]{width:100%;accent-color:var(--mint)}.inline-controls{display:grid;grid-template-columns:42px auto 1fr;gap:10px;align-items:center;margin-top:8px}.inline-controls input[type=color]{width:42px;height:38px;padding:2px;border:1px solid var(--line);background:var(--panel2);border-radius:8px}.inline-controls label{color:var(--muted);font-size:.875rem}.hint{color:var(--muted);font-size:.78rem;margin:8px 0 0}.segmented{display:grid;grid-template-columns:repeat(3,1fr);background:#0d1218;border:1px solid var(--line);padding:4px;border-radius:11px}.mode{border:0;background:transparent;color:var(--muted);padding:9px 5px;border-radius:7px}.mode.active{background:var(--mint);color:#07110e;font-weight:800}.text-row{display:flex;gap:8px}.text-row input{min-width:0;flex:1;background:#0d1218;border:1px solid var(--line);color:var(--text);padding:10px;border-radius:9px}.text-row button{border:0;background:var(--mint);font-weight:800;border-radius:9px;padding:0 16px}.canvas-panel{padding:22px 26px 26px;display:flex;flex-direction:column;align-items:center;background:linear-gradient(145deg,#101720,#0b1016)}.canvas-meta{width:min(100%,720px);display:flex;justify-content:space-between;color:var(--muted);font-size:.85rem;margin-bottom:9px}.canvas-wrap{position:relative;width:min(100%,720px);aspect-ratio:585/559;background-image:linear-gradient(45deg,#18212b 25%,transparent 25%),linear-gradient(-45deg,#18212b 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#18212b 75%),linear-gradient(-45deg,transparent 75%,#18212b 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0;border:1px solid #374352;border-radius:8px;overflow:hidden;touch-action:none}canvas{position:absolute;inset:0;width:100%;height:100%}#artCanvas{z-index:2}.guide-toggle{width:min(100%,720px);margin:10px 0;color:var(--muted);font-size:.82rem}.guide-toggle input{accent-color:var(--mint)}.guide-toggle span{opacity:.72}.export-actions{width:min(100%,720px);display:grid;grid-template-columns:1.5fr 1fr;gap:10px;margin-top:auto;padding-top:14px}.primary,.secondary{min-height:48px;font-weight:800}.primary{background:var(--mint);color:#07110e;border:0;border-radius:11px}.secondary{background:transparent}.status{width:min(100%,720px);min-height:24px;margin:9px 0 0;color:var(--muted);font-size:.82rem}.facts,.faq{margin-top:48px}.section-heading{margin-bottom:20px}.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.fact-grid article{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px}.fact-number{color:var(--mint);font-weight:900}.fact-grid h3{margin:30px 0 8px;font-size:1.15rem}.fact-grid p,.source-note,.faq p{color:#b5c0cb}.source-note{font-size:.9rem}.source-note a{color:var(--mint)}.faq{max-width:920px}.faq details{border-top:1px solid var(--line);padding:16px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{font-weight:750;cursor:pointer}.faq p{margin:9px 0 0}footer{border-top:1px solid var(--line);padding:24px clamp(18px,4vw,56px);display:flex;justify-content:space-between;color:var(--muted);font-size:.85rem}
@media(max-width:850px){.topbar{height:auto;min-height:60px;gap:12px}.privacy{max-width:280px}.workspace{grid-template-columns:1fr}.controls{border-right:0;border-bottom:1px solid var(--line);overflow:visible}.canvas-panel{min-height:600px}.fact-grid{grid-template-columns:1fr}.tool-heading{align-items:flex-start;gap:16px}.history-actions{flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:560px){main{padding:12px 10px 44px}.topbar{padding:10px 14px;align-items:flex-start;position:static}.brand span:last-child{font-size:.88rem}.privacy{font-size:.72rem;max-width:170px}.tool-shell{border-radius:14px}.tool-heading{padding:18px;display:block}.history-actions{margin-top:14px;justify-content:flex-start}.controls{padding:18px}.template-grid{gap:6px}.template-card{min-height:92px;font-size:.78rem}.template-card small{font-size:.62rem}.canvas-panel{padding:16px 10px 20px;min-height:490px}.export-actions{grid-template-columns:1fr}.primary,.secondary{min-height:52px}.facts,.faq{margin-top:38px}.fact-grid article{padding:18px}.fact-grid h3{margin-top:18px}footer{display:block;padding:20px 14px}footer span{display:block;margin:4px 0}}