:root { --studio-bg:#18100a; --studio-panel:#2b1c12; --studio-panel-soft:#24170e; --studio-line:#523929; --studio-text:#fffaf6; --studio-muted:#c5a894; --studio-purple:#f7a670; --studio-green:#35cda0; }
.studio-shell { min-height:100vh; background:radial-gradient(circle at 70% -20%,#54321b 0,transparent 35%),var(--studio-bg); color:var(--studio-text); display:grid; grid-template-columns:248px minmax(0,1fr); font-family:Inter,ui-sans-serif,system-ui,sans-serif; }
.studio-sidebar { position:sticky; top:0; height:100vh; box-sizing:border-box; padding:20px 13px 14px; display:flex; flex-direction:column; border-right:1px solid var(--studio-line); background:#1f130be8; backdrop-filter:blur(18px); }
.studio-logo { height:40px; display:flex; align-items:center; gap:10px; padding:0 11px; color:#fff; font-family:Georgia,serif; font-size:20px; text-decoration:none; letter-spacing:-.5px; }.studio-logo img{width:26px;height:26px;image-rendering:pixelated}
.studio-primary { display:grid; gap:3px; margin-top:28px; }.studio-primary button,.studio-sidebar-bottom>a { border:0; background:transparent; color:var(--studio-muted); font:600 14px/1 Inter,sans-serif; text-align:left; display:flex; align-items:center; gap:11px; padding:10px 11px; border-radius:8px; cursor:pointer; }.studio-primary button:hover,.studio-primary button.is-active { color:#fff; background:#463022; }.studio-primary button.is-active .studio-icon{color:#fac39f}.studio-icon{font-size:17px;width:17px;text-align:center;color:#c7a690}.studio-sidebar-rule{height:1px;background:var(--studio-line);margin:20px 8px 15px}.studio-sidebar-label{font-size:10px;letter-spacing:1.2px;font-weight:800;color:#ad8a73;margin:0 11px}.studio-tools{margin-top:8px}.studio-sidebar-bottom{margin-top:auto;display:grid;gap:9px}.studio-sidebar-bottom>a{text-decoration:none;padding:9px 11px}.studio-user{border:1px solid #5a3f2d;background:#2e1e13;color:#f3e3d9;border-radius:10px;padding:9px;display:flex;align-items:center;gap:8px;cursor:pointer}.studio-user>span{display:grid;place-items:center;background:linear-gradient(135deg,#f9b88c,#f69656);width:26px;height:26px;border-radius:7px;font-size:10px;font-weight:800}.studio-user b{font-size:11px;flex:1;text-align:left}
.studio-main{min-width:0}.studio-view{max-width:1320px;margin:0 auto;padding:48px 54px 70px}.studio-topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:31px}.studio-kicker{display:block;color:#f6c2a0;font-size:10px;letter-spacing:1.4px;font-weight:800;margin-bottom:8px}.studio-topbar h1,.studio-composer h2,.studio-section h2,.studio-theme-banner h2,.studio-theme-detail h2{font-family:Georgia,serif;letter-spacing:-1px;margin:0;color:#fff}.studio-topbar h1{font-size:37px}.studio-topbar p{color:var(--studio-muted);font-size:15px;margin:8px 0 0}.studio-credit{min-width:154px;padding:11px 14px;border:1px solid #624a3a;background:#2b211a;border-radius:10px;display:grid;grid-template-columns:1fr auto;gap:1px}.studio-credit span,.studio-credit small{font-size:10px;color:#d8afbd}.studio-credit b{font-size:12px;color:#ffbdcb}.studio-credit small{grid-column:1/-1;color:#b2927c}.studio-upload{border:0;border-radius:9px;background:#f7a670;color:#fff;padding:12px 15px;font-weight:800;cursor:pointer;box-shadow:0 8px 22px #9d61395c}
.studio-composer{border:1px solid #624836;border-radius:16px;background:linear-gradient(145deg,#342216,#2a1b11);padding:25px;box-shadow:0 24px 60px #0004}.studio-composer-head,.studio-composer-footer,.studio-section-title{display:flex;justify-content:space-between;align-items:center;gap:14px}.studio-composer h2{font-size:25px}.studio-reference-open{border:1px solid #795943;background:#3a2618;color:#fdeade;border-radius:8px;padding:9px 12px;font-weight:700;cursor:pointer}.studio-composer textarea{box-sizing:border-box;resize:none;width:100%;min-height:105px;margin:20px 0 15px;border-radius:10px;padding:16px;color:#fffaf7;background:#1c110a;border:1px solid #573e2d;font:15px/1.45 Inter,sans-serif;outline:0}.studio-composer textarea:focus{border-color:#f9b486;box-shadow:0 0 0 3px #f7a67022}.studio-type-select{border:0;background:transparent;color:#d7bdac;cursor:pointer;padding:6px}.studio-type-select b{color:#fff}.studio-theme-pill{color:#8be6c9;font-size:12px}.studio-theme-pill i{display:inline-block;width:7px;height:7px;border-radius:9px;background:#35cda0;margin-right:5px}.studio-create{border:0;border-radius:8px;padding:11px 17px;background:#f7a670;color:#fff;font-weight:800;cursor:pointer}.studio-create:disabled{background:#564032;color:#ac8a73;cursor:not-allowed}.studio-create span{margin-left:9px}.studio-references{margin-top:13px}
.studio-tool-launcher{margin:37px 0}.studio-tool-launcher>div{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;margin-top:13px}.studio-tool-launcher button{padding:15px;border:1px solid #503828;background:#291b11;color:#f1e1d7;border-radius:10px;text-align:left;cursor:pointer;transition:.15s}.studio-tool-launcher button:hover{border-color:#d8976b;transform:translateY(-2px);background:#352317}.studio-tool-launcher button>span{display:block;color:#fabe97;font-size:21px;margin-bottom:14px}.studio-tool-launcher b,.studio-tool-launcher small{display:block}.studio-tool-launcher b{font-size:13px;color:#fff}.studio-tool-launcher small{color:#ba9c88;margin-top:5px;font-size:11px;line-height:1.35}.studio-section{margin-top:39px}.studio-section-title h2{font-size:25px}.studio-section-title>button{border:0;background:transparent;color:#fac6a4;font-weight:800;cursor:pointer}.studio-recent-grid{margin-top:15px;display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.studio-asset-card{border:1px solid #503828;border-radius:10px;padding:0;background:#291b11;color:#f7e9e0;overflow:hidden;text-align:left;cursor:pointer;position:relative}.studio-asset-card:hover{border-color:#d9996e}.studio-thumb{height:132px;display:block;overflow:hidden;background:#1b110b}.studio-thumb img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.checker{background-color:#2e1d12;background-image:linear-gradient(45deg,#422b1b 25%,transparent 25%),linear-gradient(-45deg,#422b1b 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#422b1b 75%),linear-gradient(-45deg,transparent 75%,#422b1b 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.studio-asset-copy{display:grid;gap:4px;padding:11px 12px 12px}.studio-asset-copy b{font-size:13px;color:#fff}.studio-asset-copy small{font-size:10px;color:#c7aa97}.studio-card-more{position:absolute;right:9px;bottom:11px;color:#bda08d;font-weight:900}.studio-theme-banner{margin-top:39px;border:1px solid #634430;border-radius:15px;background:linear-gradient(105deg,#372112,#3d2515 55%,#412b1c);padding:20px;display:grid;grid-template-columns:110px 1fr auto;gap:22px;align-items:center}.studio-theme-art{height:105px;background:#28180e;border-radius:10px;display:grid;place-items:center}.studio-theme-art img{max-height:85px;max-width:85px;image-rendering:pixelated}.studio-theme-banner h2{font-size:26px}.studio-theme-banner p{color:#d3bbab;max-width:610px;line-height:1.5;font-size:13px}.studio-theme-banner button{border:0;background:transparent;color:#84efd1;padding:0;font-weight:800;cursor:pointer}.studio-theme-spec{display:grid;gap:6px;color:#adf0db;font-size:11px;text-align:right}
.studio-library-layout{display:grid;grid-template-columns:195px 1fr;border:1px solid #543b2b;background:#25180f;border-radius:14px;overflow:hidden}.studio-library-nav{border-right:1px solid #543b2b;padding:14px;display:grid;align-content:start;gap:4px}.studio-library-nav button{border:0;background:transparent;border-radius:7px;color:#d0b6a5;text-align:left;padding:9px;cursor:pointer;font-size:12px}.studio-library-nav button:hover,.studio-library-nav button.active{background:#473122;color:#fff}.studio-library-nav button b{float:right;font-size:10px}.studio-library-nav p{font-size:10px;color:#aa856d;font-weight:800;letter-spacing:1.2px;margin:16px 9px 4px}.studio-library-nav .studio-new-project{color:#fac6a4}.studio-library-main{padding:20px}.studio-library-toolbar{display:flex;gap:12px;align-items:center;margin-bottom:21px}.studio-library-toolbar label,.studio-preset-controls label{display:flex;align-items:center;gap:8px;background:#1f130b;border:1px solid #583e2c;border-radius:8px;padding:9px 11px;color:#c4a793}.studio-library-toolbar input,.studio-preset-controls input{background:transparent;border:0;outline:0;color:#fef1e9;font:12px Inter,sans-serif;min-width:150px}.studio-library-toolbar>button{margin-left:auto;border:1px solid #583e2c;background:#332216;color:#ecd6c7;border-radius:8px;padding:9px;font-size:11px}.studio-filter-row{display:flex;gap:4px}.studio-filter-row button,.studio-preset-controls>div button,.studio-preset-filters button{background:transparent;border:0;border-radius:6px;color:#c7ab98;padding:7px 8px;font-size:11px;cursor:pointer}.studio-filter-row button.active,.studio-preset-controls>div button.active,.studio-preset-filters button.active{color:#fff;background:#654937}.studio-assets-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.studio-assets-grid .studio-thumb{height:174px}
.studio-project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.studio-project-card{border:1px solid #5a402e;background:#2d1d12;border-radius:13px;color:#fff;padding:0 0 16px;text-align:left;overflow:hidden;cursor:pointer}.studio-project-card:hover{border-color:#e7a77c}.studio-project-art{height:155px;display:grid;place-items:center;background:radial-gradient(circle at 50% 20%,var(--project),#291b12 68%)}.studio-project-art img{height:124px;max-width:80%;object-fit:contain;image-rendering:pixelated}.studio-project-card>b,.studio-project-card small,.studio-project-card>span:last-child{display:block;margin:13px 15px 0}.studio-project-card b{font-size:15px}.studio-project-card small{font-size:11px;color:#c7ae9d;margin-top:4px}.studio-project-card>span:last-child{font-size:11px;color:#fac6a4;font-weight:800}
.studio-theme-workbench{display:grid;grid-template-columns:280px 1fr;border:1px solid #5a402e;background:#291b11;border-radius:14px;overflow:hidden}.studio-theme-list{padding:15px;border-right:1px solid #5a402e;display:grid;gap:7px;align-content:start}.studio-theme-list button{border:1px solid transparent;background:transparent;color:#f1dbcd;padding:12px;border-radius:9px;text-align:left;display:flex;align-items:center;gap:10px;cursor:pointer}.studio-theme-list button.active{background:#463022;border-color:#725541}.studio-theme-list i{width:9px;height:9px;border-radius:50%;background:#38d2a5}.studio-theme-list i.green{background:#99c65b}.studio-theme-list i.violet{background:#d39770}.studio-theme-list span{display:grid;gap:3px;flex:1}.studio-theme-list b{font-size:12px}.studio-theme-list small{font-size:10px;color:#bda08c}.studio-theme-list em{font-style:normal;font-size:10px;color:#c3a794}.studio-theme-detail{padding:29px}.studio-theme-detail-title{display:flex;justify-content:space-between;gap:15px}.studio-theme-detail h2{font-size:28px}.studio-theme-detail p{font-size:13px;color:#cfb8a8}.studio-theme-detail-title button,.studio-theme-reference button{border:1px solid #7b5a44;background:#392619;color:#fdeade;border-radius:8px;padding:9px 11px;align-self:start;cursor:pointer;font-weight:700}.studio-theme-rules{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.studio-theme-rules article{border:1px solid #563d2c;border-radius:9px;padding:13px}.studio-theme-rules article>span{font-size:9px;letter-spacing:1px;font-weight:800;color:#af8e78}.studio-theme-rules p{margin:8px 0 0;font-size:12px;color:#f7e7dc}.studio-theme-rules p b{display:inline-block;padding:4px 6px;border-radius:5px;background:#4f3727;color:#fbd0b4;font-size:10px;margin-right:4px}.studio-swatches i{display:inline-block;width:16px;height:16px;border-radius:4px;margin-right:4px;background:#462e1e}.studio-swatches i:nth-child(2){background:#a1795f}.studio-swatches i:nth-child(3){background:#d39f7c}.studio-swatches i:nth-child(4){background:#d4b46e}.studio-swatches i:nth-child(5){background:#eee6e0}.studio-swatches small{font-size:10px;margin-left:5px;color:#d5bbaa}.studio-theme-reference{border-top:1px solid #563d2c;margin-top:24px;padding-top:20px}.studio-theme-reference>div{display:flex;align-items:center;gap:12px}.studio-theme-reference .checker{width:58px;height:58px;border-radius:8px;display:grid;place-items:center}.studio-theme-reference img{max-width:49px;max-height:49px;image-rendering:pixelated}.studio-theme-reference p{display:grid;gap:3px;flex:1}.studio-theme-reference p b{color:#fef5ef;font-size:12px}.studio-theme-reference p small{font-size:11px;color:#c6ab99}
.studio-preset-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}.studio-preset-controls>div{display:flex;background:#2c1c12;border:1px solid #573d2b;border-radius:8px;padding:3px}.studio-preset-filters{display:flex;align-items:center;gap:6px;border-bottom:1px solid #573d2b;padding-bottom:14px;margin-bottom:19px}.studio-preset-filters span{font-size:9px;color:#ae8c76;letter-spacing:1px;font-weight:800;margin-left:12px}.studio-preset-filters span:first-child{margin-left:0}.studio-preset-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.studio-preset-card{border:1px solid #573d2b;border-radius:12px;background:#2d1d12;color:#fff;overflow:hidden;text-align:left;padding:0 0 10px;position:relative;cursor:pointer}.studio-preset-card:hover{border-color:#e19c6e}.studio-preset-image{height:170px;background:#1f130b;display:grid;place-items:center}.studio-preset-image img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.studio-preset-badge{position:absolute;top:10px;left:10px;background:#6d4428;color:#fbd4ba;padding:4px 6px;border-radius:5px;font-size:8px;font-weight:900;letter-spacing:.5px;text-transform:uppercase}.studio-preset-more{position:absolute;right:10px;top:10px;width:25px;height:25px;border-radius:50%;background:#311f13d9;display:grid;place-items:center;color:#fde9db}.studio-preset-card>b,.studio-preset-card>small,.studio-preset-card footer{display:block;margin:10px 11px 0}.studio-preset-card>b{font-size:13px}.studio-preset-card>small{font-size:10px;color:#c7aa97;margin-top:4px}.studio-preset-card footer{display:flex;justify-content:space-between;color:#bc9f8b;font-size:10px}
.studio-overlay{position:fixed;z-index:50;inset:0;background:#130b06b8;backdrop-filter:blur(10px);display:grid;place-items:center;padding:24px}.studio-dialog{width:min(900px,100%);max-height:min(780px,calc(100vh - 48px));overflow:auto;border:1px solid #76543d;background:#2b1b11;border-radius:16px;box-shadow:0 30px 100px #0009}.studio-dialog>header{padding:20px 22px;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #573d2c}.studio-dialog h2{font-family:Georgia,serif;letter-spacing:-.5px;margin:0;font-size:27px}.studio-dialog header p{margin:5px 0 0;color:#c7aa97;font-size:12px}.studio-dialog [data-modal-close]{border:0;background:#432f22;color:#f6e5d9;border-radius:8px;padding:8px 10px;cursor:pointer;font-weight:800}.studio-reference-dialog{width:min(760px,100%)}.studio-reference-upload{margin:20px;width:calc(100% - 40px);border:1px dashed #967057;border-radius:10px;background:#322014;color:#fde9db;padding:18px;display:grid;grid-template-columns:30px 1fr;text-align:left;cursor:pointer}.studio-reference-upload .studio-icon{grid-row:span 2;font-size:22px;color:#fac6a4}.studio-reference-upload small{font-size:11px;color:#c9a994;margin-top:4px}.studio-dialog-label{font-size:10px;font-weight:800;letter-spacing:1px;color:#af8e78;margin:20px}.studio-reference-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 20px}.studio-reference-grid button{border:1px solid #5d4230;background:#24170e;border-radius:9px;padding:7px;color:#f9e8de;text-align:left;cursor:pointer}.studio-reference-grid button.selected{border-color:#eaa77a;background:#483020}.studio-reference-grid .checker{display:grid;place-items:center;height:91px;border-radius:5px}.studio-reference-grid img{max-width:80px;max-height:80px;image-rendering:pixelated}.studio-reference-grid b,.studio-reference-grid small{display:block;margin-top:7px}.studio-reference-grid b{font-size:10px}.studio-reference-grid small{color:#c6a894;font-size:9px;margin-top:3px}.studio-reference-dialog footer{padding:18px 20px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #573d2c;margin-top:20px;color:#c8a995;font-size:11px}.studio-confirm-references,.studio-apply-preset{border:0;border-radius:8px;background:#f7a670;color:#fff;padding:10px 13px;font-weight:800;cursor:pointer}.studio-asset-dialog{width:min(1160px,100%)}.studio-asset-dialog>header{align-items:center}.studio-asset-dialog-actions{display:flex;gap:7px}.studio-asset-detail{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(305px,.8fr);min-height:530px}.studio-asset-preview{position:relative;display:grid;place-items:center;padding:35px}.studio-asset-preview>img{max-width:80%;max-height:430px;image-rendering:pixelated}.studio-zoom{position:absolute;bottom:20px;padding:8px 13px;border-radius:8px;background:#2e1e13e8;color:#efdacc;font-size:12px}.studio-asset-detail aside{border-left:1px solid #573d2c;padding:27px 22px}.studio-asset-detail h2{font-family:Georgia,serif;margin:0;font-size:28px}.studio-detail-meta{font-size:11px;color:#c6a894;margin:7px 0 20px}.studio-action-group{display:grid;gap:6px;padding:17px 0;border-top:1px solid #573d2b}.studio-action-group>span{font-size:9px;color:#ae8b74;font-weight:800;letter-spacing:1px}.studio-action-group button{background:#372417;border:1px solid #5e422f;color:#f9ece3;border-radius:7px;padding:9px 10px;text-align:left;font-weight:800;cursor:pointer;font-size:12px}.studio-action-group button:hover{border-color:#e3a378}.studio-action-group small{display:block;color:#c7a893;font-weight:500;font-size:10px;margin-top:3px}.studio-preset-dialog{width:min(780px,100%)}.studio-preset-detail{display:grid;grid-template-columns:310px 1fr;gap:25px;padding:23px}.studio-preset-detail>img{width:100%;height:280px;object-fit:contain;background:#22150d;border-radius:10px;image-rendering:pixelated}.studio-preset-detail p{color:#d8c2b4;line-height:1.5;font-size:13px}.studio-preset-detail dl{margin:18px 0}.studio-preset-detail dl>div{padding:8px 0;border-top:1px solid #573d2b;display:flex;justify-content:space-between;gap:12px;font-size:12px}.studio-preset-detail dt{color:#b89985}.studio-preset-detail dd{color:#f9ebe2;margin:0;text-align:right}.studio-keep-theme{display:flex;gap:8px;color:#e9d4c6;font-size:11px;margin:14px 0}.studio-toast{position:fixed;z-index:70;bottom:23px;left:50%;transform:translate(-50%,20px);opacity:0;background:#543a28;border:1px solid #a37d63;color:#fef5ef;padding:12px 16px;border-radius:9px;font-size:12px;box-shadow:0 15px 40px #0008;pointer-events:none;transition:.2s}.studio-toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1000px){.studio-shell{grid-template-columns:74px 1fr}.studio-logo span,.studio-primary span,.studio-sidebar-label,.studio-sidebar-bottom>a span,.studio-user b,.studio-user .studio-icon{display:none}.studio-sidebar{align-items:center;padding-left:9px;padding-right:9px}.studio-logo{padding:0}.studio-primary button{padding:10px}.studio-sidebar-bottom{width:100%}.studio-user{justify-content:center}.studio-view{padding:33px 28px}.studio-tool-launcher>div{grid-template-columns:repeat(3,1fr)}.studio-recent-grid,.studio-preset-grid{grid-template-columns:repeat(2,1fr)}.studio-theme-banner{grid-template-columns:90px 1fr}.studio-theme-spec{display:none}}
@media(max-width:660px){.studio-shell{display:block}.studio-sidebar{position:static;height:auto;display:flex;flex-direction:row;align-items:center;gap:7px;padding:9px;border-bottom:1px solid var(--studio-line)}.studio-primary{display:flex;margin:0;gap:1px}.studio-primary button{padding:8px}.studio-tools,.studio-sidebar-rule,.studio-sidebar-bottom{display:none}.studio-view{padding:27px 16px}.studio-topbar{display:block}.studio-topbar h1{font-size:31px}.studio-credit{margin-top:17px;width:max-content}.studio-composer{padding:17px}.studio-composer-footer{flex-wrap:wrap}.studio-tool-launcher>div{grid-template-columns:1fr 1fr}.studio-recent-grid,.studio-assets-grid,.studio-preset-grid,.studio-project-grid{grid-template-columns:1fr 1fr}.studio-theme-banner{grid-template-columns:1fr}.studio-theme-art{display:none}.studio-library-layout,.studio-theme-workbench,.studio-asset-detail,.studio-preset-detail{grid-template-columns:1fr}.studio-library-nav{display:none}.studio-library-toolbar{flex-wrap:wrap}.studio-filter-row{overflow:auto}.studio-theme-detail{padding:18px}.studio-theme-rules{grid-template-columns:1fr}.studio-asset-detail aside{border-left:0;border-top:1px solid #573d2c}.studio-preset-detail>img{height:190px}.studio-reference-grid{grid-template-columns:1fr 1fr}}

/* App visual system: matches the main SpriteForge site typography and the neutral studio treatment. */
.studio-shell{--studio-bg:#130e0b;--studio-panel:#201813;--studio-panel-soft:#19120e;--studio-line:#3d2e24;--studio-text:#f5f5f7;--studio-muted:#999ca8;--studio-purple:#f8af7f;--studio-green:#23c79a;background:radial-gradient(80rem 34rem at 48% -24rem,#3c2d23 0,transparent 62%),var(--studio-bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:-.012em}
.studio-sidebar{background:#16110df2;border-color:var(--studio-line);backdrop-filter:blur(14px)}
.studio-logo{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:18px;font-weight:800;letter-spacing:-.045em}.studio-mark{width:25px;height:25px;border-radius:7px;background:#f05e3d;display:grid;grid-template-columns:repeat(2,1fr);gap:3px;padding:5px;box-shadow:0 0 0 1px #ffb298 inset}.studio-mark b{border-radius:1px;background:#161217}.studio-mark b:nth-child(2){background:#ffd26a}.studio-mark b:nth-child(3){background:#ffe7ba}.studio-mark b:nth-child(4){background:#422f22}
.studio-primary button,.studio-sidebar-bottom>a{font-family:inherit;font-size:13px}.studio-primary button:hover,.studio-primary button.is-active{background:#2f241c}.studio-primary button.is-active .studio-icon{color:#fac6a4}.studio-sidebar-rule{background:var(--studio-line)}.studio-user{background:#261c16;border-color:#463529}
.studio-view{max-width:1380px}.studio-topbar h1,.studio-composer h2,.studio-section h2,.studio-theme-banner h2,.studio-theme-detail h2,.studio-dialog h2,.studio-asset-detail h2{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:750;letter-spacing:-.045em}.studio-topbar h1{font-size:33px}.studio-kicker{color:#fac4a0;font-size:9px;letter-spacing:.14em}.studio-credit{background:#231b15;border-color:#513d2f}.studio-credit span,.studio-credit small{color:#d3a8b9}.studio-credit b{color:#f0becd}
.studio-composer{border-color:#473529;background:linear-gradient(160deg,#251b15,#1e1611);box-shadow:0 18px 50px #0004}.studio-composer h2{font-size:23px}.studio-reference-open{background:#2c211a;border-color:#414652;color:#f6f2ef}.studio-composer textarea{background:#15100c;border-color:#30343d}.studio-composer textarea:focus{border-color:#ebab81;box-shadow:0 0 0 3px #ebac821d}.studio-type-select{color:#a8abb5}.studio-theme-pill{color:#78dbc0}.studio-create{background:#e5a276}.studio-create:disabled{background:#30333b;color:#858995}
.studio-tool-launcher button,.studio-asset-card,.studio-project-card,.studio-preset-card{background:#201813;border-color:#2d303a}.studio-tool-launcher button:hover,.studio-asset-card:hover,.studio-project-card:hover,.studio-preset-card:hover{background:#281e17;border-color:#b48668}.studio-tool-launcher small,.studio-asset-copy small,.studio-project-card small,.studio-preset-card>small{color:#9397a3}.studio-tool-launcher button>span,.studio-section-title>button{color:#fac4a0}.studio-thumb{background:#15100c}.checker{background-color:#1e1611;background-image:linear-gradient(45deg,#2d221a 25%,transparent 25%),linear-gradient(-45deg,#2d221a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#2d221a 75%),linear-gradient(-45deg,transparent 75%,#2d221a 75%)}
.studio-theme-banner{background:linear-gradient(100deg,#123333,#322217 52%,#2c211a);border-color:#2e6660}.studio-theme-banner p{color:#b4cec9}.studio-theme-banner button{color:#7ae1c4}.studio-library-layout,.studio-theme-workbench{background:#1d1611;border-color:#2d303a}.studio-library-nav,.studio-theme-list{border-color:#2d303a}.studio-library-nav button:hover,.studio-library-nav button.active,.studio-theme-list button.active{background:#32261e}.studio-library-toolbar label,.studio-preset-controls label{background:#18120e;border-color:#30333d}.studio-library-toolbar>button{background:#281e17;border-color:#4c392c}.studio-filter-row button.active,.studio-preset-controls>div button.active,.studio-preset-filters button.active{background:#47362a}
.studio-dialog{background:#201813;border-color:#3a3e4a}.studio-dialog>header,.studio-reference-dialog footer{border-color:#30333d}.studio-dialog [data-modal-close]{background:#392b21}.studio-reference-upload{background:#261d17;border-color:#5d6270}.studio-reference-grid button{background:#19120e;border-color:#30343e}.studio-reference-grid button.selected{background:#3c2e24;border-color:#e9a97f}.studio-asset-detail aside{border-color:#30333d}.studio-action-group{border-color:#30333d}.studio-action-group button{background:#2c211a;border-color:#4d3a2d}.studio-action-group button:hover{border-color:#e3a379}.studio-preset-detail>img{background:#16110d}.studio-preset-detail dl>div{border-color:#30333d}

/* Layered gradients give the workspace depth without competing with the pixel artwork. */
.studio-main{background:radial-gradient(62rem 38rem at 58% -20%,#5d412e40 0,transparent 60%),radial-gradient(42rem 27rem at 105% 36%,#63371a22 0,transparent 70%)}
.studio-composer{background:linear-gradient(135deg,#31241c 0%,#261d17 48%,#1f1712 100%)}
.studio-composer textarea{background:linear-gradient(135deg,#1c1511,#140f0c 80%)}
.studio-reference-open{background:linear-gradient(135deg,#3c2d23,#291f18)}
.studio-tool-launcher button,.studio-asset-card,.studio-project-card,.studio-preset-card{background:linear-gradient(145deg,#2b2019,#1e1611 70%)}
.studio-tool-launcher button:hover,.studio-asset-card:hover,.studio-project-card:hover,.studio-preset-card:hover{background:linear-gradient(145deg,#3b2c22,#241b15 75%)}
.studio-library-layout,.studio-theme-workbench{background:linear-gradient(145deg,#251b15,#19120e 72%)}
.studio-library-toolbar label,.studio-preset-controls label{background:linear-gradient(135deg,#261d17,#17110d)}
.studio-library-toolbar>button{background:linear-gradient(135deg,#392b22,#231a14)}
.studio-dialog{background:linear-gradient(145deg,#2b2019,#1c1510 72%)}
.studio-dialog>header{background:linear-gradient(90deg,#32261ea8,#201813b5)}
.studio-reference-upload{background:linear-gradient(135deg,#3b2c22,#221a14)}
.studio-reference-grid button{background:linear-gradient(145deg,#261c16,#19120e)}
.studio-reference-grid button.selected{background:linear-gradient(145deg,#543e2f,#32261e)}
.studio-action-group button{background:linear-gradient(135deg,#403026,#281e18)}
.studio-asset-preview{background-color:#1c1511;background-image:radial-gradient(circle at 50% 43%,#593f2d45,transparent 48%),linear-gradient(45deg,#2d221a 25%,transparent 25%),linear-gradient(-45deg,#2d221a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#2d221a 75%),linear-gradient(-45deg,transparent 75%,#2d221a 75%)}
.studio-preset-detail>img{background:radial-gradient(circle at 50% 35%,#5a433345,transparent 62%),#16110d}

/* Compact studio layout inspired by the interaction density of the audited reference app. */
@media(min-width:661px){
  .studio-shell{grid-template-columns:72px minmax(0,1fr)}
  .studio-sidebar{align-items:center;padding:16px 8px 12px}
  .studio-logo{padding:0;justify-content:center;width:42px}.studio-logo>span,.studio-primary button>span:not(.studio-icon),.studio-sidebar-label,.studio-sidebar-bottom>a>span:not(.studio-icon),.studio-user b,.studio-user .studio-icon{display:none}
  .studio-mark{width:22px;height:22px;padding:4px;border-radius:6px}
  .studio-primary{width:100%;margin-top:25px;gap:7px}.studio-primary button{justify-content:center;padding:10px;border-radius:8px}.studio-primary button>.studio-icon{display:inline-block}.studio-primary .studio-icon{width:auto;font-size:18px}
  .studio-sidebar-rule{width:38px;margin:19px 0 13px}.studio-tools{margin-top:5px}.studio-sidebar-bottom{width:100%;justify-items:center}.studio-sidebar-bottom>a{padding:9px;justify-content:center}.studio-user{width:38px;height:38px;justify-content:center;padding:4px}.studio-user>span{width:26px;height:26px}
  .studio-home-view{max-width:900px;margin-left:clamp(70px,11vw,150px);margin-right:auto;padding-top:64px}
}

/* Creator workspace: a single continuous studio surface, not a page inside a card. */
@media (min-width: 1051px) {
  .studio-view:has(.creator-shell),
  .studio-view:has(.asset-shell),
  .studio-view:has(.pack-builder),
  .studio-view:has(.tileset-builder),
  .studio-view:has(.animation-builder),
  .studio-view:has(.animation2-shell),
  .studio-view:has(.animation3-shell),
  .studio-view:has(.a4-shell) {
    max-width: 1680px;
    padding: 36px 42px 64px;
  }
  .studio-view:has(.creator-shell) .studio-topbar,
  .studio-view:has(.asset-shell) .studio-topbar,
  .studio-view:has(.pack-builder) .studio-topbar,
  .studio-view:has(.tileset-builder) .studio-topbar,
  .studio-view:has(.animation-builder) .studio-topbar,
  .studio-view:has(.animation3-shell) .studio-topbar,
  .studio-view:has(.a4-shell) .a4-head {
    margin: 0 0 24px;
  }
  .studio-character-view .creator-shell { grid-template-columns: 440px minmax(0, 1fr); }
  .studio-asset-generator-view .asset-shell { grid-template-columns: 470px minmax(0, 1fr); }
  .studio-asset-pack-view .pack-builder { grid-template-columns: 455px minmax(0, 1fr); }
  .studio-tileset-view .tileset-builder { grid-template-columns: 455px minmax(0, 1fr); }
  .studio-animation-view .animation-builder { grid-template-columns: 485px minmax(0, 1fr); }
  .studio-animation2-view .animation2-shell { grid-template-columns: 450px minmax(0, 1fr); }
  .studio-animation3-view .animation3-shell { grid-template-columns: 500px minmax(0, 1fr); }
}

.studio-view:has(.creator-shell),
.studio-view:has(.asset-shell),
.studio-view:has(.pack-builder),
.studio-view:has(.tileset-builder),
.studio-view:has(.animation-builder),
.studio-view:has(.animation2-shell),
.studio-view:has(.animation3-shell),
.studio-view:has(.a4-shell) {
  position: relative;
}
.studio-view:has(.creator-shell)::before,
.studio-view:has(.asset-shell)::before,
.studio-view:has(.pack-builder)::before,
.studio-view:has(.tileset-builder)::before,
.studio-view:has(.animation-builder)::before,
.studio-view:has(.animation2-shell)::before,
.studio-view:has(.animation3-shell)::before,
.studio-view:has(.a4-shell)::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: radial-gradient(70% 55% at 70% 8%, #6b4b3624, transparent 72%);
}

.studio-auth-dialog{width:min(440px,100%)}.studio-auth-dialog header{padding:23px 24px}.studio-auth-dialog h2{font-size:25px}.studio-auth-form{padding:22px 24px 25px;display:grid;gap:14px}.studio-auth-form label{display:grid;gap:7px;color:#dccbc1;font-size:11px;font-weight:750}.studio-auth-form input{height:43px;border-radius:8px;border:1px solid #503c2f;background:#15100c;color:#fef9f5;padding:0 11px;font:14px Inter,ui-sans-serif,system-ui,sans-serif;outline:0}.studio-auth-form input:focus{border-color:#f9b385;box-shadow:0 0 0 3px #eba7791f}.studio-auth-form button[type=submit]{border:0;border-radius:8px;background:linear-gradient(135deg,#e59c6b,#efaf85);padding:12px;color:#fff;font-weight:800;margin-top:4px}.studio-auth-form button[type=submit]:disabled{opacity:.65}.studio-auth-switch{border:0;background:transparent;color:#fac9a9;font-size:12px;padding:4px}.studio-auth-note{margin:0;color:#b69782;font-size:11px;line-height:1.45}.studio-auth-error{margin:0;padding:9px 10px;border-radius:7px;background:#41212b;color:#ffbdc9;font-size:11px}.studio-auth-https{padding:23px 24px 28px;color:#dfd1c8}.studio-auth-https b{color:#ffe1a3;font-size:13px}.studio-auth-https p{font-size:12px;line-height:1.55;color:#c3aa9a;margin:10px 0 0}
.studio-theme-empty{min-height:380px;border:1px solid #47362a;border-radius:16px;background:radial-gradient(circle at 50% 10%,#7356432e,transparent 42%),linear-gradient(145deg,#281e17,#1a1410);display:grid;place-items:center;text-align:center;padding:46px 26px}.studio-theme-empty>*{max-width:570px}.studio-theme-empty-orb{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#d18b5c2c;border:1px solid #e8a77b72;color:#fcd7bf;font-size:26px}.studio-theme-empty h2{margin:10px 0 0;font-size:28px;letter-spacing:-.04em}.studio-theme-empty p{margin:4px 0 16px;color:#a3a8b7;line-height:1.55}.studio-theme-empty button{border:0;border-radius:9px;background:linear-gradient(135deg,#e59c6b,#efaf85);color:#fff;padding:12px 17px;font-weight:800;cursor:pointer}.studio-theme-empty small{color:#838897;margin-top:5px}.studio-theme-dialog{width:min(780px,100%);max-height:calc(100vh - 32px)}.studio-dialog{scrollbar-width:thin;scrollbar-color:#dd9c71 #1a1410}.studio-dialog::-webkit-scrollbar{width:10px}.studio-dialog::-webkit-scrollbar-track{background:#1a1410;border-left:1px solid #30333d}.studio-dialog::-webkit-scrollbar-thumb{background:linear-gradient(#ebaa7e,#b57e59);border:3px solid #1a1410;border-radius:999px}.studio-dialog::-webkit-scrollbar-thumb:hover{background:#f9be96}.studio-theme-form textarea,.studio-theme-form select{width:100%;box-sizing:border-box;border:1px solid #503c2f;border-radius:8px;background:#15100c;color:#fef9f5;padding:11px;font:13px Inter,ui-sans-serif,system-ui,sans-serif;outline:0}.studio-theme-form textarea{min-height:95px;resize:vertical}.studio-theme-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.studio-theme-form-row label{display:grid;gap:7px;color:#dccbc1;font-size:11px;font-weight:750}
.studio-theme-tag-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:-5px}.studio-theme-tag-list button{border:1px solid #5b4536;border-radius:999px;background:#211914;color:#e7d7cc;font:700 11px Inter,ui-sans-serif,system-ui,sans-serif;padding:6px 9px;cursor:pointer;transition:.15s}.studio-theme-tag-list button:hover{border-color:#dc9f77;color:#fff}.studio-theme-tag-list button.active{border-color:#ebac82;background:#b8805a4d;color:#fef0e6;box-shadow:inset 0 0 0 1px #edb28a2e}.studio-theme-help{display:block;margin-top:-9px;color:#b69782;font-size:10px;line-height:1.4}.studio-theme-view-field{display:grid;gap:8px;color:#dccbc1;font-size:11px;font-weight:750}.theme-view-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.theme-view-card{min-height:112px;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:2px;padding:10px;border:1px solid #533e30;border-radius:9px;background:#15100c;color:#fef1e8;text-align:left;cursor:pointer}.theme-view-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.37;image-rendering:pixelated;filter:saturate(.75)}.theme-view-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#100b08 0%,#100b0866 58%,transparent)}.theme-view-card b,.theme-view-card small{position:relative;z-index:1}.theme-view-card b{font-size:11px}.theme-view-card small{font-size:9px;color:#c9b3a4;line-height:1.2}.theme-view-card:hover,.theme-view-card.active{border-color:#42d3a4aa;background:#0c2822;box-shadow:inset 0 0 0 1px #42d3a433}.theme-view-card.active:before{content:"Selected";position:absolute;z-index:2;top:7px;right:7px;padding:3px 5px;border-radius:999px;background:#35cfa1;color:#06231c;font-size:7px;font-weight:900;text-transform:uppercase}
.studio-theme-list mark,.studio-theme-picker-list mark{margin-left:7px;border-radius:999px;background:#335f52;color:#a4f0d6;padding:3px 5px;font:800 8px Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:.05em;text-transform:uppercase}.studio-theme-rules article .studio-default-theme{display:block;margin-top:8px;border:1px solid #6e5240;border-radius:7px;background:#281e17;color:#eee7e2;padding:8px 10px;font:750 11px Inter,ui-sans-serif,system-ui,sans-serif;cursor:pointer}.studio-theme-rules article .studio-default-theme:hover{border-color:#e9ae86}.studio-theme-rules article .studio-default-theme.active{border-color:#4acda5;background:#173c34;color:#bcf6e3}.studio-theme-rules article small{display:block;margin-top:7px;color:#9aa1b1;font-size:10px;line-height:1.35}.studio-theme-picker-dialog{width:min(680px,100%)}.studio-theme-picker-list{padding:14px;display:grid;gap:8px}.studio-theme-picker-list>button{display:flex;align-items:center;gap:15px;width:100%;border:1px solid #4e3b2e;border-radius:10px;background:linear-gradient(135deg,#2c211a,#1d1611);color:#f7f2ee;padding:14px;text-align:left;cursor:pointer}.studio-theme-picker-list>button:hover,.studio-theme-picker-list>button.active{border-color:#e3a67d;background:linear-gradient(135deg,#423126,#261c16)}.studio-theme-picker-list>button span{display:grid;gap:4px;flex:1;min-width:0}.studio-theme-picker-list b{font-size:13px}.studio-theme-picker-list small{color:#c6ae9e;font-size:11px;line-height:1.35}.studio-theme-picker-list em{font-style:normal;color:#e9c1a7;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.studio-theme-picker-list i{font-style:normal;color:#fbd2b6;font-size:19px}.studio-theme-picker-list mark{margin:0}
.studio-theme-picker-actions{display:flex;align-items:center;gap:8px}.studio-theme-picker-clear{border:1px solid #6c4b59!important;background:#2d221b!important;color:#ffc5d0!important;border-radius:7px;padding:8px 10px;font-size:10px;font-weight:800;cursor:pointer}.studio-theme-picker-clear:hover{border-color:#e87993!important;background:#3b202b!important}

/* The existing creator lives inside the authenticated workspace without
   bringing its public-page spacing or background along with it. */
.studio-character-view{max-width:1240px;padding-top:42px}.studio-character-view>.creator-page{min-height:0;padding:0;background:none}.studio-character-view .creator-intro{display:none}.studio-character-view .creator-shell{width:100%;grid-template-columns:385px minmax(0,1fr);border-color:#463529;border-radius:14px;background:#1d1611}.studio-character-view .creator-controls{background:linear-gradient(160deg,#2a2019,#1b1410);border-color:#463529}.studio-character-view .creator-stage{min-height:650px;background:radial-gradient(circle at 50% 40%,#463326,#1c1510 67%)}.studio-character-view .creator-field>span{color:#d3c1b5}.studio-character-view .creator-field small,.studio-character-view .creator-local-note{color:#8e94a3}.studio-character-view .creator-field textarea,.studio-character-view .creator-field input,.studio-character-view .creator-field select{background:#15100d;border-color:#4d3a2d}.studio-character-view .creator-result-head button{background:#32261e;border-color:#533f31}.studio-character-view .creator-compare canvas{border-color:#4e3b2e;background:#15100d}.studio-character-view .creator-generate{border:0;color:#fff}.studio-character-view .perspective-card{background:#1b1410;border-color:#503c2f}.studio-character-view .style-tag{background:#1c1511;border-color:#644b3b}.studio-character-view .style-tag.active{background:#7b5c48;border-color:#f9b78b}
.studio-asset-generator-view{max-width:1360px;padding-top:42px}.studio-asset-generator-view>.asset-page{min-height:0;padding:0;background:none}.studio-asset-generator-view .asset-shell{width:100%;grid-template-columns:435px minmax(0,1fr);border-color:#463529;border-radius:14px;background:#1d1611}.studio-asset-generator-view .asset-controls{background:linear-gradient(160deg,#2a2019,#1b1410);border-color:#463529}.studio-asset-generator-view .asset-stage{min-height:700px;background:radial-gradient(circle at 50% 40%,#463326,#1c1510 67%)}.studio-asset-generator-view .asset-field>span{color:#d3c1b5}.studio-asset-generator-view .asset-field small,.studio-asset-generator-view .asset-local-note{color:#8e94a3}.studio-asset-generator-view .asset-field textarea,.studio-asset-generator-view .asset-field input,.studio-asset-generator-view .asset-field select{background:#15100d;border-color:#4d3a2d}.studio-asset-generator-view .asset-result-head button{background:#32261e;border-color:#533f31}.studio-asset-generator-view .asset-compare canvas{border-color:#4e3b2e;background:#15100d}.studio-asset-generator-view .asset-generate{border:0;color:#fff}.studio-asset-generator-view .asset-mode{background:#1b1410;border-color:#503c2f}.studio-asset-generator-view .asset-tag{background:#1c1511;border-color:#644b3b}.studio-asset-generator-view .asset-tag.active{background:#7b5c48;border-color:#f9b78b}
@media(max-width:820px){.studio-character-view .creator-shell{grid-template-columns:1fr}.studio-character-view .creator-stage{min-height:570px}}
.studio-home-view .studio-topbar{align-items:center;margin-bottom:52px}.studio-home-view .studio-topbar h1{font-size:31px;font-weight:760}.studio-home-view .studio-topbar p{display:flex;gap:8px;align-items:center;font-size:11px;margin-top:6px;color:#777d8e}.studio-home-view .studio-topbar p b{font-weight:650}.studio-updates{border:1px solid #5d4434;border-radius:999px;background:linear-gradient(135deg,#35271e,#241b15);padding:10px 15px;color:#f8e5d9;font-weight:750;font-size:12px;box-shadow:0 8px 20px #0003}.studio-updates i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#f9b284;margin-left:4px;vertical-align:top}
.studio-home-view .studio-composer{display:flex;align-items:center;min-height:63px;padding:0 14px;border-radius:999px;background:linear-gradient(135deg,#251b15,#1a1410);box-shadow:none}.studio-home-view .studio-reference-open{height:36px;width:36px;padding:0;display:grid;place-items:center;border:0;background:transparent;color:#c0a593}.studio-home-view .studio-reference-open .studio-icon{font-size:18px}.studio-home-view #studio-prompt{min-height:0;height:42px;margin:0;padding:0 8px;border:0;background:transparent;box-shadow:none;font-size:14px;flex:1}.studio-home-view #studio-prompt:focus{box-shadow:none}.studio-home-view .studio-composer-footer{gap:6px;flex:none}.studio-home-view .studio-type-select{padding:8px 7px;font-size:12px}.studio-home-view .studio-history{border:0;background:transparent;color:#b3937d;font-size:20px;padding:4px 8px}.studio-home-view .studio-create{display:none}
.studio-home-view .studio-tool-launcher{margin:26px -64px 48px}.studio-home-view .studio-tool-launcher>.studio-kicker{text-align:center;color:#7e8392;margin-bottom:12px}.studio-home-view .studio-tool-launcher>div{display:flex;justify-content:center;gap:8px}.studio-home-view .studio-tool-launcher button{height:39px;padding:0 12px;display:flex;align-items:center;gap:8px;border-radius:8px;background:linear-gradient(145deg,#251b15,#1c1510);white-space:nowrap}.studio-home-view .studio-tool-launcher button>span{display:grid;place-items:center;width:21px;height:21px;margin:0;border-radius:5px;background:#2e625d;color:#64e0c1;font-size:12px}.studio-home-view .studio-tool-launcher button:nth-child(2)>span{background:#694c39;color:#fbcaaa}.studio-home-view .studio-tool-launcher button:nth-child(3)>span{background:#5c412f;color:#fbcbab}.studio-home-view .studio-tool-launcher b{font-size:12px}.studio-home-view .studio-tool-launcher small{display:none}
.studio-home-view .studio-section{margin-top:0}.studio-home-view .studio-section-title h2{font-family:inherit;font-size:15px;letter-spacing:-.02em}.studio-home-view .studio-section-title .studio-kicker{display:none}.studio-home-view .studio-section-title>button{font-size:11px;color:#b2927d}.studio-home-view .studio-recent-grid{grid-template-columns:repeat(3,1fr);gap:11px;margin-top:12px}.studio-home-view .studio-recent-grid .studio-asset-card{height:232px;border-radius:10px;background:#19120e}.studio-home-view .studio-recent-grid .studio-asset-card:nth-child(4){display:none}.studio-home-view .studio-recent-grid .studio-thumb{height:100%;background:radial-gradient(circle at 50% 36%,#382a21,transparent 61%),#15100c}.studio-home-view .studio-recent-grid .studio-thumb img{padding:16px 10px 47px;object-fit:contain}.studio-home-view .studio-recent-grid .studio-asset-copy{position:absolute;z-index:1;bottom:0;left:0;right:0;padding:25px 10px 10px;background:linear-gradient(transparent,#0f0b08 48%);gap:2px}.studio-home-view .studio-recent-grid .studio-asset-copy b{font-size:11px}.studio-home-view .studio-recent-grid .studio-asset-copy small{font-size:10px}.studio-home-view .studio-recent-grid .studio-asset-copy small:nth-of-type(1){position:absolute;top:-185px;left:9px;border-radius:4px;background:#372920;color:#eee7e2;padding:3px 5px;font-size:8px;font-weight:800}.studio-home-view .studio-card-more{display:none}.studio-home-view .studio-theme-banner{margin-top:37px;opacity:.95}
.studio-asset-dialog{width:100vw;max-width:100vw;height:100vh;max-height:100vh;border:0;border-radius:0;background:#17110d}.studio-overlay:has(.studio-asset-dialog){padding:0;background:#17110d;backdrop-filter:none}.studio-asset-dialog>header{height:60px;padding:0 22px;border-color:#292c35;background:#1c1510}.studio-asset-dialog>header>button{background:transparent;padding:8px 0}.studio-asset-detail{height:calc(100vh - 60px);min-height:0;grid-template-columns:minmax(0,1fr) 355px}.studio-asset-preview{padding:25px;background-color:#15100d}.studio-asset-preview>img{max-width:75%;max-height:79vh}.studio-asset-detail aside{padding:23px 16px;background:#201813}.studio-asset-detail h2{font-family:inherit;font-size:15px;letter-spacing:-.025em}.studio-detail-meta{display:flex;gap:5px;flex-wrap:wrap;margin:12px 0 16px}.studio-action-group{padding:15px 0;gap:0}.studio-action-group>span{margin-bottom:12px;font-size:10px;letter-spacing:.02em;text-transform:none;color:#9599a7}.studio-action-group button{border:0;background:transparent;border-radius:0;padding:9px 2px;display:grid;gap:2px;font-size:14px;box-shadow:none}.studio-action-group button:hover{background:transparent;color:#fabf98}.studio-action-group small{font-size:11px;margin:0;color:#858a99}.studio-action-group:first-of-type button:first-of-type{border-radius:8px;background:linear-gradient(135deg,#efa06b,#eba87b);padding:13px;text-align:center;display:block;color:white;margin-bottom:10px}.studio-action-group:first-of-type button:first-of-type small{display:none}

/* Expanded navigation is intentionally used here: labels remain visible and the content centres in the available workspace. */
@media(min-width:661px){
  .studio-shell{grid-template-columns:236px minmax(0,1fr)}
  .studio-sidebar{align-items:stretch;padding:20px 13px 14px}
  .studio-logo{width:auto;padding:0 11px;justify-content:flex-start}.studio-logo>span{display:inline}
  .studio-primary{width:auto;margin-top:28px;gap:3px}.studio-primary button{justify-content:flex-start;padding:10px 11px}.studio-primary button>span:not(.studio-icon){display:inline}.studio-primary .studio-icon{width:17px;font-size:17px}
  .studio-sidebar-rule{width:auto;margin:20px 8px 15px}.studio-sidebar-label{display:block;margin:0 11px}.studio-tools{margin-top:8px}
  .studio-sidebar-bottom{width:auto;justify-items:stretch}.studio-sidebar-bottom>a{justify-content:flex-start;padding:9px 11px}.studio-sidebar-bottom>a>span:not(.studio-icon){display:inline}.studio-user{width:auto;height:auto;justify-content:flex-start;padding:9px}.studio-user b{display:block}.studio-user .studio-icon{display:block}
  .studio-home-view{max-width:900px;margin-left:auto;margin-right:auto;padding-top:64px}
}

/* Animation 4 is a first-class workspace, with the same broad canvas as the other creators. */
.a4-view{box-sizing:border-box;width:100%;max-width:none;min-height:100vh;padding:42px 44px 38px;display:flex;flex-direction:column}.a4-head{padding:0 2px;margin-bottom:32px}.a4-head h1{margin-top:9px}.a4-head p{margin-top:10px;max-width:760px;line-height:1.55}.a4-head>button{box-shadow:0 10px 24px #ba73434d}.a4-shell{flex:1;min-height:0;border-color:#513d2f;border-radius:12px;background:linear-gradient(112deg,#281e17 0%,#211913 43%,#332318 100%);box-shadow:0 24px 56px #00000038}.a4-panel{padding:26px;background:linear-gradient(160deg,#2b211a 0%,#1e1712 78%);border-color:#513d2f}.a4-stage{padding:28px;background:radial-gradient(90% 72% at 75% 0,#624634 0%,#291f18 46%,#1e1611 100%)}.a4-stage-head{padding-bottom:13px;border-bottom:1px solid #513d30}.a4-empty{height:100%;min-height:440px;border-color:#6c5240;background:linear-gradient(135deg,#291e1699,#1c151177)}.a4-results{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.a4-results article{min-height:88px;align-content:center}.a4-cost{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;align-items:baseline;margin:0;padding:11px 12px;border:1px solid #6f5341;border-radius:9px;background:linear-gradient(120deg,#3f2f25,#271d17)}.a4-cost span{font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#e9c1a6}.a4-cost b{font-size:12px;color:#fef0e7}.a4-cost small{grid-column:1/-1;color:#bda18e;font-size:10px;line-height:1.35}.a4-submit{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;box-shadow:0 12px 26px #c97a465c}.a4-submit b{margin:0;font-size:17px}.a4-submit:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
@media(min-width:1500px){.a4-shell{grid-template-columns:minmax(445px,500px) minmax(0,1fr)}.a4-sources{max-height:188px}.a4-empty{min-height:510px}}
@media(max-width:820px){.a4-view{min-height:0;padding:28px 24px 38px}.a4-shell{min-height:0;flex:none}.a4-stage{min-height:560px}}
@media(max-width:600px){.a4-view{padding:22px 16px 28px}.a4-head{margin-bottom:22px}}

/* Full-height creation workspaces for the image and map tools. */
@media(min-width:821px){
  .studio-character-view,.studio-asset-generator-view,.studio-tileset-view{box-sizing:border-box;min-height:100vh;max-width:none;padding:42px 44px 38px;display:flex;flex-direction:column}
  .studio-character-view .studio-topbar,.studio-asset-generator-view .studio-topbar,.studio-tileset-view .studio-topbar{margin-bottom:32px;padding:0 2px}
  .studio-character-view .studio-topbar p,.studio-asset-generator-view .studio-topbar p,.studio-tileset-view .studio-topbar p{margin-top:10px;max-width:760px;line-height:1.55}
  .studio-character-view>.creator-page,.studio-asset-generator-view>.asset-page{width:100%;flex:1;display:flex;min-height:0}
  .studio-character-view .creator-shell,.studio-asset-generator-view .asset-shell,.studio-tileset-view .tileset-builder{flex:1;min-height:0}
  .studio-character-view .creator-stage,.studio-asset-generator-view .asset-stage,.studio-tileset-view .tileset-library{min-height:0}
  .studio-character-view .creator-stage,.studio-asset-generator-view .asset-stage{padding:30px}
}
@media(max-width:1050px){.studio-character-view,.studio-asset-generator-view,.studio-tileset-view{padding-top:28px}.studio-character-view .studio-topbar,.studio-asset-generator-view .studio-topbar,.studio-tileset-view .studio-topbar{margin-bottom:24px}}

/* The routed tool view sits inside #studio-content; force it to consume the
   workspace rather than inherit the centred, marketing-sized .studio-view. */
@media(min-width:821px){
  #studio-content>.studio-character-view,#studio-content>.studio-asset-generator-view,#studio-content>.studio-tileset-view{
    width:100%!important;max-width:none!important;margin:0!important;padding:42px 44px 38px!important;box-sizing:border-box;min-height:100vh
  }
}

/* Character is a routed workspace: its configuration panel scrolls internally,
   while the app shell itself remains exactly one viewport high. */
@media(min-width:821px){
  .studio-shell:has(#studio-content>.studio-character-view),.studio-shell:has(#studio-content>.studio-character-view) .studio-main{height:100vh;overflow:hidden}
  #studio-content:has(>.studio-character-view){height:100%}
  #studio-content>.studio-character-view{height:100%;min-height:0!important;padding:0!important}
  .studio-character-view>.studio-topbar{display:none}
  .studio-character-view>.creator-page{height:100%;min-height:0}
  .studio-character-view .creator-shell{height:100%;min-height:0;border:0;border-radius:0;box-shadow:none}
  .studio-character-view .creator-controls{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:28px 26px 36px;scrollbar-width:thin;scrollbar-color:#dd9c71 #1a1410}
  .studio-character-view .creator-controls::before{content:"Character creator";display:block;margin:0 0 8px;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:30px;font-weight:750;letter-spacing:-.045em;line-height:1.05}
  .studio-character-view .creator-controls::-webkit-scrollbar{width:10px}
  .studio-character-view .creator-controls::-webkit-scrollbar-track{background:#1a1410;border-left:1px solid #30333d}
  .studio-character-view .creator-controls::-webkit-scrollbar-thumb{background:linear-gradient(#ebaa7e,#b57e59);border:3px solid #1a1410;border-radius:999px}
  .studio-character-view .creator-controls::-webkit-scrollbar-thumb:hover{background:#f9be96}
  .studio-character-view .creator-stage{min-height:0;height:auto;padding:30px}
}

/* Keep the character action available while the configuration remains easy to browse. */
@media(min-width:821px){
  .studio-character-view .creator-controls{min-height:0;overflow:hidden;padding:0;display:grid;grid-template-rows:minmax(0,1fr) auto;align-content:stretch;gap:0}
  .studio-character-view .creator-controls::before{content:none}
  .studio-character-view .creator-form-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:28px 26px 20px;display:grid;align-content:start;gap:14px;scrollbar-width:thin;scrollbar-color:#dd9c71 #1a1410}
  .studio-character-view .creator-form-scroll::before{content:"Character creator";display:block;margin:0 0 8px;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:30px;font-weight:750;letter-spacing:-.045em;line-height:1.05}
  .studio-character-view .creator-form-scroll::-webkit-scrollbar{width:10px}
  .studio-character-view .creator-form-scroll::-webkit-scrollbar-track{background:#1a1410;border-left:1px solid #30333d}
  .studio-character-view .creator-form-scroll::-webkit-scrollbar-thumb{background:linear-gradient(#ebaa7e,#b57e59);border:3px solid #1a1410;border-radius:999px}
  .studio-character-view .creator-form-scroll::-webkit-scrollbar-thumb:hover{background:#f9be96}
  .studio-character-view .creator-fixed-actions{position:relative;z-index:2;display:grid;gap:10px;padding:14px 26px 19px;border-top:1px solid #463529;background:linear-gradient(180deg,#251b15ee,#1b1410ff);box-shadow:0 -14px 28px #130e0ba8}
  .studio-character-view .creator-fixed-actions .creator-generate,.studio-character-view .creator-fixed-actions .creator-local-note{margin:0}
}

/* All generation builders share the same app-native workspace pattern. */
@media(min-width:821px){
  .studio-shell:has(#studio-content>.studio-asset-generator-view),.studio-shell:has(#studio-content>.studio-asset-pack-view),.studio-shell:has(#studio-content>.studio-tileset-view),.studio-shell:has(#studio-content>.studio-asset-generator-view) .studio-main,.studio-shell:has(#studio-content>.studio-asset-pack-view) .studio-main,.studio-shell:has(#studio-content>.studio-tileset-view) .studio-main{height:100vh;overflow:hidden}
  #studio-content:has(>.studio-asset-generator-view),#studio-content:has(>.studio-asset-pack-view),#studio-content:has(>.studio-tileset-view){height:100%}
  #studio-content>.studio-asset-generator-view,#studio-content>.studio-asset-pack-view,#studio-content>.studio-tileset-view{height:100%;min-height:0!important;padding:0!important}
  .studio-asset-generator-view>.studio-topbar,.studio-asset-pack-view>.studio-topbar,.studio-tileset-view>.studio-topbar{display:none}
  .studio-asset-generator-view>.asset-page,.studio-asset-pack-view>.pack-builder,.studio-tileset-view>.tileset-builder{height:100%;min-height:0}
  .studio-asset-generator-view .asset-shell,.studio-asset-pack-view .pack-builder,.studio-tileset-view .tileset-builder{height:100%;min-height:0;border:0;border-radius:0;box-shadow:none}
  .studio-asset-generator-view .asset-controls,.studio-asset-pack-view .pack-form,.studio-tileset-view .tileset-form{min-height:0;overflow:hidden;padding:0;display:grid;grid-template-rows:minmax(0,1fr) auto;align-content:stretch;gap:0;background:linear-gradient(160deg,#2a2019,#1b1410)}
  .studio-asset-generator-view .asset-form-scroll,.studio-asset-pack-view .pack-form-scroll,.studio-tileset-view .tileset-form-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:28px 26px 20px;display:grid;align-content:start;gap:14px;scrollbar-width:thin;scrollbar-color:#dd9c71 #1a1410}
  .studio-asset-generator-view .asset-form-scroll::before,.studio-asset-pack-view .pack-form-scroll::before,.studio-tileset-view .tileset-form-scroll::before{display:block;margin:0 0 8px;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:30px;font-weight:750;letter-spacing:-.045em;line-height:1.05}
  .studio-asset-generator-view .asset-form-scroll::before{content:"Asset generator"}.studio-asset-pack-view .pack-form-scroll::before{content:"Asset pack builder"}.studio-tileset-view .tileset-form-scroll::before{content:"Tileset builder"}
  .studio-asset-generator-view .asset-form-scroll::-webkit-scrollbar,.studio-asset-pack-view .pack-form-scroll::-webkit-scrollbar,.studio-tileset-view .tileset-form-scroll::-webkit-scrollbar{width:10px}
  .studio-asset-generator-view .asset-form-scroll::-webkit-scrollbar-track,.studio-asset-pack-view .pack-form-scroll::-webkit-scrollbar-track,.studio-tileset-view .tileset-form-scroll::-webkit-scrollbar-track{background:#1a1410;border-left:1px solid #30333d}
  .studio-asset-generator-view .asset-form-scroll::-webkit-scrollbar-thumb,.studio-asset-pack-view .pack-form-scroll::-webkit-scrollbar-thumb,.studio-tileset-view .tileset-form-scroll::-webkit-scrollbar-thumb{background:linear-gradient(#ebaa7e,#b57e59);border:3px solid #1a1410;border-radius:999px}
  .studio-asset-generator-view .asset-fixed-actions,.studio-asset-pack-view .pack-fixed-actions,.studio-tileset-view .tileset-fixed-actions{position:relative;z-index:2;display:grid;gap:10px;padding:14px 26px 19px;border-top:1px solid #463529;background:linear-gradient(180deg,#251b15ee,#1b1410ff);box-shadow:0 -14px 28px #130e0ba8}
  .studio-asset-generator-view .asset-fixed-actions .asset-generate,.studio-asset-generator-view .asset-fixed-actions .asset-local-note,.studio-asset-pack-view .pack-fixed-actions .pack-create,.studio-asset-pack-view .pack-fixed-actions .pack-note,.studio-tileset-view .tileset-fixed-actions .tileset-create,.studio-tileset-view .tileset-fixed-actions .tileset-note{margin:0}
  .studio-asset-generator-view .asset-stage,.studio-asset-pack-view .pack-library,.studio-tileset-view .tileset-library{min-height:0;height:auto;padding:30px}
}

@media(min-width:821px){
  .studio-shell:has(#studio-content>.a4-view),.studio-shell:has(#studio-content>.a4-view) .studio-main{height:100vh;overflow:hidden}
  #studio-content:has(>.a4-view){height:100%}
  #studio-content>.a4-view{height:100%;min-height:0!important;padding:0!important}
  .a4-view>.a4-head{display:none}
  .a4-view>.a4-shell{height:100%;min-height:0;border:0;border-radius:0;box-shadow:none}
  .a4-view .a4-panel{min-height:0;overflow:hidden;padding:0;display:grid;grid-template-rows:minmax(0,1fr) auto;align-content:stretch;gap:0;border-right:1px solid #463529}
  .a4-view .a4-form-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:28px 26px 20px;display:grid;align-content:start;gap:14px;scrollbar-width:thin;scrollbar-color:#dd9c71 #1a1410}
  .a4-view .a4-form-scroll::before{content:"Animate a sprite";display:block;margin:0 0 8px;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:30px;font-weight:750;letter-spacing:-.045em;line-height:1.05}
  .a4-view .a4-form-scroll::-webkit-scrollbar{width:10px}.a4-view .a4-form-scroll::-webkit-scrollbar-track{background:#1a1410;border-left:1px solid #30333d}.a4-view .a4-form-scroll::-webkit-scrollbar-thumb{background:linear-gradient(#ebaa7e,#b57e59);border:3px solid #1a1410;border-radius:999px}
  .a4-view .a4-fixed-actions{position:relative;z-index:2;display:grid;gap:10px;padding:14px 26px 19px;border-top:1px solid #463529;background:linear-gradient(180deg,#251b15ee,#1b1410ff);box-shadow:0 -14px 28px #130e0ba8}
  .a4-view .a4-fixed-actions .a4-cost,.a4-view .a4-fixed-actions .a4-error,.a4-view .a4-fixed-actions .a4-submit{margin:0}
  .a4-view .a4-stage{min-height:0;height:auto;padding:30px}
}

/* Animation 4 prompt assistant modal. */
.a4-prompt-assist{margin-left:auto;display:inline-flex;align-items:center;gap:7px;border:1px solid #a67859;border-radius:8px;background:linear-gradient(135deg,#4b3526,#31251d);color:#fde6d7;padding:8px 10px;font:800 10px Inter,ui-sans-serif,system-ui,sans-serif;cursor:pointer;box-shadow:0 8px 18px #0003}.a4-prompt-assist b{font-size:14px;color:#fac4a0}.a4-prompt-assist:hover{border-color:#f9b88c;background:#624633}
.a4-assistant-modal{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:24px}.a4-assistant-modal[hidden]{display:none}.a4-assistant-backdrop{position:absolute;inset:0;background:#0b0705b8;backdrop-filter:blur(9px)}.a4-assistant-card{position:relative;z-index:1;width:min(620px,100%);max-height:min(760px,calc(100vh - 48px));overflow:auto;border:1px solid #81614c;border-radius:15px;background:linear-gradient(145deg,#392b21,#1d1611 72%);box-shadow:0 28px 90px #000a;color:#fef4ee;padding:0;scrollbar-width:thin;scrollbar-color:#dd9c71 #1a1410}.a4-assistant-card>header{display:flex;justify-content:space-between;gap:20px;padding:25px 26px 20px;border-bottom:1px solid #564133}.a4-assistant-card header span,.a4-assist-result>span{display:block;color:#fac8a6;font-size:10px;font-weight:900;letter-spacing:.12em}.a4-assistant-card h2{margin:8px 0 7px;font-size:25px;letter-spacing:-.04em}.a4-assistant-card header p{max-width:455px;margin:0;color:#c9b3a4;font-size:12px;line-height:1.55}.a4-assistant-card>header>button{width:32px;height:32px;border:0;border-radius:8px;background:#433227;color:#f5ede7;font-size:21px;cursor:pointer}.a4-assistant-card>label{display:grid;gap:7px;padding:17px 26px 0}.a4-assistant-card>label>span{color:#fcd6bd;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.a4-assistant-card textarea,.a4-assistant-card input{box-sizing:border-box;width:100%;border:1px solid #624939;border-radius:9px;background:#16110d;color:#fff9f6;padding:12px;font:13px Inter,ui-sans-serif,system-ui,sans-serif;outline:0}.a4-assistant-card textarea{min-height:105px;resize:vertical;line-height:1.5}.a4-assistant-card textarea:focus,.a4-assistant-card input:focus{border-color:#f9b98e;box-shadow:0 0 0 3px #e49e702b}.a4-assist-status{display:flex;justify-content:space-between;gap:12px;padding:13px 26px 0;color:#c2a897;font-size:10px}.a4-assist-status small{color:#73d7b8;font-weight:800}.a4-assist-error{margin:15px 26px 0;padding:10px;border:1px solid #8d435d;border-radius:8px;background:#431d2c;color:#ffd5df;font-size:12px}.a4-assist-result{display:grid;gap:9px;margin:17px 26px 0;padding:14px;border:1px solid #795b47;border-radius:10px;background:#2a1f17}.a4-assist-result p{margin:0;color:#fef1e8;font-size:12px;line-height:1.55;white-space:pre-wrap}.a4-assist-result small{color:#c8b1a1;font-size:11px}.a4-assistant-card>footer{display:flex;justify-content:flex-end;gap:9px;padding:22px 26px 26px}.a4-assist-generate,.a4-assist-use{border:0;border-radius:9px;padding:11px 15px;background:linear-gradient(135deg,#dd9362,#f0ae82);color:#fff;font-weight:850;cursor:pointer}.a4-assist-generate:disabled{opacity:.55;cursor:wait}.a4-assist-use{background:#213e3b;border:1px solid #4bc5a6;color:#d9fff3}
@media(max-width:600px){.a4-prompt-assist{padding:7px 8px;font-size:9px}.a4-assistant-modal{padding:12px}.a4-assistant-card>header,.a4-assistant-card>label,.a4-assist-status,.a4-assistant-card>footer{padding-left:18px;padding-right:18px}.a4-assist-error,.a4-assist-result{margin-left:18px;margin-right:18px}}
