@font-face{font-family:SourceHan;src:url('./assets/fonts/source-han-sans.otf');font-weight:100 900;font-display:swap}@font-face{font-family:Novecento;src:url('./assets/fonts/novecento-demibold.otf');font-weight:600;font-display:swap}@font-face{font-family:Space;src:url('./assets/fonts/space-grotesk.ttf');font-weight:500;font-display:swap}
:root{color-scheme:dark;--bg:#151817;--panel:#1d211f;--surface:#262b28;--line:#353b36;--muted:#8c978d;--text:#e8ece6;--accent:#dbf78b;--accent-dark:#a6c45e;--cyan:#8bccca;font-family:Inter,"Microsoft YaHei",system-ui,sans-serif;font-size:12px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);overflow:hidden}button,input,textarea,select,a{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button{border:0;background:none}a{color:inherit;text-decoration:none}input,textarea,select{width:100%;min-width:0;background:#171b18;color:#e9eee7;border:1px solid #3b433c;border-radius:6px;padding:10px 11px;outline:none;transition:border .15s,box-shadow .15s}input:focus,textarea:focus,select:focus{border-color:#a4c26c;box-shadow:0 0 0 2px #c8e88b10}input::placeholder,textarea::placeholder{color:#6e786f}textarea{resize:vertical;line-height:1.8;min-height:120px;max-height:250px}select{cursor:pointer;padding-right:25px}input[type=range]{accent-color:var(--accent);padding:0;box-shadow:none;border:none;background:none;cursor:pointer}input[type=checkbox]{accent-color:var(--accent);width:14px;height:14px;cursor:pointer;flex-shrink:0}input[type=number]{appearance:textfield;-moz-appearance:textfield}input::-webkit-inner-spin-button{display:none}h1,h2,h3,p{margin:0}h1{font-size:21px;letter-spacing:1px;font-weight:600}h2{font-size:14px;font-weight:600}h3{font-size:20px;line-height:1.5}small{font-size:10px}.topbar{height:74px;display:flex;align-items:center;gap:28px;padding:0 24px;border-bottom:1px solid var(--line);background:#1a1e1b;position:relative;z-index:10}.brand{display:flex;gap:11px;align-items:center;min-width:225px;font-size:17px;font-weight:650;letter-spacing:1px}.brand small{display:block;font-family:Space,monospace;font-weight:500;letter-spacing:1.4px;color:var(--muted);font-size:8px;margin-top:5px}.brand-icon{width:36px;height:36px;background:var(--accent);color:#273019;border-radius:9px;font-size:29px;font-weight:400;display:grid;place-items:center}.project-title{display:flex;align-items:center;gap:9px;font-size:12px;color:#b9c2b8;white-space:nowrap}.tiny-square{width:5px;height:5px;background:var(--accent);display:inline-block}.badge,.tag{padding:4px 7px;border-radius:4px;border:1px solid #485240;font-size:10px;line-height:1.2;color:#bccca7;white-space:nowrap}.badge{margin-left:2px;border-color:#353d34;color:#8f9d87}.header-actions{margin-left:auto;display:flex;gap:8px;align-items:center}.save-status{color:#8e9e87;font-size:11px;margin-right:8px;white-space:nowrap}.save-status::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--accent);margin-right:7px}.button{border:1px solid #475142;border-radius:6px;padding:9px 13px;display:inline-flex;justify-content:center;align-items:center;gap:7px;font-weight:500;white-space:nowrap;min-height:35px;transition:background .15s,border-color .15s}.button:hover{background:#343e2e}.button.primary{background:var(--accent);border-color:var(--accent);color:#283118;font-weight:650}.button.primary:hover{background:#e8ffae;border-color:#e8ffae}.button.ghost{background:#242a24}.button.ghost:hover{background:#30392e;border-color:#7f906b}.button.small{padding:6px 10px;min-height:30px;font-size:11px}.icon-btn{width:29px;height:29px;display:inline-grid;place-items:center;border-radius:5px;font-size:19px;color:#9aa693}.icon-btn:hover{background:#30382c;color:var(--accent)}.text-button{color:#a1af96;font-size:11px;padding:5px 2px;white-space:nowrap}.text-button:hover{color:var(--accent)}.divider{height:18px;width:1px;background:var(--line);margin:0 7px;flex-shrink:0}.studio{display:grid;grid-template-columns:92px 342px minmax(0,1fr);height:calc(100dvh - 74px)}.rail{border-right:1px solid var(--line);display:flex;align-items:center;flex-direction:column;padding:20px 8px 16px;background:#191d1a}.rail-caption{color:#687361;font-size:9px;letter-spacing:3px;margin-bottom:17px}.rail-item{width:74px;height:83px;border-radius:8px;position:relative;color:#809077;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;margin-bottom:8px}.rail-item>span{font-size:22px;font-family:system-ui}.rail-item>b{font-size:11px;font-weight:500}.rail-item>small{position:absolute;top:7px;right:8px;font-family:Space;font-size:8px;opacity:.5}.rail-item:hover{background:#282e25}.rail-item.active{background:#303b28;color:var(--accent);box-shadow:inset 0 0 0 1px #526040}.rail-item.active::before{content:"";height:24px;width:3px;background:var(--accent);position:absolute;left:-8px;border-radius:0 2px 2px 0}.rail-bottom{margin-top:auto;display:flex;align-items:center;flex-direction:column}.rail-bottom .rail-item{height:60px;gap:5px}.rail-bottom .rail-item>span{font-size:15px;border:1px solid #677560;border-radius:50%;width:18px;height:18px;display:grid;place-items:center}.local-pill{font-size:9px;color:#76846c;display:flex;gap:5px;align-items:center;margin-top:15px}.local-pill i,.green-dot{width:5px;height:5px;background:#a5c780;border-radius:50%;display:inline-block}.editor{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;min-width:0}.editor-heading{display:flex;justify-content:space-between;align-items:center;padding:25px 22px 20px;border-bottom:1px solid #32392f;min-height:95px}.eyebrow{font-family:Space,monospace;font-size:9px;letter-spacing:1.6px;color:#849575;display:block;margin-bottom:8px}.editor-scroll{overflow-y:auto;overflow-x:hidden;padding:21px 22px 30px;flex:1;scrollbar-width:thin;scrollbar-color:#47513d transparent}.editor-footer{height:37px;border-top:1px solid #343b30;display:flex;align-items:center;gap:7px;padding:0 22px;font-size:10px;color:#829078;flex-shrink:0}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 15px}.section-heading>span{font-size:10px;color:#7b8d6f}.form-section{padding-bottom:23px;margin-bottom:23px;border-bottom:1px solid #343c30}.form-section:last-child{border:0}.field{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#a2af98;margin-bottom:15px}.field:last-child{margin-bottom:0}.field-hint,.muted{font-size:10px;color:#819078;line-height:1.7}.field-hint{margin-top:8px}.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:10px}.two-columns .field{margin-bottom:0}.label-row{display:flex;align-items:center;justify-content:space-between}.character-head{display:flex;gap:12px;align-items:center;margin-top:12px;padding:11px;background:#242b22;border:1px solid #3c4835;border-radius:8px}.character-head img{width:43px;height:48px;object-fit:cover;border-radius:3px;background:#3b4535}.character-head strong{font-size:14px;font-weight:600;display:block;margin-bottom:5px}.character-head small{color:#8fa07e;letter-spacing:.8px}.subtle-tag{color:#97ab7e;font-size:10px}.character-head .number{margin-left:auto;color:#adbc9b;font-family:Space;font-size:22px}.image-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}.image-card{border:1px solid #424b3b;background:#242b21;border-radius:7px;overflow:hidden;padding:0;position:relative;text-align:left;color:#c5cdbd}.image-card:hover,.image-card.selected{border-color:var(--accent);background:#303b26}.image-card img{display:block;width:100%;height:105px;object-fit:contain;background:repeating-conic-gradient(#30372b 0% 25%,#293024 0% 50%) 50%/16px 16px;padding:8px}.image-card>span{display:flex;justify-content:space-between;padding:10px;font-size:11px}.image-card>span>b{color:#869b73;font-weight:400}.image-card.selected::after{content:"已选";position:absolute;right:6px;top:6px;background:var(--accent);color:#2a351b;font-size:9px;padding:3px 6px;border-radius:3px}.inline-pickers{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.inline-pickers button{font-size:10px;border:1px solid #46513b;border-radius:4px;padding:6px 9px;color:#9caf8a}.inline-pickers button:hover,.inline-pickers button.selected{color:var(--accent);border-color:#91a867}.skills-list{display:flex;flex-direction:column;gap:12px}.skill-card{background:#252d21;border:1px solid #3c4832;border-radius:8px;padding:12px}.skill-card-top{display:flex;align-items:center;gap:12px}.skill-image{width:53px;height:53px;flex:0 0 53px;border:1px solid #5b694b;border-radius:50%;padding:7px;background:#38432c;position:relative}.skill-image.selected{border-color:var(--accent);box-shadow:0 0 0 2px #d4f18730}.skill-image img{width:100%;height:100%;object-fit:contain}.skill-card input{padding:8px 10px;font-size:11px}.skill-card label{flex:1;font-size:10px;color:#8ea078;display:flex;flex-direction:column;gap:6px}.skill-card-bottom{margin-top:9px;display:flex;gap:6px}.skill-card-bottom button{font-size:10px;color:#a7b494;border:1px solid #48563b;border-radius:4px;padding:6px 8px;flex:1}.skill-card-bottom button:hover{color:var(--accent);border-color:#8aa266}.skill-number{font-family:Space;font-size:10px;color:#6d8359}.control-label{display:flex;justify-content:space-between;color:#a4b693;font-size:11px;margin:18px 0 10px}.control-label>span{font-family:Space;color:#c6d9af}.range-value{font-family:Space;margin-left:auto}.toggle-line{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px;color:#bccbb0}.toggle-line input{width:30px;height:16px}.texture-thumb{width:100%;height:116px;object-fit:cover;object-position:top;background:#eee;border-radius:6px;border:1px solid #64705b}.background-card{padding:14px;border:1px solid #414e35;border-radius:8px;background:#252d21;margin-bottom:16px}.background-card h2{font-size:12px}.background-caption{font-size:10px;color:#81976e;margin-top:8px;line-height:1.6}.background-card .button{margin-top:12px;width:100%}.transform-panel{margin-top:2px;padding-top:2px}.image-preview-wrap{border:1px solid #435036;background:repeating-conic-gradient(#2b3424 0% 25%,#252d20 0% 50%) 50%/16px 16px;border-radius:7px;overflow:hidden;position:relative}.image-preview-wrap canvas{width:100%;height:180px;display:block;touch-action:none;cursor:grab}.image-preview-wrap canvas:active{cursor:grabbing}.drag-tip{display:block;text-align:center;font-size:9px;color:#8b9d78;padding:8px;background:#1d261bcc}.transform-toolbar{display:flex;justify-content:space-between;gap:6px;margin:10px 0 16px}.scale-row{display:flex;gap:12px;align-items:center}.scale-row>input{flex:1;min-width:60px}.number-stepper{display:flex;border:1px solid #45523a;border-radius:5px;overflow:hidden;height:31px;width:118px;flex-shrink:0;background:#151e11}.number-stepper input{padding:0;border:0;background:none;text-align:center;width:46px;box-shadow:none;font-family:Space}.number-stepper button{width:34px;color:#a4b68e;background:#2b3624}.number-stepper button:hover{background:#3c4b30;color:var(--accent)}.position-fields{margin-top:16px}.input-unit{position:relative}.input-unit input{padding-right:27px}.input-unit b{position:absolute;right:9px;top:11px;font-size:9px;color:#6d8357;font-weight:400}.check-label{display:flex;align-items:center;gap:8px;font-size:10px;color:#a6b792;margin-top:14px}.check-label span{margin-left:auto;color:#70855d}.workspace{background:#111511;min-width:0;display:flex;flex-direction:column;position:relative}.preview-toolbar{height:51px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;border-bottom:1px solid #2f382b;gap:15px;flex-shrink:0;background:#1c221a}.preview-tabs{display:flex;align-items:center;height:100%;gap:20px}.preview-tabs button{height:100%;font-size:11px;color:#718267;position:relative;padding:0 3px}.preview-tabs button.active{color:#d5e6c1}.preview-tabs button.active::after{content:"";position:absolute;height:2px;bottom:0;left:2px;right:2px;background:var(--accent)}.view-controls{display:flex;align-items:center;gap:7px;color:#8da178;white-space:nowrap}#zoomValue{font-family:Space;width:35px;text-align:center;font-size:11px}.canvas-viewport{flex:1;min-height:0;overflow:auto;padding:32px 40px 40px;scrollbar-width:thin;scrollbar-color:#3f5033 transparent;background-image:radial-gradient(#40503490 .65px,transparent .65px);background-size:18px 18px;scroll-behavior:smooth}.canvas-stage{margin:0 auto;position:relative;width:600px;flex-shrink:0;transition:width .12s}.sheet-meta{display:flex;justify-content:space-between;align-items:center;position:relative;margin-bottom:12px;color:#81916f;font:9px Space,monospace;letter-spacing:.7px;white-space:nowrap}.sheet-meta i{display:inline-block;width:4px;height:4px;background:var(--accent);margin-right:6px;border-radius:50%}.canvas-wrap{position:relative;background:#f3f3f1;box-shadow:0 12px 60px #0007,0 0 0 1px #405134;line-height:0}.canvas-wrap canvas{display:block;width:100%;height:auto}.canvas-wrap #selection{position:absolute;inset:0;touch-action:none;cursor:default}.canvas-wrap #selection.dragging{cursor:grabbing}.sheet-footer{display:flex;justify-content:space-between;font:8px Space;letter-spacing:1px;color:#5e7350;margin-top:14px}.workspace-footer{height:36px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #2b3826;color:#80916f;font-size:10px;flex-shrink:0;background:#1a2118;gap:10px}.workspace-footer b{margin:0 9px;font-weight:400;color:#526648}.compare-label{position:absolute;top:15px;left:15px;color:#222;background:#e8ffb4;line-height:1;padding:9px 12px;font-size:12px;box-shadow:0 2px 10px #0003;border-radius:4px}.dialog{color:var(--text);background:#1e261b;border:1px solid #4c5e3c;border-radius:12px;padding:0;box-shadow:0 30px 120px #000a;max-height:88vh;max-width:92vw}.dialog::backdrop{background:#080e08c9;backdrop-filter:blur(6px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;padding:24px 26px 21px;border-bottom:1px solid #3f4f32}.dialog-heading h2{font-size:21px}.dialog-heading .eyebrow{font-size:8px;margin-bottom:7px}.library-dialog{width:850px}.library-filter{display:flex;gap:10px;padding:18px 26px}.asset-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;padding:0 26px 20px;max-height:56vh;overflow:auto;scrollbar-width:thin;scrollbar-color:#5b7143 transparent;min-height:150px}.asset-item{border:1px solid #475a36;border-radius:7px;overflow:hidden;padding:0;background:#2b3722;text-align:left}.asset-item:hover{border-color:var(--accent)}.asset-item img{width:100%;height:106px;object-fit:contain;padding:6px;display:block;background:repeating-conic-gradient(#293720 0% 25%,#23301b 0% 50%) 50%/16px 16px}.asset-item>span{display:block;padding:9px 8px;font-size:10px;line-height:1.5;word-break:break-all;color:#c1d4b0}.asset-item small{display:block;color:#7f9a68;font-size:8px}.dialog-footer{padding:13px 26px;border-top:1px solid #415032;color:#94ac7f;font-size:11px}.export-dialog{width:920px}.export-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;min-height:450px}.export-preview{height:65vh;max-height:650px;min-height:360px;overflow:auto;background:#101b0b;padding:23px;scrollbar-width:thin}.export-preview img{display:block;width:100%;height:auto;box-shadow:0 5px 30px #0005}.export-options{padding:28px 25px;display:flex;flex-direction:column;gap:18px}.export-options p{color:#93aa7d;font-size:11px;line-height:1.8}.export-options .tag{align-self:flex-start}.export-options .download-button{margin-top:auto;font-size:13px;padding:12px}.download-button[aria-disabled=true]{opacity:.4;pointer-events:none}.export-options .export-footnote{font-size:9px;line-height:1.7;color:#7b9365}.export-options .field{margin:0}.export-options .muted{font-family:Space}.confirm-dialog{width:380px}.confirm-dialog>p{padding:22px 26px;font-size:12px;line-height:1.8;color:#a9bc96}.confirm-actions{padding:5px 26px 24px;display:flex;justify-content:flex-end;gap:10px}.confirm-dialog .dialog-heading h2{font-size:18px}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,20px);background:#d9edbd;color:#25321d;padding:12px 20px;border-radius:8px;box-shadow:0 8px 30px #0005;opacity:0;pointer-events:none;transition:.2s;z-index:100;font-size:12px;max-width:90vw}.toast.show{opacity:1;transform:translate(-50%,0)}.loading{position:fixed;inset:0;z-index:200;background:#151c13;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px}.loading h2{font-size:19px;color:#d4e4c3;font-weight:500;letter-spacing:1px}.loading p{font-size:12px;color:#82976d}.loader{width:36px;height:36px;border:2px solid #465637;border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:10px}@keyframes spin{to{transform:rotate(360deg)}}[hidden]{display:none!important}.empty-state{grid-column:1/-1;text-align:center;padding:50px;color:#8ca575;font-size:12px}.warning{color:#d8bf74!important}

/* Each pane keeps its own scroll area within the visible application. */
html{height:100%}
body{height:100dvh;min-height:0;display:flex;flex-direction:column;position:static}
.topbar{flex-shrink:0}
.studio{flex:1;min-height:0;height:auto;grid-template-columns:minmax(0,1fr) 342px 82px;grid-template-rows:minmax(0,1fr);grid-template-areas:"preview editor navigation"}
.workspace{grid-area:preview;min-height:0}
.editor{grid-area:editor;border-right:0;border-left:1px solid var(--line)}
.rail{grid-area:navigation;min-height:0;overflow-y:auto;border-right:0;border-left:1px solid var(--line);padding-left:4px;padding-right:4px}
.rail-item{flex-shrink:0}
.rail-item.active::before{left:auto;right:-4px;border-radius:2px 0 0 2px}
.editor-scroll{min-height:0;overscroll-behavior:contain}
.preview-toolbar{height:auto;min-height:51px;flex-wrap:wrap;padding:0 20px;gap:0 16px}
.preview-tabs{min-height:50px;flex-shrink:0}
.preview-tabs button{min-height:50px;white-space:nowrap}
.view-controls{min-height:40px;margin-left:auto;gap:5px}
.view-controls .text-button.active{color:var(--accent)}
.canvas-viewport{min-width:0;overscroll-behavior:contain;overflow-anchor:none;scrollbar-gutter:stable both-edges;scroll-behavior:auto}
.canvas-stage{transition:none}
.image-preview-wrap canvas{width:100%;height:auto;aspect-ratio:14 / 9}
.opacity-number{width:118px;flex-shrink:0;position:relative}
.opacity-number input{height:31px;padding:0 27px 0 10px;font-family:Space;text-align:center}
.opacity-number b{position:absolute;right:12px;top:8px;font-size:11px;font-weight:400;color:#a4b68e;pointer-events:none}
@media(min-width:1600px){
 .studio{grid-template-columns:minmax(0,1fr) 370px 92px}
 .editor-heading{padding:28px}.editor-scroll{padding:25px 28px}.canvas-viewport{padding:32px 48px}
 .topbar{padding:0 30px}.project-title{font-size:13px}
}
@media(max-width:1180px){
 .project-title{display:none}.studio{grid-template-columns:minmax(0,1fr) 315px 72px}
 .rail-item{width:62px}.rail{padding-left:4px;padding-right:4px}
 .topbar{gap:12px;padding:0 18px}.brand{min-width:190px}.header-actions{gap:5px}
 .preview-toolbar{padding:0 15px}.preview-tabs{gap:12px}.view-controls{gap:3px}.view-controls .divider{margin:0 3px}
 .canvas-viewport{padding:26px 24px}.editor-heading{padding:22px 19px}.editor-scroll{padding:19px}
 .save-status{font-size:10px}.workspace-footer{padding:0 15px;font-size:9px}
 .workspace-footer>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .workspace-footer>span:last-child{white-space:nowrap}
}
@media(max-width:980px){
 .studio{grid-template-columns:minmax(0,1fr) 290px 64px}
 .rail-item{width:54px;height:76px}.rail-item>b{font-size:10px}.rail-item>small{display:none}
 .editor-scroll{padding:16px}.editor-heading{padding:18px 16px}
 .topbar{height:64px;padding:0 13px}.brand{min-width:150px;font-size:15px}.brand small{font-size:6px}
 .save-status{display:none}.header-actions{gap:5px}.header-actions .divider{margin:0 2px}
 .preview-toolbar{padding:0 12px;gap:0 8px}.preview-tabs{gap:12px}
 .view-controls .text-button{font-size:10px}.view-controls #compare,.view-controls .divider{display:none}
 .image-card img{height:88px}.transform-toolbar{flex-wrap:wrap}.transform-toolbar .button{flex:1}
 .transform-toolbar .text-button{padding:4px 12px}
 .export-layout{grid-template-columns:minmax(0,1fr) 270px}
 .asset-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.canvas-viewport{padding:22px 20px}
 .workspace-footer>span:last-child{display:none}
}
@media(max-width:760px){
 body{height:auto;min-height:100dvh;display:block;overflow:auto}
 .topbar{height:60px;gap:10px;position:sticky;top:0}
 .brand{font-size:13px;min-width:0}.brand small{display:none}
 .brand-icon{width:30px;height:30px;font-size:25px}
 .header-actions .icon-btn,.header-actions .divider{display:none}
 .header-actions .button{padding:7px 10px;font-size:10px;min-height:30px}
 .studio{grid-template-columns:minmax(0,1fr);grid-template-rows:56px minmax(360px,65dvh) auto;grid-template-areas:"navigation" "preview" "editor";height:auto}
 .rail{flex-direction:row;justify-content:center;padding:4px 10px;border-left:0;border-bottom:1px solid var(--line);gap:8px;overflow:visible}
 .rail-caption,.rail-bottom,.rail-item>small{display:none}
 .rail-item{width:auto;flex:1;height:45px;margin:0;flex-direction:row;gap:7px;padding:0 10px}
 .rail-item>span{font-size:18px}.rail-item>b{font-size:11px}.rail-item.active::before{display:none}
 .editor{border-top:1px solid var(--line);border-left:0;max-height:none}
 .editor-heading{min-height:75px}.editor-scroll{overflow:visible;padding:20px;flex:none}.editor-footer{height:40px}
 .canvas-viewport{padding:20px 18px}.preview-toolbar{padding:0 12px}
 .preview-toolbar .text-button{font-size:10px}.workspace-footer{height:32px}
 .editor .image-cards{grid-template-columns:1fr 1fr}.image-card img{height:140px}
 .image-preview-wrap{max-width:480px}.image-preview-wrap canvas{height:auto}
 .asset-grid{grid-template-columns:repeat(3,minmax(0,1fr));padding:0 16px 16px;gap:8px}
 .dialog-heading{padding:19px}.library-filter{padding:15px}
 .export-layout{display:flex;flex-direction:column}.export-preview{height:35vh;min-height:180px}
 .export-options{padding:20px;gap:12px}.export-options h3{font-size:17px}.export-options .download-button{margin-top:0}
 .dialog{max-height:90dvh;width:94vw;max-width:94vw}.export-footnote{display:none}
 .library-filter .button{font-size:10px}.asset-item img{height:85px}
}
@media(max-width:480px){
 .topbar{height:auto;min-height:96px;padding:10px 13px;flex-wrap:wrap;gap:8px}
 .brand{width:100%}.header-actions{width:100%;margin:0;gap:7px}.header-actions .button{flex:1}
 .preview-toolbar{padding:0 12px}.preview-tabs{min-height:40px}.preview-tabs button{min-height:40px}
 .view-controls{margin-left:auto;min-height:36px}
 .workspace-footer{font-size:9px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Restore one image without changing text or neighboring slots. */
.image-option{min-width:0}
.image-option .image-card{width:100%}
.slot-reset{font-size:10px;color:#a7b992;border:1px solid #46533b;border-radius:4px;padding:6px 9px;white-space:nowrap}
.slot-reset:hover{color:var(--accent);border-color:#8aa763;background:#303b26}
.image-option>.slot-reset{width:100%;margin-top:7px}
.inline-pickers .inline-picker{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.inline-pickers .inline-picker .slot-reset{font-size:9px;padding:6px 7px}
.background-card>.slot-reset{display:block;width:100%;margin-top:9px}
#restoreImageDefault{font-size:10px}

/* Primary editing actions stay together and use consistent visual weight. */
.editor-modes{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 18px 12px;border-bottom:1px solid var(--line);background:#222922;flex-shrink:0}
.editor-modes button{border:1px solid #627353;background:#293327;color:#d7e4ce;min-height:39px;border-radius:6px;font-size:13px;font-weight:600}
.editor-modes button.active{background:var(--accent);border-color:var(--accent);color:#25311d}
.section-intro{font-size:12px;line-height:1.6;color:#c0ceb4;margin:0 0 15px}
.section-heading h2{font-size:16px}.section-heading>span{font-size:11px;color:#abbda0}
.character-info-line{display:flex;justify-content:space-between;gap:12px;color:#b6c6ab;font-size:12px}.character-info-line strong{color:#eef5e7}
.image-cards{gap:16px 12px}.image-card{background:#273323;border-color:#69795a}.image-card img{height:108px;padding:10px}.image-card>span{font-size:12px;font-weight:600;padding:11px 10px;color:#edf4e5;gap:6px}.image-card>span>b{font-size:10px;color:#badb94;white-space:nowrap}
.image-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:7px}.image-actions button{background:#34472b;border:1px solid #829b65;color:#eff8e5;border-radius:5px;min-height:33px;font-size:11px;padding:5px 3px}
.image-actions button:hover{background:#4c623b}.image-option>.slot-reset{color:#c6d5b9;border-color:#657753;font-size:10px;min-height:29px;background:#263021}
.apply-skills{width:100%;margin-bottom:18px;font-size:12px;min-height:38px}
.back-to-images{font-size:12px;color:var(--accent);padding:8px 0 15px;display:block}.transform-panel{scroll-margin-top:16px;padding-top:10px;border-top:1px solid #65734f}.transform-panel .section-heading{margin-bottom:13px}
.text-field{padding:15px;background:#232c21;border:1px solid #4a5c3d;border-radius:8px;margin-bottom:16px;gap:10px}.text-field>.label-row{font-size:13px;font-weight:600;color:#e4eedb}.text-field input,.text-field textarea{font-size:13px}
.type-controls{border-top:1px solid #48553e;padding-top:10px}.type-controls>summary{cursor:pointer;color:#d8edbd;font-size:12px;line-height:1.7;list-style-position:inside}.type-controls>summary>span{display:block;margin-top:3px;font-size:10px;line-height:1.6;color:#a9b99b}
.type-controls-body{display:flex;flex-direction:column;gap:13px;padding-top:13px}.type-controls-body label{font-size:11px;color:#bccdaf;display:flex;flex-direction:column;gap:7px}.type-controls-body select{font-size:11px;padding:9px 7px}.type-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.type-controls-body .check-label{flex-direction:row;align-items:center;margin-top:0}.type-controls-body input[type=color]{padding:4px;height:35px;cursor:pointer}.type-controls-body .restore-type{padding:9px;border:1px solid #849e68;border-radius:5px;color:#e2f3cf;font-size:11px}.preview-warning{padding:9px 18px;font-size:12px;line-height:1.6;color:#f3d998;background:#453c21;border-bottom:1px solid #695c32;flex-shrink:0}
@media(min-width:1200px){.studio{grid-template-columns:minmax(0,1fr) 376px 82px}}
@media(min-width:1600px){.studio{grid-template-columns:minmax(0,1fr) 400px 92px}}
@media(max-width:980px){.image-card img{height:94px}.image-card>span{font-size:11px;padding:9px 7px}.image-actions button{font-size:10px}.image-card>span>b{font-size:9px}}
@media(max-width:760px){.editor-modes{position:sticky;top:60px;z-index:5}.image-card img{height:140px}.image-card>span{font-size:13px}.image-actions button{font-size:12px;min-height:38px}.text-field{padding:16px}.transform-panel{scroll-margin-top:125px}}
@media(max-width:480px){.editor-modes{top:96px}.transform-panel{scroll-margin-top:160px}.image-card>span{font-size:12px}}

.weapon-group-toggle .toggle-line span{display:flex;flex-direction:column;gap:7px}.weapon-group-toggle strong{font-size:14px;color:#e5f4d6}.weapon-group-toggle small{font-size:11px;color:#aebea1}.weapon-group-toggle .text-button{margin-top:12px;padding:0;font-size:11px}.weapon-group-toggle input{accent-color:var(--accent)}
@media(max-width:760px){.rail{gap:3px;padding:4px}.rail-item{padding:0 6px;gap:4px}.rail-item>b{font-size:10px}.rail-item>span{font-size:15px}}

.image-card{position:relative}.slot-state{position:absolute;left:7px;top:7px;padding:4px 6px;border-radius:4px;background:#493c24;color:#f3d99e;font-size:9px;line-height:1.2}

/* Fixed tab row height avoids percentage sizing pushing wrapped zoom controls outside the toolbar. */
.preview-tabs{height:50px}.view-controls{height:40px}
@media(max-width:480px){.preview-tabs{height:40px}.view-controls{height:36px}}

/* Cover editing uses the same controls as the PSD sections. */
.logo-url-field{margin-top:16px}.cover-library-filter{padding:0 26px 14px}.cover-library-filter:has(select[hidden]){display:none}#coverTheme{width:52px;height:32px;padding:3px}.preview-tabs{gap:16px}
@media(max-width:760px){.rail-item{padding:0 4px;gap:3px}.rail-item>span{font-size:13px}.rail-item>b{font-size:10px}.preview-tabs{gap:12px}.cover-library-filter{padding:0 15px 12px}}

.editor-modes.cover-modes{grid-template-columns:repeat(3,minmax(0,1fr));padding-left:14px;padding-right:14px}.editor-modes.cover-modes button{font-size:12px}.cover-part-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 10px}.cover-part-option{min-width:0}.cover-part-card{display:flex;flex-direction:column;align-items:flex-start;gap:10px;width:100%;padding:15px 12px;background:#293426;border:1px solid #617653;border-radius:7px;text-align:left;color:#e7f1df}.cover-part-card>b{height:30px;display:flex;align-items:center;color:var(--accent);font-size:24px;font-family:Space,sans-serif}.cover-part-card>span{font-size:12px;font-weight:600}.cover-part-card>small{font-size:10px;color:#b6ce9b}.cover-part-card.selected{border-color:var(--accent);background:#3c4b2f}.cover-part-option>.slot-reset{width:100%;margin-top:6px}.separator-toggle .toggle-line>span{display:flex;flex-direction:column;gap:7px}.separator-toggle strong{font-size:13px;color:#e7f1df}.separator-toggle small{font-size:10px;line-height:1.6;color:#a7b99a}.preview-tabs{gap:12px}
@media(max-width:760px){.rail-item{gap:2px;padding:0 3px}.rail-item>span{font-size:12px}.rail-item>b{font-size:9px}.editor-modes.cover-modes{grid-template-columns:repeat(3,minmax(0,1fr))}}

.cover-library-filter:has(select:not([hidden])){display:block}.cover-library-filter>select+select:not([hidden]){margin-top:8px}

/* Layer order and purple alignment aids */
.cover-modes{grid-template-columns:repeat(4,minmax(0,1fr))}.cover-modes button{padding:10px 2px;font-size:12px}.image-option{position:relative}.image-visibility{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 9px;color:var(--muted);font-size:12px}.image-visibility input,.guide-toggles input{accent-color:#b45cff;width:16px;height:16px}.image-option.is-hidden .image-card img{opacity:.25}.inspector-visibility{margin:12px 0;padding:12px;background:#252c23;border:1px solid #46523b;border-radius:8px}.layer-top-actions,.layer-order-actions{display:flex;gap:5px;margin:12px 0}.layer-top-actions button,.layer-order-actions button,.align-buttons button,.manual-guide button{border:1px solid #4a5340;background:#242c22;border-radius:6px;color:#dfedc7;padding:8px;cursor:pointer}.layer-top-actions button{flex:1;font-size:12px}.layer-order-actions button{flex:1;font-size:12px}.layer-tree{border:1px solid #454d3b;border-radius:8px;overflow:hidden}.layer-row{display:flex;align-items:center;min-height:40px;padding:0 7px 0 calc(5px + var(--depth)*14px);border-bottom:1px solid #343c31;background:#1c221d;gap:2px}.layer-row.selected{background:#35402a;box-shadow:inset 3px 0 #d7f36b}.layer-row.dimmed{color:#77836d}.layer-row.drop-target{box-shadow:inset 0 3px #b45cff;background:#3d2d4e}.layer-row button{border:0;background:none;color:inherit;cursor:pointer;min-width:23px;padding:7px 2px;font-size:13px}.layer-row .layer-name{text-align:left;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-symbol{width:23px;text-align:center;color:#9eaa90}.layer-grip{cursor:grab;color:#7d8a70}.layer-panel .field{margin:13px 0}.alignment-tools{margin-top:22px;padding:16px;border:1px solid #72508e;border-radius:9px;background:#24212b}.alignment-tools h2{font-size:15px}.purple-tag{color:#cb91ff}.guide-toggles{display:flex;gap:16px;font-size:12px;margin:14px 0}.guide-toggles label{display:flex;align-items:center;gap:5px}.align-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.align-buttons button{font-size:12px;border-color:#72508e;background:#35283e;color:#e9d4ff}.manual-guide{display:grid;grid-template-columns:1fr 70px 65px;gap:5px}.manual-guide select,.manual-guide input{width:100%;padding:7px 4px;font-size:12px}.manual-guide-item{display:flex;align-items:center;justify-content:space-between;color:#d9b1ff;font-size:12px;padding:6px;border-bottom:1px solid #47334f}.manual-guide-item button{background:none;color:#d9b1ff;border:0;cursor:pointer}.guide-readout{position:absolute;z-index:5;left:16px;top:115px;max-width:calc(100% - 32px);background:#42205ce8;border:1px solid #bc77ff;border-radius:6px;padding:7px 12px;color:#f4eaff;font-size:12px;pointer-events:none;box-shadow:0 3px 16px #0005}.workspace{position:relative}.cover-part-option .image-visibility{margin-top:7px}

.editor-modes.cover-modes{grid-template-columns:repeat(4,minmax(0,1fr))}.editor-modes.cover-modes button{font-size:11px;white-space:nowrap}

.alignment-link{color:#dfb9ff;border-color:#8251a2;background:#35283e}.alignment-tools{scroll-margin-top:12px}

.layer-grip{touch-action:none;user-select:none;padding:8px 3px;min-width:18px}.layer-row.drag-source{opacity:.45}.layer-row.drop-before{box-shadow:inset 0 3px #b45cff}.layer-row.drop-after{box-shadow:inset 0 -3px #b45cff}.layer-grip:focus-visible{outline:1px solid #b45cff}
