#studio{box-sizing:border-box;width:min(1320px,96vw);max-width:96vw;height:min(880px,94dvh);max-height:94dvh;padding:0;border:1px solid #d0ac6a;border-radius:16px;background:#10292d;color:#f5e6c6;box-shadow:0 30px 100px #000b;overflow:hidden;font:15px/1.5 system-ui}#studio[open]{display:flex;flex-direction:column}#studio::backdrop{background:#001216c9;backdrop-filter:blur(5px)}#studio *{box-sizing:border-box}#studio header{position:static;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 22px;background:linear-gradient(130deg,#28464a,#102a30);border-bottom:1px solid #d1ae6244}#studio h2{font:700 27px Georgia;margin:0}#studio h3{font:700 21px Georgia;margin:8px 0}#studio small{color:#aec6c4}#studio button,#studio select,#studio input{font:inherit;color:inherit;background:#1d3a40;border:1px solid #849178;border-radius:7px;padding:9px 12px}#studio input[type=range]{padding:0;max-width:130px}#studio button{cursor:pointer}#studio button:hover:not(:disabled),#studio button[aria-pressed=true]{background:#456367;border-color:#f1ce80}#studio button:disabled{opacity:.45;cursor:not-allowed}#studio button:focus-visible,#studio input:focus-visible,#studio select:focus-visible{outline:3px solid #71d7e0;outline-offset:2px}#studio .st-primary{background:linear-gradient(#ebcc87,#bb9147);color:#1a292b;border-color:#efcf82;font-weight:750}#studio nav{display:flex;gap:7px;flex-wrap:wrap;padding:10px 20px;border-bottom:1px solid #a68c4a44}#studio .st-body{padding:16px 20px;overflow:auto;min-height:0;flex:1;max-width:none;margin:0;width:100%}#studio footer{display:flex;align-items:center;gap:14px;min-height:44px;padding:8px 20px;border-top:1px solid #9ba87744;font-size:14px;background:#0d2226}#studio .st-editor{display:grid;grid-template-columns:210px minmax(280px,1fr) 260px;gap:18px;height:100%;min-height:440px}.st-tools,.st-save{display:flex;flex-direction:column;gap:10px;min-width:0}.st-tools label,.st-save label{display:flex;flex-direction:column;gap:5px}.st-canvas-wrap{display:grid;place-items:center;min-width:0;background:radial-gradient(ellipse,#4a5142,#0b2024 75%);border-radius:12px;position:relative}.st-canvas-wrap canvas{width:100%;max-height:100%;aspect-ratio:1;object-fit:contain;touch-action:none;cursor:crosshair}.st-palette{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.st-color{height:44px!important;border:2px solid #c9c3a388!important;background:var(--paint)!important;text-shadow:0 1px 3px #000!important;color:white!important}.st-color[aria-pressed=true]{outline:3px solid #fff;outline-offset:-6px}.st-row{display:flex;gap:6px;flex-wrap:wrap}.st-help{font-size:13px;color:#b9cdc9}.st-odds{display:grid;gap:3px;font-size:12px}.st-odds span{display:flex;justify-content:space-between}.st-score{color:#7cddcd}.st-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}.st-item{background:#092126;border:1px solid #69857a;border-radius:12px;padding:13px;min-width:0}.st-item canvas{width:100%;aspect-ratio:1;display:block}.st-item h3{overflow-wrap:anywhere}.st-item button{margin:4px 4px 0 0;padding:7px!important;font-size:13px!important}.st-item .st-rarity{color:var(--rarity,#c7c9c6);text-transform:uppercase;font-size:12px;letter-spacing:.08em}.st-mixes{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.st-mix{background:#16383b;padding:24px;border-radius:12px;text-align:center}.st-pigments{display:flex;align-items:center;justify-content:center;gap:12px;margin:22px 0}.st-pigments i{background:var(--paint);width:40px;height:52px;border-radius:10px 10px 16px 16px;box-shadow:inset 5px 4px 0 #ffffff22;border:2px solid #ebca85}.st-empty{padding:30px;background:#17363b;border-radius:12px}.st-materials{display:flex;gap:9px;flex-wrap:wrap;padding:10px 0}.st-materials span{background:#082125;padding:5px 9px;border-radius:6px}.st-recipes{max-width:780px}.st-recipes li{margin:12px 0}.st-error{color:#ffd0a7}#studio input[name=name]{width:100%}.st-equipped{padding:15px;border:1px solid #d6b46c;border-radius:10px;margin-bottom:18px}.st-preview{width:110px;height:110px;float:left;margin-right:18px}.st-check{display:flex!important;flex-direction:row!important;align-items:center}.studio-character-link{margin:12px;padding:12px;border:1px solid #c5a35f;background:#153b40;color:#f3dca7;border-radius:8px;cursor:pointer}
@media(max-width:1000px){#studio .st-editor{grid-template-columns:170px minmax(220px,1fr);height:auto}.st-save{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.st-save .st-odds{grid-column:1/-1;grid-template-columns:repeat(5,1fr);gap:10px}.st-canvas-wrap canvas{max-height:none}.st-mixes{grid-template-columns:1fr}}
@media(max-width:620px){#studio{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}#studio header{padding:10px 12px}#studio h2{font-size:22px}#studio nav{padding:8px;gap:5px}#studio nav button{padding:7px;font-size:12px}#studio .st-body{padding:10px}#studio .st-editor{display:flex;flex-direction:column;min-height:0}.st-canvas-wrap{order:-1}.st-canvas-wrap canvas{max-height:52dvh;width:auto;max-width:100%}.st-tools{display:grid;grid-template-columns:1fr 1fr}.st-palette{grid-column:1/-1;grid-template-columns:repeat(6,1fr)}.st-help{grid-column:1/-1;margin:0}.st-save{display:flex}.st-save .st-odds{display:grid;grid-template-columns:1fr}.st-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.st-item{padding:9px}#studio footer{padding:8px 12px}.st-materials{font-size:12px}}
#studio .st-editor{height:auto}.st-canvas-wrap{align-self:start}.st-canvas-wrap canvas{height:auto;max-height:none}#studio .st-materials{color:#dbe8da}
@media(min-width:1001px){.st-canvas-wrap canvas{width:min(100%,calc(94dvh - 270px));height:auto}.st-canvas-wrap{min-height:300px}}