/* Studio page — compact center card flow (original; layout feel similar to contemporary patcher UIs) */
.tool-page{min-height:100vh}
.tool-shell{padding:28px 0 80px}
.tool-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:28px;flex-wrap:wrap}
.tool-stage{max-width:560px;margin:0 auto}
.drop-card{position:relative;display:block;border:1px dashed rgba(255,255,255,.16);border-radius:28px;padding:56px 24px 40px;text-align:center;cursor:pointer;background:radial-gradient(80% 70% at 50% 0%,rgba(78,161,255,.1),rgba(255,255,255,.02));overflow:hidden;transition:border-color .25s,transform .25s var(--ease)}
.drop-card:hover,.drop-card.over{border-color:rgba(78,161,255,.55);transform:scale(1.01)}
.drop-glow{position:absolute;inset:-40%;background:radial-gradient(circle at 50% 30%,rgba(78,161,255,.18),transparent 55%);pointer-events:none}
.drop-icon{position:relative;z-index:1;width:56px;height:56px;margin:0 auto 14px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid var(--line);font-size:1.4rem}
.drop-card h2{position:relative;z-index:1;margin:0;font-size:1.45rem}
.drop-card p{position:relative;z-index:1}
.accent-link{color:var(--a1);text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(78,161,255,.35)}
.panel{border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.03);padding:22px}
.mode-tabs{display:flex;gap:6px;padding:5px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--line);margin-bottom:14px}
.mode-tabs button{flex:1;border:0;background:none;color:var(--mut);padding:10px 8px;border-radius:10px;font:650 .88rem inherit;cursor:pointer}
.mode-tabs button.on{background:var(--grad);color:#06121f}
.prepare-btn{width:100%;margin-top:18px;padding:14px 20px;font-size:1.02rem;border-radius:16px}
.prog.big{height:10px;border-radius:99px}
.stage-list{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:8px}
.stage-list li{display:flex;align-items:center;gap:10px;color:var(--mut2);font-size:.88rem}
.stage-list li::before{content:"";width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.15)}
.stage-list li.on{color:var(--txt)}.stage-list li.on::before{background:var(--a1);box-shadow:0 0 10px var(--a1)}
.stage-list li.done{color:var(--ok)}.stage-list li.done::before{background:var(--ok)}
.result-hero{text-align:center;padding:10px 0 6px}
.ok-orb{width:52px;height:52px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:rgba(74,222,128,.15);color:var(--ok);font-size:1.4rem;font-weight:800;border:1px solid rgba(74,222,128,.35)}
.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin:16px 0;text-align:center}
.result-grid small{display:block;color:var(--mut);font-size:.68rem;text-transform:uppercase;letter-spacing:.04em}
.result-grid b{font-size:.95rem}
.drag-overlay{position:fixed;inset:0;z-index:80;background:rgba(7,9,13,.82);backdrop-filter:blur(10px);display:grid;place-items:center;text-align:center;border:2px dashed rgba(78,161,255,.5)}
.drag-overlay h2{font-size:2rem;margin:0 0 8px}
@media(max-width:600px){.result-grid{grid-template-columns:repeat(2,1fr)}.tool-stage{padding:0 4px}}