/* Local system fonts keep the workspace usable without external requests. */
:root{font-family:'Noto Sans SC',sans-serif;color:#262536;background:#f7f8fb;font-size:14px;--surface:#fff;--bg:#f7f8fb;--line:#e9eaf1;--muted:#9393a5;--ink:#262536;--purple:#7760db;--tint:#f1edff}*{box-sizing:border-box}body{margin:0}body.dark{--surface:#20212b;--bg:#171820;--line:#333440;--muted:#a0a0b3;--ink:#eeeef7;--tint:#342c50;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}button,a,input,select,textarea{outline-offset:4px}button{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:9px 13px;transition:.18s}button:hover{border-color:#a995ef;background:var(--tint)}button:disabled{opacity:.45;cursor:not-allowed}svg{vertical-align:middle}header{height:76px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 36px;gap:55px;position:sticky;top:0;z-index:5}.brand{display:flex;align-items:center;gap:11px;font-size:21px;font-weight:700;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:35px;height:35px;background:#7862de;color:white;border-radius:11px;font-size:24px}.brand small{font-size:11px;color:var(--muted);letter-spacing:2px;font-weight:400;display:block}nav{display:flex;gap:30px;height:100%;align-items:center}nav button{height:100%;border:0;border-radius:0;background:transparent;color:var(--muted);padding:0 4px;position:relative}nav button.active{color:var(--purple);font-weight:600}nav button.active:after{content:'';height:3px;background:var(--purple);position:absolute;bottom:0;left:0;right:0}.header-right{margin-left:auto;display:flex;gap:14px;align-items:center}.quiet{color:var(--muted)}.primary{background:var(--purple);border-color:var(--purple);color:white}.primary:hover{background:#6950ce;color:white}.layout{max-width:1536px;margin:auto;padding:30px 36px}.breadcrumb{color:var(--muted);font-size:12px;margin-bottom:24px}.page-title{display:flex;align-items:center;gap:14px;margin-bottom:26px}.title-symbol{width:48px;height:48px;border-radius:13px;background:var(--tint);color:var(--purple);display:grid;place-items:center}.page-title h1{font-size:25px;letter-spacing:-.7px;margin:0 0 7px}.page-title p{margin:0;color:var(--muted);font-size:13px}.tag{background:#eeedf7;color:#8b7da9;border-radius:5px;padding:4px 8px;font-size:11px;margin-left:12px;vertical-align:middle}.workspace{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start}.config,.results{background:var(--surface);border:1px solid var(--line);border-radius:13px}.panel-title{padding:19px 22px;border-bottom:1px solid var(--line);font-weight:600;display:flex;justify-content:space-between}.config-inner{padding:21px}.field{margin-bottom:23px}.field label{display:block;font-weight:500;margin-bottom:11px;font-size:13px}.step{color:var(--purple);font-size:11px;background:var(--tint);border-radius:4px;padding:2px 5px;margin-right:7px}.chips{display:flex;flex-wrap:wrap;gap:7px}.chips button{font-size:12px;padding:7px 10px}.selected{color:var(--purple)!important;border-color:#a38ce8!important;background:var(--tint)!important}.style-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.style-options button{padding:12px 4px 8px;font-size:12px}.style-options svg{display:block;margin:0 auto 7px}.row{display:flex;gap:8px;align-items:center}.row>*{min-width:0}input,select,textarea{background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:7px;padding:9px 10px;width:100%}input[type=color]{padding:3px;width:35px;height:35px;flex-shrink:0}.swatches{display:flex;gap:10px;margin-bottom:12px}.swatches button{height:24px;width:24px;border-radius:50%;padding:0;border:3px solid var(--surface);outline:1px solid var(--line)}.swatches button.on{outline:2px solid var(--purple)}.hint{font-size:11px;color:var(--muted);margin:9px 0 0;line-height:1.7}.wide{width:100%;padding:12px}.config-foot{border-top:1px solid var(--line);padding:18px 21px}.results-head{padding:20px 24px 0}.tabs{display:flex;gap:27px;border-bottom:1px solid var(--line)}.tabs button{border:0;border-bottom:2px solid transparent;background:none;border-radius:0;padding:0 0 17px;color:var(--muted)}.tabs button.active{border-color:var(--purple);color:var(--ink);font-weight:600}.count{padding:2px 6px;border-radius:5px;background:var(--bg);font-size:11px;margin-left:5px}.results-tools{padding:20px 24px;display:flex;gap:12px;align-items:center}.search{position:relative;flex:1}.search input{padding-left:35px;background:var(--surface)}.search>span{position:absolute;left:11px;top:10px;color:var(--muted)}.filterbar{display:flex;align-items:center;padding:0 24px 18px;gap:9px;font-size:12px;color:var(--muted)}.filterbar button{border:0;background:transparent;padding:5px 10px;font-size:12px}.filterbar button.active{color:var(--purple);background:var(--tint)}.gallery-wrap{min-height:500px;padding:0 24px 24px}.gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}.icon-card{min-height:146px;border:1px solid var(--line);background:var(--surface);border-radius:10px;position:relative;text-align:center;transition:.2s;cursor:pointer}.icon-card:hover{border-color:#b5a3ea;box-shadow:0 5px 20px #7962df0d;transform:translateY(-2px)}.icon-card.checked{background:var(--tint);border-color:#b5a3ea}.icon-card .art{display:grid;place-items:center;height:91px;padding-top:10px}.icon-card .name{font-size:12px;font-weight:500}.icon-card .filename{font-size:10px;color:var(--muted);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 6px}.check{position:absolute;top:9px;left:9px;width:14px;height:14px;accent-color:var(--purple);margin:0;cursor:pointer}.card-more{position:absolute;top:3px;right:5px;border:0;background:transparent;padding:0 5px;color:var(--muted)}.selection-bar{border-top:1px solid var(--line);padding:16px 24px;display:flex;align-items:center;gap:12px;font-size:12px;background:var(--bg);border-radius:0 0 13px 13px}.selection-bar input{width:14px;accent-color:var(--purple)}.selection-bar .actions{margin-left:auto;display:flex;gap:9px}.selection-bar button{font-size:12px}.tip-strip{display:flex;gap:10px;padding:15px 19px;background:#f0edf9;color:#9486b4;border:1px solid #e9e2f8;border-radius:9px;margin-top:17px;font-size:12px;line-height:1.8}.dark .tip-strip{background:var(--tint);border-color:var(--line)}footer{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:30px;padding:0 3px}.empty{padding:95px 20px;text-align:center;color:var(--muted)}dialog{border:1px solid var(--line);border-radius:18px;background:var(--surface);color:var(--ink);width:430px;padding:27px;max-width:95vw}dialog::backdrop{background:#17132766;backdrop-filter:blur(4px)}dialog .close{float:right;border:0;padding:2px 8px;font-size:20px}dialog .large-preview{height:160px;background:var(--bg);border-radius:12px;display:grid;place-items:center;margin:18px 0}dialog h2{font-size:21px}dialog p{color:var(--muted);line-height:1.8;font-size:13px}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%) translateY(100px);background:#302943;color:white;border-radius:9px;padding:13px 22px;z-index:30;transition:.25s;box-shadow:0 8px 30px #0002}#toast.show{transform:translateX(-50%) translateY(0)}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.tool-card{padding:30px;border:1px solid var(--line);border-radius:14px;background:var(--surface);text-align:left}.tool-card h2{font-size:19px}.tool-card p{color:var(--muted);font-size:13px;line-height:1.8}.tool-icon{color:var(--purple);background:var(--tint);width:55px;height:55px;border-radius:13px;display:grid;place-items:center}.welcome{margin:30px 0}.welcome h1{font-size:32px}.welcome p{color:var(--muted)}@media(min-width:1450px){.gallery{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:1150px){.gallery{grid-template-columns:repeat(4,minmax(0,1fr))}header{gap:30px}.workspace{grid-template-columns:280px minmax(0,1fr)}}@media(max-width:850px){header{padding:0 18px;gap:18px}nav{gap:12px}.header-right .quiet{display:none}.layout{padding:24px 18px}.workspace{grid-template-columns:240px minmax(0,1fr);gap:15px}.gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.results-head,.results-tools{padding-left:16px;padding-right:16px}.gallery-wrap{padding:0 16px 16px}.selection-bar{flex-wrap:wrap}.selection-bar .actions{margin-left:0}}@media(max-width:650px){header{height:auto;min-height:72px;flex-wrap:wrap;padding-top:14px;gap:12px}.brand{font-size:18px}nav{order:3;width:100%;height:38px;justify-content:space-around}.header-right{gap:6px}.workspace{display:block}.config{margin-bottom:20px}.config-inner{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{margin:0}.field:last-child{grid-column:1/-1}.gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.page-title h1{font-size:22px}.results-tools{flex-wrap:wrap}.tool-grid{grid-template-columns:1fr}.filterbar{flex-wrap:wrap}footer{gap:16px;line-height:1.8}.tag{display:none}.tip-strip{margin-bottom:15px}}

/* Immersive Qing Icons workspace */
[hidden]{display:none!important}
:root{font-family:'Microsoft YaHei','PingFang SC',system-ui,sans-serif;--muted:#797a90}
.immersive-header{height:72px;gap:22px;padding:0 30px}
.immersive-header .brand{border:0;background:none;padding:4px 0;font-size:24px;letter-spacing:1px;gap:14px}
.brand-caret{font-size:18px;color:var(--muted);font-weight:400}.header-caption{font-size:13px;color:var(--muted);border-left:1px solid var(--line);padding-left:23px}
.header-right button{font-size:13px}.header-right #switch-tools,.header-right #theme{border-color:transparent;background:transparent}
.immersive-layout{max-width:none;padding:20px 24px;height:calc(100dvh - 72px)}
.workspace{height:100%;grid-template-columns:310px minmax(0,1fr);gap:20px;align-items:stretch}
.settings-pane{min-height:0}.config{height:100%;display:flex;flex-direction:column}.config-inner{overflow:auto;scrollbar-width:thin;flex:1;padding:20px}.config-foot{flex-shrink:0;padding:15px 20px}.panel-title{padding:18px 20px;align-items:center}
.field{margin-bottom:23px}.field label{font-size:14px}.hint{font-size:12px;line-height:1.7}.chips button{font-size:13px;padding:7px 12px}.chips{gap:7px}.text-button{border:0;background:none!important;padding:0;font-size:12px;color:var(--muted)}.text-button:hover{color:var(--purple)}
.custom-field{display:flex;gap:4px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:8px;margin-top:10px;padding:2px 5px}.custom-field input{border:0;background:transparent;font-size:12px;min-width:0}.custom-field input[type=color]{padding:3px;width:32px;height:32px;flex-shrink:0}.custom-field button{border:0;background:none;padding:3px 7px;font-size:18px;color:var(--muted)}.custom-active{border-color:#a38ce8;box-shadow:0 0 0 2px #9572e312;background:var(--tint)}.custom-field:focus-within{border-color:#a38ce8}.custom-field input:focus{outline:0}.custom-field:has([aria-invalid=true]){border-color:#d86776}.swatches{justify-content:space-between;gap:8px}.swatches button{width:25px;height:25px}
.style-options button{font-size:13px;padding:15px 4px 10px}.dimensions{display:grid;grid-template-columns:1fr 44px 1fr;align-items:end;gap:8px}.dimensions label{font-size:12px;color:var(--muted);margin:0}.dimensions input{margin-top:6px;color:var(--ink);font-size:14px}.dimensions #lock{height:39px;font-size:12px;padding:4px;border-color:#b6a7e3;background:var(--tint);color:var(--purple)}.dimensions #lock[aria-pressed=false]{background:var(--bg);color:var(--muted);border-color:var(--line)}
.advanced summary{cursor:pointer;color:var(--muted);font-size:13px;padding:2px 0 10px}.advanced input{font-size:12px}.results{display:flex;flex-direction:column;min-height:0;overflow:hidden}.results-head{padding:23px 26px 0}.tabs{gap:26px}.tabs button{font-size:14px}.results-tools{padding:17px 26px;font-size:12px;justify-content:space-between}.preview-note{color:var(--muted);font-size:12px}.gallery-wrap{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;padding:8px 26px 26px}.gallery{grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:14px}.gallery.is-empty{display:flex;align-items:center;justify-content:center;min-height:100%}.icon-card{min-height:162px;overflow:hidden}.icon-open{padding:8px 0 15px;border:0;background:transparent;display:block;width:100%;border-radius:9px}.icon-open:hover{background:transparent}.icon-open .art{height:91px;margin:4px 15px 10px;padding:0;border-radius:9px}.icon-open .name{display:block;font-size:13px}.icon-open .filename{display:block;font-size:11px;margin-top:6px}.check{z-index:2;left:11px;top:11px}.card-more{z-index:2;right:9px;top:5px}.dark-preview{background-color:#454958!important;background-image:linear-gradient(45deg,#ffffff06 25%,transparent 25%,transparent 75%,#ffffff06 75%),linear-gradient(45deg,#ffffff06 25%,transparent 25%,transparent 75%,#ffffff06 75%)!important;background-size:12px 12px!important;background-position:0 0,6px 6px!important}.selection-bar{border-radius:0;background:var(--surface);padding:16px 24px;flex-shrink:0}.selection-bar button{font-size:13px}.selection-bar .text-button{font-size:12px}.selection-bar .actions{margin-left:auto}
.empty-canvas{text-align:center;width:100%;padding:45px 20px 65px}.empty-canvas h2{font-size:22px;letter-spacing:.3px;font-weight:500;margin:13px 0 16px}.empty-canvas p{font-size:14px;color:var(--muted);line-height:1.95;margin:0}.empty-eyebrow{font-size:12px;color:#9c8abf;letter-spacing:2px}.sketch-composition{position:relative;width:280px;height:170px;margin:0 auto 29px}.sketch-card{position:absolute;border:1px solid #e2daef;background:var(--surface);border-radius:17px;display:grid;place-items:center;box-shadow:0 14px 45px #5f478b08}.sketch-one{width:86px;height:92px;left:15px;top:50px;transform:rotate(-16deg)}.sketch-two{width:110px;height:118px;left:85px;top:17px;z-index:1;transform:rotate(3deg);background:linear-gradient(150deg,var(--surface),var(--tint))}.sketch-three{width:86px;height:92px;right:8px;top:58px;transform:rotate(16deg)}.sketch-dot{position:absolute;border:1px solid #c7b9e5;border-radius:50%;width:7px;height:7px}.dot-one{left:32px;top:13px}.dot-two{right:16px;top:20px;width:4px;height:4px;background:#c7b9e5}.empty-steps{display:flex;justify-content:center;gap:15px;margin-top:36px;color:#aaa3b8;font-size:12px}.empty-steps i{font-style:normal;color:#d9d2e5}.empty-sketch{margin-bottom:30px}.purple{color:var(--purple)}.switch-list{display:grid;gap:10px}.switch-list>button,.switch-list>div{display:flex;flex-direction:column;text-align:left;padding:16px;gap:7px;border:1px solid var(--line);border-radius:9px}.switch-list span{font-size:12px;color:var(--muted)}.switch-list>div{opacity:.6}.welcome{margin-top:30px}.large-preview{overflow:hidden}
@media(min-width:1600px){.gallery{grid-template-columns:repeat(auto-fill,minmax(155px,1fr))}}
@media(max-width:1050px){.workspace{grid-template-columns:285px minmax(0,1fr);gap:16px}.immersive-layout{padding:16px}.tabs{gap:15px}.tabs button{font-size:13px}.results-head{padding:20px 18px 0}.gallery-wrap{padding:8px 18px 20px}.selection-bar{gap:8px;flex-wrap:wrap}.selection-bar .actions{margin-left:auto}.empty-canvas h2{font-size:20px}}
@media(max-width:700px){.immersive-header{padding:0 16px;gap:10px;min-height:66px;height:66px;flex-wrap:nowrap}.immersive-header .brand{font-size:21px;gap:7px}.header-caption{display:none}.header-right{gap:4px}.header-right button{font-size:12px;padding:8px}.header-right #switch-tools{display:none}.immersive-layout{height:auto;padding:14px}.workspace{display:block;height:auto}.settings-pane{margin-bottom:16px}.config{height:auto}.config-inner{display:grid;grid-template-columns:1fr 1fr;gap:20px;overflow:visible;padding:17px}.field{margin:0}.field:last-child{grid-column:auto}.advanced{grid-column:1/-1}.config-foot{padding:16px}.results{min-height:480px}.gallery-wrap{min-height:360px;overflow:visible}.gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.icon-card{min-height:145px}.icon-open .art{height:80px;margin:4px 8px 8px}.empty-canvas{padding:35px 8px}.empty-canvas h2{font-size:19px}.empty-canvas p{font-size:13px}.empty-steps{gap:10px;font-size:11px}.results-tools{flex-wrap:wrap;padding:15px 18px}.tabs{gap:17px}.count{font-size:10px;margin-left:2px}.swatches{gap:3px}.swatches button{width:20px;height:20px}.dimensions{grid-template-columns:1fr 35px 1fr;gap:4px}.dimensions input{padding:8px 5px}.custom-field{padding:2px}.custom-field input{padding:8px 4px}.style-options{gap:4px}.style-options button{font-size:12px}.chips button{padding:6px 8px;font-size:12px}.field label{font-size:13px}.selection-bar .actions{width:100%;justify-content:flex-end}.hint{font-size:12px}.tool-grid{grid-template-columns:1fr}}
@media(max-width:380px){.config-inner{grid-template-columns:1fr}.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.tabs{gap:12px}.tabs button{font-size:12px}.empty-steps{gap:6px}.swatches{justify-content:flex-start;gap:12px}}

/* Entry page and requested lightweight tool switcher */
.immersive-layout{height:auto;padding:0}
.immersive-header{background:var(--surface)}
.header-right #theme{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:50%}
.cover{position:relative;min-height:calc(100svh - 72px);padding:64px clamp(30px,5vw,90px) 100px;display:grid;grid-template-columns:minmax(280px,.85fr) minmax(480px,1.4fr);align-items:center;gap:clamp(35px,6vw,100px);background:radial-gradient(ellipse at 13% 20%,#bca9e814,transparent 55%)}
.cover-kicker,.library-kicker{font-size:11px;letter-spacing:2.3px;color:#a092b8}.cover h1{font-size:clamp(40px,4.5vw,68px);line-height:1.32;letter-spacing:2px;font-weight:500;margin:25px 0}.cover-copy>p{font-size:15px;line-height:2;color:var(--muted);margin:0 0 28px}.cover-start{display:flex;align-items:center;gap:28px;padding:0;border:0;background:none;font-size:16px;color:var(--ink)}.round-arrow{display:grid;place-items:center;flex-shrink:0;width:51px;height:51px;border-radius:50%;border:1px solid #b3a3d5;background:var(--surface);color:var(--purple);font-size:26px;line-height:1;padding:0;transition:transform .2s,background .2s}.cover-start:hover{background:none}.cover-start:hover .round-arrow,.round-arrow:hover{background:var(--tint);transform:translate(2px,-2px)}.cover-formats{display:block;margin-top:24px;font-size:11px;color:var(--muted)}.cover-formats i{font-style:normal;margin:0 8px;color:#c2bbd0}.platform-library{min-width:0;padding:25px 26px 18px;background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:0 18px 70px #5b476307;transform:rotate(-1deg)}.library-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px;gap:12px}.library-heading h2{font-size:19px;font-weight:500;margin:8px 0 0}.library-heading h2 span{font-size:12px;color:var(--muted);margin-left:7px}.library-caption{font-size:11px;color:var(--muted)}.platform-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}.platform-grid button{border:0;background:var(--bg);padding:14px 2px 11px;border-radius:12px;min-width:0}.platform-grid button:hover{background:var(--tint);transform:translateY(-3px)}.platform-grid button span{display:block}.platform-grid small{display:block;color:var(--muted);font-size:10px;margin-top:9px;white-space:nowrap}.library-footnote{font-size:11px;text-align:center;color:var(--muted);margin:18px 0 0}.cover-scroll{position:absolute;left:50%;bottom:27px;transform:translateX(-50%);background:none;border:0;color:var(--muted);font-size:12px;white-space:nowrap}.cover-scroll span{display:block;margin-top:9px;font-size:19px}.cover-scroll:hover{background:none;color:var(--purple)}
.work-section{height:calc(100dvh - 72px);padding:20px 24px;scroll-margin-top:72px}.result-title{font-size:14px;font-weight:600;padding-bottom:17px;border-bottom:1px solid var(--line)}
.swatches{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;align-items:center;justify-items:center}.swatches button{width:min(25px,100%);height:auto;aspect-ratio:1;min-width:0}
.tools-dialog{width:850px;max-width:calc(100vw - 40px);padding:32px;border-radius:25px;box-shadow:0 24px 100px #2214331a}.tools-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.tools-heading h2{font-size:27px;font-weight:500;margin:12px 0 8px}.tools-heading p{font-size:13px;margin:0 0 25px}.tools-heading>button{border:1px solid var(--line);border-radius:25px;padding:9px 21px;margin-top:2px;font-size:13px}.app-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.app-choice{padding:21px 19px 17px;border-radius:19px;border:1px solid var(--line);background:var(--bg);min-width:0}.icons-choice{background:linear-gradient(155deg,#bba8eb19,var(--surface))}.palette-choice{background:linear-gradient(155deg,#eecfb424,var(--surface))}.cutout-choice{background:linear-gradient(155deg,#afd9cf24,var(--surface))}.tool-art{height:92px;position:relative;margin-bottom:24px;display:flex;align-items:center;justify-content:center}.icons-choice .tool-art span{position:absolute}.icons-choice .tool-art span:first-child{left:calc(50% - 20px);top:23px;transform:rotate(-8deg)}.icons-choice .tool-art span:nth-child(2){left:20%;top:10px;transform:rotate(-20deg)}.icons-choice .tool-art span:nth-child(3){right:14%;bottom:6px;transform:rotate(15deg)}.tool-category{font-size:11px;letter-spacing:1px;color:var(--muted)}.app-choice h3{font-weight:500;font-size:20px;margin:9px 0}.app-choice p{font-size:12px;line-height:1.8;margin:0 0 21px}.tool-bottom{display:flex;align-items:center;justify-content:space-between;gap:5px;min-height:51px}.tool-bottom>span{font-size:11px;color:var(--muted)}.tool-bottom .round-arrow{width:45px;height:45px;font-size:25px}.palette-art span{display:block;position:absolute;width:42px;height:62px;border-radius:8px;box-shadow:0 5px 15px #7650220c;transform-origin:center 85%;border:2px solid var(--surface)}.palette-art span:nth-child(1){background:#d7b39f;transform:rotate(-26deg)}.palette-art span:nth-child(2){background:#e8d6b6;transform:rotate(0deg)}.palette-art span:nth-child(3){background:#b7c4ac;transform:rotate(27deg)}.cutout-art>span{width:75px;height:75px;display:grid;place-items:center;border-radius:13px;border:1px dashed #9dbeb5;background:repeating-conic-gradient(#93b0a312 0% 25%,transparent 0% 50%) 50% / 14px 14px;transform:rotate(8deg)}.tools-footer{text-align:center;margin:23px 0 0!important;color:var(--muted);font-size:11px!important}
.icon-dialog{width:460px}.single-colors{margin:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0}.single-colors summary{cursor:pointer;font-size:13px}.single-colors summary span{font-size:11px;color:var(--muted);float:right}.single-color-options{display:flex;gap:10px;margin:15px 0 10px}.single-color-options button,.single-custom{display:flex;align-items:center;gap:8px;font-size:12px;border:1px solid var(--line);border-radius:8px;padding:7px 10px}.single-color-options i{display:block;width:17px;height:17px;border-radius:50%;border:1px solid #9995}.single-custom{cursor:pointer}.single-custom input[type=color]{width:24px;height:24px;padding:1px}.single-hex-row{display:flex;gap:10px;align-items:center}.single-hex-row input{width:122px;font-size:12px}.single-hex-row span{font-size:11px;color:var(--muted);flex:1}.single-hex-row input[aria-invalid=true]{border-color:#d86776}.detail-actions{gap:8px}.detail-actions button{font-size:12px;white-space:nowrap;padding:10px 11px}.detail-actions svg{margin-right:3px}
@media(max-width:1050px){.cover{grid-template-columns:minmax(230px,.75fr) minmax(390px,1.25fr);gap:28px;padding:45px 26px 90px}.platform-library{padding:20px 16px}.platform-grid{gap:5px}.platform-grid button{padding:12px 1px 9px}.platform-grid small{font-size:9px}.library-caption{display:none}.work-section{padding:16px}.cover h1{font-size:42px}}
@media(max-width:760px){.cover{grid-template-columns:1fr;gap:34px;padding:40px 22px 90px;min-height:calc(100svh - 66px)}.cover-copy{text-align:center}.cover h1{font-size:42px;margin:18px 0}.cover-copy>p{font-size:14px;margin-bottom:20px}.cover-start{margin:auto}.cover-formats{margin-top:18px}.platform-library{transform:none;max-width:580px;width:100%;margin:auto}.platform-grid{grid-template-columns:repeat(8,minmax(0,1fr))}.cover-kicker{font-size:10px}.tools-dialog{padding:23px;max-width:calc(100vw - 24px)}.app-cards{gap:10px}.app-choice{padding:15px 12px}.tool-art{margin-bottom:16px}.app-choice h3{font-size:18px}.tool-bottom{flex-wrap:wrap}.app-choice p{font-size:11px}.tools-heading .cover-kicker{letter-spacing:1px;font-size:9px}}
@media(max-width:700px){.work-section{height:auto;min-height:calc(100dvh - 66px);padding:14px;scroll-margin-top:66px}.swatches{gap:3px}.swatches button{width:min(22px,100%)}.platform-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.platform-grid small{font-size:10px}.platform-grid button{padding:12px 3px}.platform-library{max-width:450px}.cover-scroll{bottom:18px}.detail-actions{flex-wrap:wrap}.tools-dialog{max-height:calc(100dvh - 30px);overflow:auto}.app-cards{grid-template-columns:1fr}.app-choice{position:relative;padding:18px 20px 18px 112px;min-height:150px}.app-choice .tool-art{position:absolute;left:15px;top:25px;width:78px;height:78px;margin:0}.app-choice h3{margin:6px 0}.app-choice p{margin:0 0 6px}.tool-bottom{min-height:39px}.tool-bottom .round-arrow{width:39px;height:39px}.tool-category{font-size:10px}.tools-footer{margin-top:17px!important}.single-colors summary span{float:none;margin-left:8px}}
@media(prefers-reduced-motion:reduce){.cover *,.app-cards *{transition:none!important;scroll-behavior:auto!important}}
.platform-grid small{font-size:12px;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0 2px}
@media(max-width:1050px){.platform-grid small{font-size:12px}}

/* Requested alignment and navigation refinements; existing workspace styling retained. */
html,body{height:100%;overflow:hidden}
.immersive-header{padding-top:0;flex-shrink:0}
.header-right #theme{display:flex;align-items:center;justify-content:center;padding:0;line-height:1;box-sizing:border-box;flex-shrink:0}
.header-right #theme svg{display:block;margin:0;flex-shrink:0}
.brand-caret{display:flex;align-items:center;justify-content:center;line-height:1}
.immersive-layout{height:calc(100dvh - 72px);overflow:hidden}
.cover{height:100%;min-height:0;overflow-y:auto;box-sizing:border-box}
.work-section{height:100%;min-height:0;overflow-y:auto;box-sizing:border-box}
.cover-start{background:var(--purple);color:#fff;border:1px solid var(--purple);border-radius:13px;padding:13px 20px;gap:20px;width:max-content}
.cover-start:hover{background:#6950ce;color:#fff;border-color:#6950ce}
.cover-start .start-arrow{display:flex;align-items:center;justify-content:center}
.library-heading h2 #open-library{font:inherit;color:inherit;border:0;background:none;padding:0;text-align:left;display:inline-flex;align-items:center;gap:7px}
.library-heading h2 #open-library:hover{color:var(--purple)}
.library-heading h2 #open-library span{margin-left:0}
.workspace-links{display:flex;align-items:center;gap:8px}
.workspace-links button{font-size:12px;padding:7px 10px;border-color:transparent;background:none;color:var(--muted)}
.workspace-links button:hover{background:var(--tint);color:var(--purple)}
.dimensions #lock{display:flex;align-items:center;justify-content:center;padding:0}
input[type=number]{appearance:textfield;-moz-appearance:textfield}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.config-inner{scrollbar-width:none;-ms-overflow-style:none}
.config-inner::-webkit-scrollbar{display:none;width:0;height:0}
.gallery-wrap{scrollbar-color:#b7accb55 transparent;scrollbar-width:thin}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23908b9e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;padding-right:32px}
body[data-page=home] .immersive-layout{padding:30px;overflow:auto}
body[data-page=library] .immersive-layout{overflow:auto}
.library-page{max-width:1280px;margin:auto;padding:34px 38px 50px}
.library-page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}
.library-page-heading h1{font-size:28px;font-weight:500;margin:12px 0}
.library-page-heading p{font-size:14px;color:var(--muted)}
.library-controls{display:flex;align-items:center;gap:24px;margin-bottom:20px}
.library-controls .search{max-width:550px}.library-controls label{font-size:13px;color:var(--muted);white-space:nowrap}
.library-controls select{width:145px}.library-categories{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.library-categories button{font-size:13px}.library-categories>span{margin-left:auto;font-size:12px;color:var(--muted)}
.library-group{margin-top:28px}.library-group h2{font-size:16px;font-weight:500;margin:0 0 15px}.library-group h2 span{font-size:12px;color:var(--muted);margin-left:10px}
.library-item{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:145px;gap:14px;border-radius:11px}.library-item strong{font-size:13px;font-weight:400}.library-item small{font-size:11px;color:var(--muted);margin-top:-7px}
@media(max-width:760px){.cover{align-items:start;grid-template-columns:1fr}.cover-scroll{position:static;transform:none;grid-column:1;margin:0 auto}.cover{padding-bottom:24px}}
@media(max-width:700px){.immersive-layout{height:calc(100dvh - 66px)}.work-section{height:100%;min-height:0}.immersive-header{gap:8px}.workspace-links{gap:1px}.workspace-links button{padding:6px;font-size:11px}.immersive-header .brand{font-size:18px}.header-right #theme{width:32px;height:32px}.header-right{gap:3px}.library-page{padding:25px 18px}.library-page-heading{flex-wrap:wrap}.library-controls{gap:12px;flex-wrap:wrap}.library-controls .search{flex-basis:100%;max-width:none}.library-categories>span{margin-left:0}.library-group .gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Annotated refinements: hierarchy, restrained motion and login guidance. */
body[data-page=studio] .immersive-layout{position:relative}
body[data-page=studio] .cover,body[data-page=studio] .work-section{position:absolute;inset:0;width:100%;height:100%;background-color:var(--bg);will-change:transform}
.home-header{background:transparent;border-bottom:0;box-shadow:none}
.home-icon{display:flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:1px solid var(--line);border-radius:50%;color:var(--muted)}
.app-logo{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:var(--tint)}
body[data-page=home] .immersive-layout{padding:32px clamp(25px,6vw,100px) 60px;max-width:1400px;margin:auto}
body[data-page=home] .welcome{margin:12px 0 40px}body[data-page=home] .welcome h1{font-size:48px;letter-spacing:3px;font-weight:500;margin:16px 0}body[data-page=home] .welcome p{font-size:15px}
.result-title{display:flex;align-items:center;gap:5px}.result-library-link{margin-left:auto;display:flex;align-items:center;gap:4px;padding:0;border:0;background:none;color:var(--muted);font-size:12px;font-weight:400}.result-library-link:hover{background:none;color:var(--purple)}
.library-heading .library-icon-entry{width:43px;height:43px;display:flex;flex-shrink:0}
.login-prompt{text-align:center;width:100%;padding:70px 20px}.login-symbol{display:grid;place-items:center;width:66px;height:66px;border-radius:20px;background:var(--tint);margin:0 auto 22px}.login-prompt h2{font-size:22px;font-weight:500;margin:0 0 16px}.login-prompt p{color:var(--muted);font-size:14px;line-height:1.9}.login-prompt button{margin-top:12px;padding:12px 30px}
.config-inner[inert]{opacity:.58}.config-inner[inert] *{cursor:default}
#login-form{margin-top:22px}#login-form>label{display:block;font-size:13px;margin-bottom:8px}#identity{margin-bottom:13px}#send-code{white-space:nowrap;font-size:12px}#login-status{font-size:12px;min-height:22px}
.app-choice{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;transform-origin:50% 70%}
@media(hover:hover){.app-choice:hover{transform:translateY(-5px) rotate(-.7deg);box-shadow:0 14px 35px #37285112;border-color:#baa9dc}.app-choice.palette-choice:hover{transform:translateY(-5px) rotate(.7deg)}}
body.dark{--muted:#a6a6b9}body.dark .tool-category,body.dark .tool-bottom>span,body.dark .cover-kicker{color:#b6aec8}body.dark .app-choice p{color:#c0bfcc}body.dark .app-choice{border-color:#444452}body.dark .palette-art span{border-color:#595665}body.dark .cutout-art>span{border-color:#95b6ad}body.dark .app-choice:hover{box-shadow:0 16px 35px #0003}
.compact-colors{padding:15px 0;margin:16px 0}.compact-colors .single-color-options{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 13px}.compact-colors .color-dot{width:25px;height:25px;min-width:25px;padding:0;border:3px solid var(--surface);border-radius:50%;background:var(--dot-color)!important;box-shadow:0 0 0 1px var(--line)}.compact-colors .color-dot.selected{border-color:var(--surface)!important;box-shadow:0 0 0 2px var(--purple)}.compact-colors .single-custom{padding:0;border:1px solid var(--line);border-radius:50%;overflow:hidden;width:27px;height:27px}.compact-colors .single-custom input[type=color]{width:27px;height:27px;padding:0;border:0;cursor:pointer}.compact-colors .single-hex-row input{flex:0 0 135px}.compact-colors .single-custom.selected{outline:1px solid var(--purple);background:none!important}
@media(max-width:700px){body[data-page=home] .welcome h1{font-size:38px}.immersive-header .brand{font-size:18px;gap:6px}.immersive-header{gap:8px}.app-logo{width:27px;height:27px}.home-icon{width:30px;height:30px}.login-prompt{padding:50px 15px}.login-prompt h2{font-size:20px}.result-library-link{font-size:11px}}
@media(prefers-reduced-motion:reduce){.app-choice{transition:none}.app-choice:hover{transform:none}}

/* Requested demo-flow and card refinements. */
.library-heading .library-icon-entry{width:auto;height:42px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:0 15px;border:1px solid #b3a3d5;border-radius:24px;color:var(--purple);font-size:12px;line-height:1;flex-shrink:0}
.library-heading .library-icon-entry svg{display:block;flex-shrink:0;margin:0}.library-heading .library-icon-entry span{display:block;margin:0}
.app-choice[data-tool-card]{cursor:pointer}.app-choice[data-tool-card]:focus-visible{outline:2px solid var(--purple);outline-offset:4px}
@media(hover:hover){.app-choice:hover{transform:translateY(-11px) rotate(-1.8deg);box-shadow:0 20px 42px #37285120}.app-choice.palette-choice:hover{transform:translateY(-11px) rotate(1.8deg)}}
body:not(.dark) .icons-choice{background:linear-gradient(145deg,#d2c0ee,#e4daf3);border-color:#bfa8dd}
body:not(.dark) .palette-choice{background:linear-gradient(145deg,#dfbfa3,#eddbc8);border-color:#cba987}
body:not(.dark) .cutout-choice{background:linear-gradient(145deg,#aecfc2,#d4e6dd);border-color:#94b8a8}
body:not(.dark) .app-choice h3{color:#302c3b}body:not(.dark) .app-choice p{color:#51495d}body:not(.dark) .tool-category,body:not(.dark) .tool-bottom>span{color:#655c70}
body:not(.dark) .palette-art span{border-color:#f6ecdf}body:not(.dark) .cutout-art>span{border-color:#648f7f}
#send-code{display:inline-flex;align-items:center;justify-content:center;flex:0 0 116px;min-width:116px;height:42px;line-height:1;padding:0 10px;box-sizing:border-box}
#verification-code{height:42px;min-width:0}#demo-login{margin:5px 0 0}.demo-note{font-size:12px!important;margin:9px 0 22px!important;color:var(--muted)}
@media(max-width:700px){.library-heading .library-icon-entry{height:38px;gap:6px;padding:0 10px;font-size:11px}.library-heading h2{font-size:17px}}
@media(prefers-reduced-motion:reduce){.app-choice:hover,.app-choice.palette-choice:hover{transform:none}}

/* Requested single-color independence and quiet home atmosphere. */
.compact-colors #single-custom-label{position:relative;background:var(--custom-swatch,conic-gradient(#f09b99,#e3c663,#86ba9d,#74a8db,#ad8ed8,#f09b99))!important;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line)}
.compact-colors #single-custom-label input{position:absolute;inset:0;opacity:0;width:100%;height:100%;padding:0;margin:0;cursor:pointer}
.compact-colors #single-custom-label:focus-within{outline:2px solid var(--purple);outline-offset:2px}
.home-atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.home-atmosphere *{pointer-events:none}
body[data-page=home] .welcome,body[data-page=home] main>.app-cards{position:relative;z-index:1}
.home-atmosphere .haze{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4}
.haze-purple{width:65vw;height:55vh;background:#cbbbea;left:-17vw;top:-15vh}
.haze-teal{width:55vw;height:60vh;background:#b9d8d1;right:-17vw;top:30vh}
.haze-gold{width:50vw;height:45vh;background:#e8d6c2;left:20vw;bottom:-25vh}
body.dark .home-atmosphere .haze{opacity:.17}.dark .haze-purple{background:#8870c6}.dark .haze-teal{background:#549c97}.dark .haze-gold{background:#a585b0}
.ambient-star{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:#9184b4;box-shadow:0 0 8px #a795d044;animation:quiet-twinkle var(--duration) var(--delay) ease-in-out infinite;opacity:.18}
.dark .ambient-star{background:#cbbdec;box-shadow:0 0 8px #b7a5e555}
.ambient-meteor{position:absolute;left:65%;top:8%;width:85px;height:1px;border-radius:100%;background:linear-gradient(90deg,transparent,#b3a3d6);opacity:0;transform:rotate(-32deg);animation:quiet-meteor 21s 6s ease-out infinite}
.ambient-meteor.second{left:23%;top:53%;animation-delay:14s;animation-duration:29s;width:60px}
@keyframes quiet-twinkle{0%,100%{opacity:.12;transform:scale(.8)}50%{opacity:.5;transform:scale(1.12)}}
@keyframes quiet-meteor{0%,8%,100%{opacity:0;transform:translate(0,0) rotate(-32deg)}2%{opacity:.45}7%{opacity:0;transform:translate(-160px,100px) rotate(-32deg)}}
.app-choice h3{font-weight:750;letter-spacing:1.4px;font-size:22px;line-height:1.4;text-shadow:0 1px 0 #ffffff16}
@media(prefers-reduced-motion:reduce){.home-atmosphere *{animation:none!important}.ambient-meteor{display:none}}

/* Library controls stay in their own interactive layer. */
.library-sticky{position:sticky;top:0;z-index:3;background:var(--bg);padding:16px 0 13px;border-bottom:1px solid var(--line);isolation:isolate;pointer-events:auto}
.library-sticky .library-controls{margin-bottom:16px}.library-sticky input,.library-sticky select{position:relative;z-index:1;pointer-events:auto;cursor:auto}.library-sticky select{cursor:pointer}.library-sticky .search>span{z-index:2;pointer-events:none}
.library-anchors{display:flex;height:auto;align-items:center;gap:14px;margin-top:14px;overflow-x:auto;white-space:nowrap}
.library-anchors>span{font-size:11px;color:var(--muted)}.library-anchors button{height:auto;border:0;border-bottom:2px solid transparent;border-radius:0;padding:6px 2px;background:none;font-size:12px;color:var(--muted)}.library-anchors button.active{color:var(--purple);border-bottom-color:var(--purple)}.library-anchors button.active:after{display:none}
#library-results{position:relative;z-index:1}.library-group{scroll-margin-top:160px}
#library-pagination{display:flex;align-items:center;justify-content:center;gap:25px;flex-wrap:wrap;margin-top:35px;padding:20px 0}
.page-buttons{height:auto;display:flex;gap:7px;align-items:center}.page-buttons button{height:35px;min-width:35px;padding:0 11px;border:1px solid var(--line);border-radius:7px;background:var(--surface);font-size:12px;color:var(--ink)}.page-buttons span{color:var(--muted)}
.page-jump{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.page-jump input{width:60px;padding:7px;text-align:center}.page-jump button{font-size:12px;padding:7px 10px}
@media(max-width:700px){.app-choice h3{font-size:20px}.library-sticky{padding:12px 0}.library-anchors{gap:12px}.library-controls .search{min-width:0}#library-pagination{gap:14px}.page-buttons{flex-wrap:wrap;justify-content:center}.home-atmosphere .haze{filter:blur(55px)}}

/* Home-only morning light, night sky and tool illustrations. */
body[data-page=home]:not(.dark) .home-atmosphere{background:linear-gradient(130deg,#edd7bb 0%,#e8dfca 36%,#c9ded8 72%,#c3d4e5 100%)}
body[data-page=home]:not(.dark) .haze-purple{background:#f9c99d;opacity:.7;top:-25vh;left:-8vw}
body[data-page=home]:not(.dark) .haze-teal{background:#a9c5bc;opacity:.6}
body[data-page=home]:not(.dark) .haze-gold{background:#fff2c6;opacity:.85;bottom:-8vh}
body[data-page=home]:not(.dark) .home-atmosphere:after{content:'';position:absolute;width:60vw;height:150vh;left:15%;top:-50%;transform:rotate(35deg);background:linear-gradient(90deg,transparent,#fff8de66,transparent);filter:blur(35px)}
body[data-page=home]:not(.dark) .ambient-star,body[data-page=home]:not(.dark) .ambient-meteor{display:none}
body[data-page=home]:not(.dark) .welcome p{color:#686458}
body[data-page=home]:not(.dark) .welcome .cover-kicker{color:#81745f}
body[data-page=home] .welcome h1{font-family:'STZhongsong','Source Han Serif SC','SimSun',serif;font-weight:600;letter-spacing:9px}
body[data-page=home].dark .home-atmosphere{background:linear-gradient(135deg,#121625,#1c2038 55%,#172c37)}
body[data-page=home].dark .haze-purple{background:#7465bf;opacity:.25}
body[data-page=home].dark .haze-teal{background:#367e99;opacity:.25}
body[data-page=home].dark .haze-gold{background:#7961a6;opacity:.2}
body[data-page=home].dark .ambient-meteor{width:180px;height:2px;background:linear-gradient(90deg,transparent,#a8ccf1 75%,#fff);box-shadow:0 0 9px #bddbff88;animation:home-shooting-star 13s 2s linear infinite;left:78%;top:12%}
body[data-page=home].dark .ambient-meteor.second{width:130px;left:40%;top:65%;animation-duration:19s;animation-delay:8s}
@keyframes home-shooting-star{0%{opacity:0;transform:translate(0,0) rotate(145deg)}2%{opacity:.95}12%{opacity:0;transform:translate(-420px,294px) rotate(145deg)}100%{opacity:0;transform:translate(-420px,294px) rotate(145deg)}}
body[data-page=home] main>.app-cards .tool-art span,body[data-page=home] main>.app-cards .tool-art svg{transition:transform .65s cubic-bezier(.2,.7,.2,1),background .65s,box-shadow .65s,border-color .65s}
body[data-page=home] main>.app-cards .palette-art span:nth-child(1){transform:translate(-4px,2px) rotate(-5deg)}
body[data-page=home] main>.app-cards .palette-art span:nth-child(2){transform:translate(-2px,1px) rotate(-2deg)}
body[data-page=home] main>.app-cards .palette-art span:nth-child(3){transform:rotate(2deg)}
body[data-page=home] main>.app-cards .cutout-art>span{position:relative;isolation:isolate;overflow:hidden;background:repeating-conic-gradient(#93b0a330 0% 25%,transparent 0% 50%) 50% / 12px 12px}
body[data-page=home] main>.app-cards .cutout-art>span:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(150deg,#aecfc7 0%,#d1dfb9 55%,#87ada1 100%);opacity:1;transition:opacity .65s,transform .65s}
body[data-page=home] main>.app-cards .cutout-art svg{filter:drop-shadow(0 2px 2px #32574b22)}
@media(hover:hover){
body[data-page=home] main>.app-cards .app-choice:hover{transform:translateY(-11px) rotate(-1.8deg)}
body[data-page=home] main>.app-cards .icons-choice:hover .tool-art span:first-child{transform:rotate(82deg) scale(1.15)}
body[data-page=home] main>.app-cards .icons-choice:hover .tool-art span:nth-child(2){transform:translate(-5px,-8px) rotate(-8deg) scale(1.18)}
body[data-page=home] main>.app-cards .icons-choice:hover .tool-art span:nth-child(3){transform:translate(5px,-5px) rotate(55deg) scale(1.12)}
body[data-page=home] main>.app-cards .palette-choice:hover .palette-art span:nth-child(1){transform:translate(-10px,0) rotate(-32deg)}
body[data-page=home] main>.app-cards .palette-choice:hover .palette-art span:nth-child(2){transform:translateY(-4px) rotate(0deg)}
body[data-page=home] main>.app-cards .palette-choice:hover .palette-art span:nth-child(3){transform:translate(10px,0) rotate(32deg)}
body[data-page=home] main>.app-cards .cutout-choice:hover .cutout-art>span:before{opacity:0;transform:scale(1.2)}
body[data-page=home] main>.app-cards .cutout-choice:hover .cutout-art svg{transform:scale(1.18) rotate(-8deg)}
}
@media(prefers-reduced-motion:reduce){body[data-page=home] main>.app-cards .app-choice:hover{transform:none}body[data-page=home] main>.app-cards .tool-art span,body[data-page=home] main>.app-cards .tool-art svg,body[data-page=home] main>.app-cards .cutout-art>span:before{transition:none}}

/* Fourth lightweight app entry. */
.emoji-choice{background:linear-gradient(155deg,#e4bba32b,var(--surface))}
body:not(.dark) .emoji-choice{background:linear-gradient(145deg,#eac5b5,#e4d2c5);border-color:#d7b7a5}
.emoji-face{color:#b78264;display:block;transform:rotate(-8deg);transition:transform .65s ease}
.dark .emoji-face{color:#dfb292}
.emoji-eyes{transform-box:fill-box;transform-origin:center;transition:transform .4s}
@media(min-width:1100px){body[data-page=home] main>.app-cards{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:701px) and (max-width:1099px){body[data-page=home] main>.app-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:701px){.tools-dialog .app-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(hover:hover){.emoji-choice:hover .emoji-face{transform:translateY(-6px) rotate(8deg) scale(1.08)}.emoji-choice:hover .emoji-eyes{transform:scaleY(.3)}}
@media(prefers-reduced-motion:reduce){.emoji-face,.emoji-eyes{transition:none}}

/* Preview covers for upcoming apps; existing icon studio stays unchanged. */
.upcoming-cover{min-height:calc(100dvh - 140px);display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:6vw;padding:35px clamp(16px,4vw,65px)}
.upcoming-cover h1{font-size:clamp(38px,4vw,62px);font-weight:500;line-height:1.3;letter-spacing:-1px;margin:25px 0}
.upcoming-cover .cover-copy>p{font-size:15px;line-height:2.1;color:var(--muted);margin-bottom:30px}
.upcoming-cover .cover-start:disabled{opacity:.75;cursor:default;box-shadow:none}
.upcoming-showcase{padding:26px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:0 25px 70px #29213f08}
.showcase-heading{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px;letter-spacing:1px;margin-bottom:23px}.showcase-heading small{font-size:10px;letter-spacing:0}
.showcase-note{text-align:center;font-size:11px;line-height:1.8;color:var(--muted);margin:22px 0 0}
.palette-samples{display:grid;gap:17px}.color-story{border:1px solid var(--line);border-radius:13px;overflow:hidden}.story-swatches{display:flex;height:86px}.story-swatches span{flex:1}.story-caption{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;gap:8px}.story-caption strong{font-size:12px;font-weight:500}.story-caption>span{font-size:9px;letter-spacing:1px;color:var(--muted)}
.cutout-samples{display:grid;grid-template-columns:1fr 20px 1fr;gap:10px;align-items:center}.cutout-stage{position:relative;border-radius:15px;overflow:hidden;padding:40px 0 12px}.cutout-stage svg{width:100%;display:block}.cutout-stage.before{background:linear-gradient(145deg,#cad4c7,#ebe1c9 62%,#c7b9a5)}.cutout-stage.after{background:repeating-conic-gradient(#9aa6a51c 0% 25%,transparent 0% 50%) 50% / 18px 18px;border:1px solid var(--line)}.sample-tag{position:absolute;top:13px;left:12px;font-size:10px;background:var(--surface);border-radius:20px;padding:5px 9px;color:var(--ink)}.sample-arrow{color:var(--muted)}
.emoji-samples{display:grid;grid-template-columns:1fr 1fr;gap:15px}.expression{background:var(--bg);border:1px solid var(--line);border-radius:17px;padding:15px;text-align:center}.expression svg{display:block;width:115px;max-width:100%;margin:0 auto 7px;transform:rotate(-6deg)}.expression:nth-child(even) svg{transform:rotate(7deg)}.expression:not(.happy):not(.angry):not(.sad):not(.sleep) svg path{stroke:#594d49;stroke-width:4;stroke-linecap:round;fill:none}.expression strong{font-size:14px;letter-spacing:1px;font-weight:600}
@media(max-width:900px){.upcoming-cover{gap:30px;padding:25px 10px}.upcoming-showcase{padding:18px}.story-caption>span{font-size:8px}}
@media(max-width:700px){.upcoming-cover{grid-template-columns:1fr;padding:25px 4px 45px}.upcoming-cover .cover-copy{text-align:center}.upcoming-cover h1{font-size:39px}.upcoming-showcase{width:100%;max-width:520px;margin:auto}.upcoming-cover .cover-start{margin:auto}.upcoming-cover .cover-formats{line-height:1.8}}

/* App identity, large demonstrations and configurable entry grid. */
.upcoming-cover{grid-template-columns:.8fr 1.2fr;gap:4vw}.upcoming-cover h1,.cover h1{font-size:clamp(48px,5vw,76px);font-weight:700;margin:15px 0 18px;letter-spacing:2px}.app-slogan{font-size:clamp(25px,2.5vw,36px);font-weight:500;line-height:1.5;margin:0 0 22px}.upcoming-showcase{padding:30px}.story-swatches{height:100px}
.compare-frame{height:400px;position:relative;overflow:hidden;border-radius:17px;background:repeating-conic-gradient(#98a69c22 0% 25%,transparent 0% 50%) 50% / 20px 20px}.compare-layer{position:absolute;inset:0;display:grid;place-items:center}.compare-layer svg{height:90%;width:80%;max-height:360px}.compare-original{background:linear-gradient(140deg,#bbcabc,#eee0c7 65%,#bdac95);clip-path:inset(0 0 0 var(--reveal))}.compare-line{position:absolute;left:clamp(2px,var(--reveal),calc(100% - 2px));top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 10px #0002;pointer-events:none}.compare-line span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;background:white;color:#7760db;width:32px;height:32px;display:grid;place-items:center}.compare-caption{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--surface);color:var(--muted);padding:7px 12px;border-radius:20px;font-size:11px}.compare-control{display:flex;align-items:center;gap:12px;margin-top:20px;font-size:11px;color:var(--muted);white-space:nowrap}.compare-control input{padding:0;accent-color:var(--purple);cursor:ew-resize;min-width:0}
.sticker-samples .expression{padding:12px;background:linear-gradient(145deg,var(--surface),var(--bg))}.sticker-samples .expression svg{width:165px;filter:drop-shadow(0 5px 2px #0000000d)}.sticker-samples .expression strong{font-size:19px;font-family:'KaiTi','STKaiti',sans-serif;font-weight:700}
body[data-page=home] main>.app-cards{display:flex;flex-wrap:wrap}body[data-page=home] main>.app-cards>.app-choice{flex:1 1 calc((100% - 48px)/4);min-width:220px}
.botanical-lines{position:absolute;inset:0;width:100%;height:100%;color:#637d65;opacity:.17}.dark .botanical-lines{display:none}
body[data-page=home].dark .ambient-meteor.third{left:94%;top:46%;width:145px;animation-duration:23s;animation-delay:15s}
.emoji-face circle{transition:fill-opacity .4s,fill .4s}.emoji-face .emoji-smile{transition:stroke .4s}
@media(hover:hover){.emoji-choice:hover .emoji-face{color:#a4674f}.emoji-choice:hover .emoji-face circle{fill:#efbd79;fill-opacity:.85}.dark .emoji-choice:hover .emoji-face{color:#f6d8ae}.dark .emoji-choice:hover .emoji-face circle{fill:#af7750;fill-opacity:.8}}
@media(max-width:1000px){body[data-page=home] main>.app-cards>.app-choice{flex-basis:calc((100% - 16px)/2)}}
@media(max-width:700px){body[data-page=home] main>.app-cards>.app-choice{flex-basis:100%;min-width:0}.upcoming-cover{grid-template-columns:1fr}.upcoming-cover h1,.cover h1{font-size:48px}.upcoming-showcase{padding:18px}.compare-frame{height:320px}.app-slogan{font-size:26px}}

/* Light controls and stable library/workspace surfaces. */
.library-page{min-height:100%;display:flex;flex-direction:column;box-sizing:border-box}#library-results{flex:1}#library-pagination{margin-top:auto;padding-top:28px;flex-shrink:0}.library-sticky{flex-shrink:0}.my-library #my-library-results{flex:1}
.config-inner>.field{padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid var(--line)}.config-inner>.field:last-of-type{margin-bottom:13px}.config input:not([type=color]),.config select,.library-page input{border-radius:11px;border-color:var(--line);background:color-mix(in srgb,var(--surface) 65%,var(--bg));transition:border-color .2s,box-shadow .2s}.config input:focus,.library-page input:focus{outline:none;border-color:#aa96df;box-shadow:0 0 0 3px #9e85df16}
.soft-select{position:relative;width:100%;min-width:0}.native-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0;pointer-events:none;padding:0!important;overflow:hidden}.select-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 13px;border-radius:11px;background:var(--surface);font-size:13px;text-align:left}.select-trigger>span:last-child{font-size:18px;line-height:14px;color:var(--muted)}.select-menu{position:absolute;top:calc(100% + 7px);left:0;min-width:100%;width:max-content;max-width:280px;z-index:15;border:1px solid var(--line);border-radius:14px;padding:5px;background:var(--surface);box-shadow:0 12px 35px #15102f22}.select-menu[hidden]{display:none}.select-menu button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:10px 12px;border-radius:9px}.select-menu button[aria-selected=true]{background:var(--tint);color:var(--purple)}.select-menu strong{display:block;font-size:13px;font-weight:500}.select-menu small{display:block;font-size:10px;color:var(--muted);margin-top:4px;white-space:normal}.library-controls>.row{min-width:225px;white-space:nowrap}.mine-link{margin-left:12px!important}.selection-bar .actions{flex-wrap:wrap}.batch-swatches{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:22px 0}.batch-custom{display:flex;align-items:center;gap:7px;font-size:12px}.download-dialog h2{font-weight:600}.download-dialog .wide{margin-top:20px}
.creation-loading{text-align:center;padding:55px 15px;width:100%}.creation-loading h2{font-size:21px;font-weight:500;margin:22px 0 10px}.creation-loading p,.creation-loading small{color:var(--muted);font-size:12px}.design-orbit{position:relative;width:190px;height:190px;margin:auto;display:grid;place-items:center}.design-orbit i{position:absolute;inset:8px;border:1px dashed #b7a4e655;border-radius:50%;animation:orbit-turn 9s linear infinite}.design-orbit i:nth-child(2){inset:30px;border-style:solid;border-top-color:#9d85d9;animation-duration:3s}.design-orbit>span{display:grid;place-items:center;width:95px;height:95px;border-radius:25px;background:var(--tint);box-shadow:0 0 45px #9f85dc25;animation:design-breathe 1.8s ease-in-out infinite}.design-orbit b,.design-orbit em{position:absolute;top:12px;left:18px;animation:design-breathe 2s ease-in-out infinite}.design-orbit em{left:auto;top:auto;right:8px;bottom:16px;animation-delay:.4s}.design-progress{width:180px;height:3px;border-radius:5px;background:var(--line);margin:25px auto 14px;overflow:hidden}.design-progress span{display:block;width:45%;height:100%;background:linear-gradient(90deg,#bea9e7,#8aaeb3);animation:design-sweep 1.4s ease-in-out infinite}.results:has(.creation-loading) .gallery-wrap{display:grid;place-items:center}@keyframes orbit-turn{to{transform:rotate(360deg)}}@keyframes design-breathe{50%{transform:translateY(-6px) rotate(6deg)}}@keyframes design-sweep{from{transform:translateX(-100%)}to{transform:translateX(320%)}}
@media(max-width:700px){.result-title{flex-wrap:wrap;gap:10px}.result-library-link{margin-left:0}.mine-link{margin-left:0!important}.library-controls>.row{min-width:0;flex:1}.select-menu{max-width:230px}.selection-bar .actions{width:100%}.creation-loading{padding:25px 10px}}
@media(prefers-reduced-motion:reduce){.creation-loading *{animation:none!important}}
body[data-page=mine] .immersive-layout{overflow:auto}.select-menu{z-index:40}.field:has(#format) .soft-select{margin-top:10px}

/* Anchored top-layer menus, export preview and personal groups. */
.select-menu[popover]{color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:5px;max-width:none}.select-menu::backdrop{background:transparent}
.changing-glyphs{position:relative}.changing-glyphs>span{position:absolute;inset:0;display:grid;place-items:center;opacity:0;animation:glyph-design 1.6s linear infinite;animation-delay:calc(var(--glyph-index)*.4s)}@keyframes glyph-design{0%{opacity:0;transform:scale(.65) rotate(-45deg)}8%,18%{opacity:1;transform:scale(1.05) rotate(10deg)}25%,100%{opacity:0;transform:scale(.6) rotate(65deg)}}
.download-dialog{width:460px}.batch-stack{height:145px;position:relative;display:flex;justify-content:center;align-items:center;margin:15px 0}.batch-stack>span{position:absolute;display:grid;place-items:center;width:100px;height:110px;background:var(--bg);border:1px solid var(--line);border-radius:19px;box-shadow:0 10px 24px #00000012;transform:translateX(calc((var(--stack-i) - 1)*62px)) rotate(calc((var(--stack-i) - 1)*12deg));transition:background .2s}.batch-stack>span.dark-preview{background:#30323e}.batch-count{text-align:center}.batch-count strong{color:var(--ink);font-size:19px}.download-dialog .batch-swatches{gap:12px;flex-wrap:nowrap;justify-content:space-between}.download-dialog .color-dot{flex-shrink:0;width:27px;height:27px;padding:0;border:3px solid var(--surface);border-radius:50%;background:var(--dot-color)!important;outline:1px solid var(--line)}.download-dialog .color-dot.selected{outline:2px solid var(--purple);outline-offset:2px;border-color:var(--surface)!important}.batch-custom-circle{position:relative;display:block;width:27px;height:27px;border-radius:50%;flex-shrink:0;background:var(--custom-color,conic-gradient(#f0a47b,#eedc7f,#7ec8ad,#829cde,#c58acf,#f0a47b))!important;border:3px solid var(--surface)}.batch-custom-circle input{position:absolute;inset:0;width:100%;height:100%;padding:0;opacity:0;cursor:pointer}.batch-custom-circle.selected{outline:2px solid var(--purple);outline-offset:2px}.batch-color-values{display:flex;align-items:center;gap:15px}.batch-color-values input{max-width:145px}.batch-color-values span{font-size:11px;color:var(--muted)}.batch-format{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.batch-format button{text-align:left;padding:12px}.batch-format small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.batch-color-values [aria-invalid=true]{border-color:#c98282}
.my-group-toolbar{display:flex;justify-content:flex-end;margin-bottom:20px}.my-icon-group{margin-bottom:30px;padding-top:16px;border-top:1px solid var(--line)}.my-group-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.my-group-heading h2{font-size:19px;font-weight:500;margin:0}.my-group-heading small{font-size:12px;color:var(--muted);margin-left:9px}.my-group-heading button{font-size:11px;color:var(--muted);background:none}.new-group-row{display:flex;gap:10px;margin:20px 0}.new-group-row button{white-space:nowrap}.group-dialog label{display:block;font-size:13px}.group-dialog select{margin-top:10px}.group-dialog .group-choice{display:flex;align-items:center;gap:10px;padding:15px 10px;border:1px solid var(--line);border-radius:10px;margin-top:12px}.group-choice input{width:16px;accent-color:var(--purple)}.group-dialog [role=status]{min-height:20px;font-size:12px;color:var(--muted)}
@media(prefers-reduced-motion:reduce){.changing-glyphs>span{animation:none}.changing-glyphs>span:first-child{opacity:1}}

/* Focused creation flow and icon-bearing groups. */
.select-label{display:flex!important;align-items:center;gap:9px}.select-add-action{border-top:1px solid var(--line)!important;border-radius:0 0 9px 9px!important;margin-top:5px;color:var(--purple)}.group-icon-label{margin-top:20px}.group-icon-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:10px}.group-icon-picker button{padding:13px;display:grid;place-items:center}.new-group-dialog{width:380px}.new-group-dialog input{margin-top:10px}.my-group-heading h2{display:flex;gap:8px;align-items:center}.naming-tokens{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}.naming-tokens button{padding:8px 4px;font-size:11px}.naming-tokens small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.selection-bar .actions>button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.creation-page-label{font-size:14px;font-weight:600;white-space:nowrap;padding-left:16px;border-left:1px solid var(--line)}.creation-exit{display:flex;align-items:center;gap:5px;font-size:11px!important;color:var(--muted)}.leave-dialog{width:420px}.leave-dialog .row{justify-content:flex-end;margin-top:25px}.leave-dialog p{line-height:1.9}
@media(max-width:700px){.creation-page-label{font-size:12px;padding-left:6px}.creation-exit{font-size:10px!important}.immersive-header .workspace-links{gap:4px}.naming-tokens{grid-template-columns:repeat(2,1fr)}}
.settings-title{display:flex;align-items:center;gap:6px}.settings-back{display:grid;place-items:center;border:0;background:none;padding:4px;color:var(--muted)}
.compare-line{pointer-events:none;left:clamp(42px,var(--reveal),calc(100% - 42px))}.compare-line #compare-drag{pointer-events:auto;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:82px;height:52px;border-radius:26px;display:flex;justify-content:center;align-items:center;gap:7px;background:var(--surface);color:var(--purple);border:2px solid #bba8ec;box-shadow:0 5px 25px #21143330;cursor:ew-resize;touch-action:none;font-size:28px;padding:0}.compare-line #compare-drag span{position:static;transform:none;width:auto;height:auto;background:none;font-size:12px;color:inherit}.compare-control input[type=range]{appearance:none;-webkit-appearance:none;height:8px;border-radius:8px;background:var(--tint);border:1px solid var(--line)}.compare-control input[type=range]::-webkit-slider-thumb{appearance:none;width:46px;height:30px;border-radius:15px;background:#927bd9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='20' viewBox='0 0 30 20'%3E%3Cpath d='m10 5-5 5 5 5m10-10 5 5-5 5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center no-repeat;box-shadow:0 2px 8px #7760db44;cursor:ew-resize}.compare-control input[type=range]::-moz-range-thumb{width:46px;height:30px;border-radius:15px;background:#927bd9;border:0;cursor:ew-resize}
.graphic-dialog{width:380px}.graphic-dialog img{display:block;width:240px;max-width:100%;margin:18px auto}.graphic-dialog form>.row{margin-top:15px;justify-content:space-between}.graphic-dialog [role=status]{font-size:12px;color:var(--muted)}

/* Original library categories stay compact even with a complete icon collection. */
.library-page:not(.my-library) .library-categories{max-height:132px;overflow-y:auto;padding:3px 0}
.platform-icon-preview{display:block;width:35px;height:35px;flex-shrink:0;object-fit:contain;filter:invert(49%) sepia(33%) saturate(1056%) hue-rotate(214deg) brightness(96%) contrast(85%)}
.library-page:not(.my-library) .library-item strong{max-width:100%;overflow-wrap:anywhere}
.library-heading-actions{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0;flex:1}.library-main-search{width:min(430px,52vw);margin:0;display:flex;align-items:center;gap:10px;padding:0 16px;border-radius:24px;background:var(--surface);box-shadow:0 4px 24px #24153f09;border:1px solid var(--line);color:var(--muted)}
.library-page .library-main-search input{width:100%;height:42px;border:0;background:transparent;border-radius:24px;font-size:13px;box-shadow:none;padding:0}.library-main-search:focus-within{border-color:#aa96df;box-shadow:0 4px 24px #9e85df16}.library-main-search svg{flex-shrink:0}
.library-filter-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:13px}.library-filter-row select{width:auto;min-width:115px}.library-filter-row #library-count{margin-left:auto;color:var(--muted);font-size:12px}.library-category-filter{position:relative}#category-panel{position:absolute;top:calc(100% + 8px);left:0;width:260px;padding:12px;border:1px solid var(--line);background:var(--surface);border-radius:15px;box-shadow:0 10px 30px #24153f16;z-index:20}#category-panel[hidden]{display:none}#category-search{width:100%}#category-options{max-height:250px;overflow:auto;margin-top:8px}#category-options button{display:block;width:100%;text-align:left;border:0;background:transparent}#category-options button:hover,#category-options button[aria-pressed=true]{background:var(--tint);color:var(--purple)}
.library-page:not(.my-library) .library-item small{max-width:95%;overflow-wrap:anywhere;text-align:center}.library-page:not(.my-library) .library-item strong{text-align:center}
@media(max-width:700px){.library-heading-actions{width:100%;flex-basis:100%}.library-main-search{width:auto;flex:1;padding:0 13px}.library-page .library-main-search input{height:42px;font-size:13px}.library-filter-row{gap:10px}.library-filter-row #library-count{width:100%;margin-left:0}}

.library-filter-row #category-toggle{min-width:115px;display:flex;align-items:center;justify-content:space-between;gap:16px}
@media(min-width:1000px){.library-page:not(.my-library) #library-results .gallery{grid-template-columns:repeat(10,minmax(0,1fr))}.library-page:not(.my-library) #library-results .library-item{min-width:0;padding:14px 6px}}

.icon-dialog .compact-colors .color-dot{box-shadow:inset 0 0 0 1px #80808070,0 0 0 1px var(--line)}
.icon-dialog .compact-colors .color-dot.selected{box-shadow:inset 0 0 0 1px #80808070,0 0 0 2px var(--purple)}

.account-trigger{display:flex;align-items:center;gap:8px;padding:5px 10px 5px 5px;background:transparent;border-color:var(--line);max-width:190px}.account-avatar{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:var(--purple);color:#fff;font-size:12px;font-weight:700;flex:none;overflow:hidden}.account-avatar img{width:100%;height:100%;object-fit:cover}.account-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}