/* Order Now: site nav on top, creations carousel as its own band, then the studio. */
body.ink-order-studio>header{position:sticky;top:0;z-index:50}
body.ink-order-studio[data-step="upload"] .studio-header{display:none}
body.ink-order-studio .studio-header .wordmark{display:none}
body.ink-order-studio .creations-band{max-width:1680px;margin:26px auto 6px;padding:0 24px}
body.ink-order-studio:not([data-step="upload"]) .creations-band{display:none}
body.ink-order-studio .creations-band .creations-strip{position:relative;display:block;width:auto;max-width:none;padding:18px 22px 16px;border-radius:28px;border:1px solid var(--mix-line);background:linear-gradient(145deg,var(--mix-panel),var(--mix-panel-end));box-shadow:0 18px 45px #2c120e20,inset 0 1px 0 #fff1}
body.ink-order-studio .creations-band .creations-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
body.ink-order-studio .creations-band .creations-heading p{display:flex;align-items:center;gap:12px;margin:0}
body.ink-order-studio .creations-band .creations-heading strong{font:400 22px/1 'Fredoka One','Fredoka Fallback',sans-serif;color:var(--mix-panel-ink)}
body.ink-order-studio .creations-band .creations-heading span{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:#ffffff14;border:1px solid var(--mix-line);font:800 10.5px/1 Nunito,sans-serif;letter-spacing:1.3px;text-transform:uppercase;color:var(--mix-accent)}
body.ink-order-studio .creations-band .creations-heading span::before{content:'';width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#ec268f,#ffc532)}
body.ink-order-studio .creations-band .creations-controls{display:flex;align-items:center;gap:8px}
body.ink-order-studio .creations-band .creations-controls button{width:36px;height:36px;border-radius:50%;border:1px solid var(--mix-line);background:#ffffff12;color:var(--mix-panel-ink);font-size:18px;display:grid;place-items:center;cursor:pointer;transition:background .25s,transform .25s}
body.ink-order-studio .creations-band .creations-controls button:hover{background:linear-gradient(135deg,#ec268f,#ffc532);border-color:transparent;transform:scale(1.06)}
body.ink-order-studio .creations-band #creationsPause{width:auto;padding:0 14px;border-radius:999px;font:700 12px/1 Nunito,sans-serif}
body.ink-order-studio .creations-band .creations-viewport{border-radius:18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
@media(max-width:760px){body.ink-order-studio .creations-band{margin:14px auto 4px;padding:0 12px}
body.ink-order-studio .creations-band .creations-strip{padding:14px 12px 12px;border-radius:21px}
body.ink-order-studio .creations-band .creations-heading strong{font-size:18px}
body.ink-order-studio .creations-band .creations-heading span{display:none}
body.ink-order-studio .creations-band #creationsPause{display:none}}
/* bigger premium tiles, panel grows with them */
body.ink-order-studio .creations-band .creations-strip,body.ink-order-studio[data-step="upload"] .creations-band .creations-strip{height:auto!important;position:relative!important;top:auto!important;background:linear-gradient(145deg,var(--mix-panel),var(--mix-panel-end))!important}
body.ink-order-studio .creations-band .creations-heading{height:auto}
body.ink-order-studio .creations-band .creations-viewport{height:auto;padding:6px 0 4px}
body.ink-order-studio .creations-band .creations-rail{gap:14px;padding:4px 10px 6px}
body.ink-order-studio .creations-band .creation-card{flex:0 0 132px;width:132px;height:auto;padding:12px 10px 10px;gap:8px;border-radius:18px;background:var(--mix-card);border:1px solid #ffe8cf30;box-shadow:0 8px 20px #0b10221f,inset 0 1px 0 #ffffff26;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,background .35s}
body.ink-order-studio .creations-band .creation-card:hover{transform:translateY(-5px);background:var(--mix-card-hover);box-shadow:0 16px 30px #0b102233}
body.ink-order-studio .creations-band .creation-silhouette{height:86px;width:110px;filter:drop-shadow(0 4px 6px #20284233)}
body.ink-order-studio .creations-band .creation-card:hover .creation-silhouette{transform:scale(1.05)}
body.ink-order-studio .creations-band .creation-name{font:700 11.5px/1.3 Nunito,sans-serif;color:var(--mix-ink)!important}
@media(max-width:760px){body.ink-order-studio .creations-band .creation-card{flex-basis:108px;width:108px;padding:10px 8px 8px}
body.ink-order-studio .creations-band .creation-silhouette{height:66px;width:88px}
body.ink-order-studio .creations-band .creation-name{font-size:10.5px}}
@media(max-width:760px){body.ink-order-studio[data-step="upload"] .studio{padding-top:10px!important}
body.ink-order-studio[data-step="upload"] .step-counter{margin-top:6px}}
/* dot bar: phones only */
body.ink-order-studio .creations-dotbar{display:none}
@media(max-width:760px){
body.ink-order-studio .creations-band{margin:10px auto 2px}
body.ink-order-studio .creations-band .creations-strip{padding:10px 10px 8px}
body.ink-order-studio .creations-band .creations-heading{margin-bottom:6px;justify-content:center}
body.ink-order-studio .creations-band .creations-controls{display:none}
body.ink-order-studio .creations-band .creations-viewport{padding:2px 0}
body.ink-order-studio .creations-band .creation-card{flex-basis:96px;width:96px;padding:8px 6px 6px;gap:5px;border-radius:15px}
body.ink-order-studio .creations-band .creation-silhouette{height:54px;width:78px}
body.ink-order-studio .creations-band .creations-dotbar{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:6px}
body.ink-order-studio .creations-band .creations-dotbar>button{width:28px;height:28px;border-radius:50%;border:1px solid var(--mix-line);background:#ffffff0d;color:var(--mix-panel-ink);font-size:16px;line-height:1;display:grid;place-items:center;padding:0}
body.ink-order-studio .creations-band .creations-dots{display:flex;align-items:center;gap:1px}
body.ink-order-studio .creations-band .creations-dot{width:13px;height:18px;padding:0;border:0;background:none;display:grid;place-items:center}
body.ink-order-studio .creations-band .creations-dot::before{content:'';width:6px;height:6px;border-radius:50%;background:#ffffff40;transition:background .3s,transform .3s}
body.ink-order-studio .creations-band .creations-dot.is-active::before{background:var(--mix-accent);transform:scale(1.5)}
body.ink-order-studio[data-step="upload"] .studio{padding-top:4px!important}}
/* Back pill at the top of every step after the start screen. */
body.ink-order-studio .step-back{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 16px 7px 12px;border-radius:999px;border:1px solid #c9d3e8;background:#fff;color:#202c49;font:800 14px/1 Nunito,sans-serif;cursor:pointer;box-shadow:0 4px 12px #2028421a;transition:box-shadow .25s,border-color .25s}
body.ink-order-studio .step-back[hidden]{display:none}
body.ink-order-studio .step-back svg{width:18px;height:18px;flex:none;transition:transform .25s}
body.ink-order-studio .step-back em,body.ink-order-studio .step-back i{font-style:normal}
body.ink-order-studio .step-back:hover{border-color:#ec268f;box-shadow:0 8px 18px #2028422a}
body.ink-order-studio .step-back:hover svg{transform:translateX(-3px)}
body.ink-order-studio .step-back:disabled{opacity:.5;pointer-events:none}
@media(max-width:760px){body.ink-order-studio .step-back i{display:none}
body.ink-order-studio .step-back{padding:6px 14px 6px 10px;font-size:13px;margin-bottom:12px}}
/* bottom bar back: bigger, clearly a button */
body.ink-order-studio .studio-footer .back-button{padding:12px 20px;border-radius:999px;border:1px solid #ffffff3d;background:#ffffff14;color:#fff;font:800 15px/1 Nunito,sans-serif}
body.ink-order-studio .studio-footer .back-button:hover{background:#ffffff26;border-color:#ffc53280}
