/* A large artwork canvas, with the working tools alongside it. */
:root{--navy:#353044;--cream:#f7f4f0;--line:#ddd7de;--muted:#746c7b}
.brand{font-family:'Instrument Sans',sans-serif;font-size:29px;letter-spacing:-1.6px}
.brand span{font-size:11px;letter-spacing:0;margin-top:6px}
.studio-header{border-bottom:1px solid var(--line)}
.studio{display:grid;grid-template-columns:minmax(0,1fr) 310px;height:calc(100dvh - 83px);min-height:680px}
.art-stage{min-width:0;background:#eee9ed;border-right:1px solid var(--line)}
.atelier-panel{padding:26px 24px;overflow-y:auto;background:#fdfbf8}
.panel-heading .eyebrow{font-size:9px;letter-spacing:.15em;margin:0 0 12px}
.panel-heading h1{font-size:29px;font-weight:500;letter-spacing:-1.3px;line-height:1.08;margin:0 0 12px}
.panel-heading>p:last-child{font-size:13px;line-height:1.55;color:var(--muted);margin-bottom:22px}
.look-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:22px}
.look-grid button{border:1px solid #ddd4e2;border-radius:12px;text-align:left;font-size:10px;background:#f0e9f5;padding:12px;color:#686071}
.look-grid button b{display:block;font-size:12px;margin-top:7px;color:#393244;font-weight:500}
.look-grid button:nth-child(2){background:#e8eef0}.look-grid button:nth-child(3){background:#e6e2e6}.look-grid button:nth-child(4){background:#f4e3dd}
.atelier-panel>label{display:block;font-size:12px;margin:15px 0;color:#625a6a}
.atelier-panel select,.atelier-panel input[type=number]{display:block;width:100%;min-height:44px;margin-top:7px;border:1px solid #d9d2db;border-radius:9px;background:white;color:#393244;padding:9px 10px;font-size:13px}
.atelier-panel input[type=range]{display:block;width:100%;accent-color:#827194;margin-top:10px;height:24px}
.atelier-panel output{float:right;font-variant-numeric:tabular-nums;color:#393244}
.panel-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;border-top:1px solid var(--line);padding-top:20px;margin-top:20px}
.panel-actions button,.import-label{font-size:11px;min-height:44px;padding:9px;border-radius:10px;font-weight:500;text-align:center}
.import-label{display:flex;align-items:center;justify-content:center;background:#eeebe5;cursor:pointer;position:relative}
.import-label:focus-within{outline:3px solid #7764aa;outline-offset:3px}.import-label input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}
.panel-actions button:first-child{background:#393244;color:#fff}
.atelier-notice{font-size:11px;line-height:1.6;color:#746c7b;margin-top:16px}
.variation-section{border-top:1px solid var(--line);margin-top:22px;padding-top:18px}
.variation-section h2{font-size:15px;letter-spacing:-.4px;font-weight:500;margin:0 0 12px}.variation-section small{font-size:10px;font-weight:400;color:var(--muted);display:block;letter-spacing:0;margin-top:4px}
#variation-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}#variation-grid button{padding:0;background:#eee9ed;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
#variation-grid img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}#variation-grid span{display:block;font-size:10px;padding:8px;font-weight:400}#variation-empty{font-size:12px;color:var(--muted)}
.studio.sculpture-active .dock{width:min(550px,calc(100% - 36px));bottom:20px;border-radius:22px}
.studio.sculpture-active #material-controls,.studio.sculpture-active .energy{display:none!important}
.studio.sculpture-active #gesture-hint{bottom:164px}
.studio:not(.sculpture-active){grid-template-columns:1fr}.studio:not(.sculpture-active) .atelier-panel{display:none}
.mode img{width:44px;height:34px}.mode{font-size:12px}.more-mode{font-size:11px}
@media(min-width:1600px){.studio{grid-template-columns:minmax(0,1fr) 350px}.atelier-panel{padding:32px}}
@media(max-width:800px){
.studio-header{height:78px;padding:10px 18px}.brand{font-size:25px}.brand span{font-size:9px}.header-actions{gap:2px}.header-actions button{padding:9px 10px;font-size:12px;min-width:0}
.studio{display:flex;flex-direction:column;height:auto;min-height:0}.art-stage{height:72svh;min-height:520px;border-right:0;border-bottom:1px solid var(--line)}
.atelier-panel{overflow:visible;padding:26px 22px}.panel-heading h1{font-size:34px}.atelier-panel .look-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.look-grid button{padding:10px 8px}.look-grid button b{font-size:11px}
.atelier-panel>label{display:block}.panel-actions{grid-template-columns:repeat(4,minmax(0,1fr))}.studio:not(.sculpture-active) .art-stage{height:calc(100svh - 78px);min-height:540px}
#variation-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.stage-caption{max-width:calc(100% - 28px);left:14px;font-size:10px;padding:7px 10px}
}
@media(max-width:400px){.brand span{max-width:140px;line-height:1.3}.header-actions button{font-size:11px;padding:8px}.panel-actions{grid-template-columns:1fr 1fr}.atelier-panel .look-grid{grid-template-columns:1fr 1fr}#variation-grid{grid-template-columns:1fr 1fr}.art-stage{min-height:500px}.stage-caption{gap:6px}}

#recipe-link{width:100%;margin-top:14px;border:1px solid var(--line);padding:10px;font-size:11px;border-radius:8px}#last-artifact{display:block;font-size:12px;overflow-wrap:anywhere;margin-top:14px}