:root{--ink:#17201d;--muted:#6b746e;--paper:#f2f0e9;--surface:#fffefa;--line:#dcded8;--moss:#1f6252;--lime:#d9ee7c;--clay:#dc6b4d;--blue:#b8d8e1;--shadow:0 18px 50px rgba(23,32,29,.08)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.nav{height:76px;max-width:1440px;margin:auto;padding:0 42px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:42px}.logo{display:flex;align-items:center;gap:11px;font-weight:850;letter-spacing:-.03em}.logo span:last-child{display:flex;flex-direction:column}.logo small{font-weight:500;font-size:10px;color:var(--muted);letter-spacing:.16em}.logo-mark{display:grid!important;place-items:center;width:38px;height:38px;background:var(--ink);color:var(--lime);border-radius:11px;font:900 13px/1 monospace;letter-spacing:-1px}.nav nav{display:flex;gap:26px;font-size:13px;font-weight:700}.nav nav a:hover{color:var(--moss)}.local-badge{margin-left:auto;background:#dfece6;color:var(--moss);padding:8px 12px;border-radius:999px;font-size:12px;font-weight:750}.hero{max-width:1360px;margin:0 auto;padding:64px 42px 48px;display:grid;grid-template-columns:1.12fr .88fr;gap:70px;align-items:center}.eyebrow{font:800 11px/1.2 monospace;letter-spacing:.17em;color:var(--moss)}h1{font:750 clamp(44px,6vw,78px)/.98 Georgia,"Songti SC",serif;letter-spacing:-.045em;margin:16px 0 22px}h1 em{font-style:normal;color:var(--clay)}.hero p{max-width:650px;color:var(--muted);font-size:17px;line-height:1.75}.hero-points{display:flex;gap:20px;margin-top:28px;font-size:12px;font-weight:750}.hero-points span{display:flex;align-items:center;gap:5px}.hero-art{position:relative;padding:20px;min-height:360px;display:grid;place-items:center;background:var(--blue);border-radius:32px 8px 32px 8px;overflow:hidden}.hero-art:after{content:"";position:absolute;inset:16px;border:1px solid #17201d20;border-radius:22px 5px 22px 5px}.hero-art canvas{width:min(100%,420px);height:auto;image-rendering:pixelated;filter:drop-shadow(0 20px 20px #17332a25)}.art-note{position:absolute;right:28px;bottom:22px;background:#fffefa;padding:8px 11px;border-radius:8px;font:700 10px monospace;z-index:2}.studio{max-width:1440px;margin:auto;padding:24px 42px;display:grid;grid-template-columns:330px minmax(0,1fr);gap:18px}.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.sidebar{padding:20px}.section-title{display:flex;gap:12px;align-items:center;margin-bottom:14px}.section-title>span{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:var(--ink);color:var(--lime);font:700 11px monospace}.section-title div{display:flex;flex-direction:column;gap:2px}.section-title b{font-size:14px}.section-title small{color:var(--muted);font-size:10px}.section-title.compact{margin-bottom:16px}.dropzone{display:flex;flex-direction:column;align-items:center;padding:24px 16px;border:1.5px dashed #aeb8b1;background:#f7f7f2;border-radius:14px;transition:.2s;outline:0}.dropzone.drag,.dropzone:focus{border-color:var(--moss);box-shadow:0 0 0 3px #1f625218}.upload-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#e4ebdf;font-size:22px;margin-bottom:10px}.dropzone b{font-size:13px}.dropzone span{font-size:10px;color:var(--muted);margin:4px 0 12px}.text-btn{border:0;background:transparent;color:var(--moss);font-size:12px;font-weight:800;text-decoration:underline}.sample-btn{width:100%;border:0;background:transparent;padding:12px;color:var(--muted);font-size:11px}.divider{height:1px;background:var(--line);margin:8px -20px 18px}.segmented{display:grid;grid-template-columns:repeat(3,1fr);background:#eceeea;border-radius:10px;padding:3px;margin-bottom:18px}.segmented button{border:0;background:transparent;padding:8px 4px;border-radius:8px;font-size:11px;font-weight:750;color:var(--muted)}.segmented button.active{background:#fff;box-shadow:0 2px 7px #23352c18;color:var(--ink)}.field{margin:12px 0}.field label{display:flex;justify-content:space-between;font-size:11px;font-weight:750;margin-bottom:7px}.field output{color:var(--moss);font-weight:800}.field select{width:100%;border:1px solid var(--line);background:#fff;padding:10px;border-radius:9px;font-size:11px;color:var(--ink)}input[type=range]{width:100%;accent-color:var(--moss)}.adjust-grid{display:grid;grid-template-columns:1fr;gap:0}.toggles{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.toggles label{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:6px}.toggles input{accent-color:var(--moss)}.primary{width:100%;border:0;background:var(--ink);color:#fff;border-radius:11px;padding:13px 15px;font-size:12px;font-weight:850;display:flex;justify-content:space-between}.primary:hover{background:var(--moss)}.workarea{min-width:0;overflow:hidden}.workbar{height:62px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 18px}.workbar>div:first-child{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center}.workbar b{font-size:12px}.workbar small{grid-column:2;color:var(--muted);font-size:9px}.status-dot{width:8px;height:8px;background:#aeb6b1;border-radius:50%;grid-row:1/3}.status-dot.live{background:#56a06f;box-shadow:0 0 0 4px #56a06f22}.zoom{display:flex;align-items:center;border:1px solid var(--line);border-radius:9px;overflow:hidden}.zoom button{border:0;background:#fff;width:30px;height:27px}.zoom span{min-width:48px;text-align:center;font:700 10px monospace}.canvas-stage{height:650px;overflow:auto;display:grid;place-items:center;padding:28px;background-color:#e8e7e0;background-image:linear-gradient(45deg,#deddd5 25%,transparent 25%),linear-gradient(-45deg,#deddd5 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#deddd5 75%),linear-gradient(-45deg,transparent 75%,#deddd5 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.empty-state{text-align:center;background:#f7f6f0dd;padding:42px;border:1px solid #fff;border-radius:20px;backdrop-filter:blur(8px)}.empty-pattern{font-size:44px;color:var(--clay)}.empty-state h2{font:700 22px Georgia,serif;margin:10px}.empty-state p{font-size:12px;color:var(--muted)}.outline-btn{border:1px solid var(--ink);background:transparent;border-radius:9px;padding:9px 15px;font-weight:750;font-size:11px}.canvas-stage canvas{background:#fff;max-width:none;image-rendering:pixelated;box-shadow:0 18px 45px #17201d25;transform-origin:center}.exportbar{min-height:70px;padding:12px 16px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.export-info{display:flex;flex-direction:column}.export-info b{font-size:12px}.export-info span{font-size:9px;color:var(--muted)}.export-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.export-actions button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 10px;font-size:10px;font-weight:750}.export-actions button.dark{background:var(--ink);color:#fff}.export-actions button:disabled{opacity:.4;cursor:not-allowed}.results{max-width:1440px;margin:auto;padding:0 42px 24px;display:grid;grid-template-columns:1.4fr .6fr;gap:18px}.result-card{padding:22px}.result-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.result-head h2{font:700 20px Georgia,serif;margin:6px 0 0}.pill{border:1px solid var(--line);padding:6px 9px;border-radius:999px;font-size:9px;color:var(--muted)}.palette-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:7px}.palette-row{display:grid;grid-template-columns:24px 22px 1fr auto;align-items:center;gap:7px;padding:7px;border:1px solid var(--line);border-radius:9px;font-size:9px}.color-chip{width:24px;height:24px;border-radius:7px;border:1px solid #0002}.symbol{font-size:15px;text-align:center}.palette-row b{display:block;font-size:10px}.palette-row small{color:var(--muted)}.palette-row strong{font:700 9px monospace}.muted,.fineprint{color:var(--muted);font-size:11px}.material-summary{display:grid;gap:10px}.material-summary div{display:flex;align-items:center;justify-content:space-between;background:#f5f5ef;border-radius:10px;padding:13px}.material-summary b{font-size:10px;color:var(--muted)}.material-summary strong{font:800 16px Georgia,serif}.fineprint{line-height:1.55;margin-top:14px}.features{max-width:1356px;margin:18px auto 70px;padding:0 42px;display:grid;grid-template-columns:repeat(3,1fr)}.features div{padding:30px;border-top:1px solid var(--ink)}.features div+div{border-left:1px solid var(--line)}.features span{font:700 11px monospace;color:var(--clay)}.features h3{font:700 18px Georgia,serif}.features p{font-size:12px;line-height:1.7;color:var(--muted)}footer{max-width:1356px;margin:auto;padding:32px 42px 45px;border-top:1px solid var(--line);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:30px}footer p{font-size:12px;color:var(--muted)}footer div{display:flex;gap:18px;font-size:11px;font-weight:700}footer>small{grid-column:1/-1;color:var(--muted);font-size:9px}.content-page{max-width:850px;margin:50px auto;padding:0 28px 70px}.content-page h1{font-size:52px}.content-page h2{font:700 25px Georgia,serif;margin-top:36px}.content-page p,.content-page li{color:var(--muted);line-height:1.8;font-size:14px}.content-page .callout{background:#e4eee9;border-left:4px solid var(--moss);padding:16px 18px;border-radius:0 12px 12px 0;color:var(--ink)}@media(max-width:980px){.hero{grid-template-columns:1fr}.hero-art{display:none}.studio{grid-template-columns:1fr}.results{grid-template-columns:1fr}.canvas-stage{height:560px}.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.sidebar .dropzone,.sidebar .sample-btn,.sidebar .divider,.sidebar .section-title,.sidebar .segmented,.sidebar .primary{grid-column:1/-1}.toggles{grid-column:1/-1}}@media(max-width:700px){.nav{padding:0 18px;height:66px}.nav nav{display:none}.hero,.studio,.results{padding-left:18px;padding-right:18px}.hero{padding-top:42px}.hero h1{font-size:46px}.hero-points{flex-wrap:wrap}.sidebar{display:block}.canvas-stage{height:430px;padding:15px}.exportbar{align-items:flex-start;flex-direction:column}.export-actions{justify-content:flex-start}.results{display:block}.result-card{margin-bottom:14px}.features{grid-template-columns:1fr;padding:0 18px}.features div+div{border-left:0}footer{grid-template-columns:1fr;padding:28px 18px}footer div{flex-wrap:wrap}}
@media print{body{background:#fff}.nav,.hero,.sidebar,.workbar,.exportbar,.results,.features,footer{display:none!important}.studio{display:block;padding:0}.workarea{border:0;box-shadow:none}.canvas-stage{height:auto;padding:0;background:#fff;overflow:visible}.canvas-stage canvas{max-width:100%;transform:none!important;box-shadow:none}.empty-state{display:none}@page{margin:10mm}}