/* Separate edition: the physical card has the stage, tools live in the sheet. */
:root{--ground:#f4f3ef;--ground-2:#e4e2dc;--sheet:#fff;--sheet-2:#f6f5f2;--sheet-3:#eeede8;--line:#e8e6e0;--ink:#252722;--ink-2:#62665f;--ink-3:#6c7068;--brass:#79613c;--brass-2:#604b2b;--brass-tint:#f0ebe2;--r:12px;--r-lg:18px}
.studio{font-size:15px}
.studio .app{grid-template-columns:minmax(0,1fr) 420px;grid-template-rows:88px minmax(0,1fr)}
.studio .top{padding:0 32px;gap:20px;background:var(--ground);border-bottom:1px solid var(--line)}
.studio .brand{display:flex;flex-direction:column;gap:3px;font-size:12px;letter-spacing:.18em}
.studio .brand small{font-size:11px;letter-spacing:.02em;text-transform:none;font-weight:400;color:var(--ink-2)}
.studio-steps{display:flex;align-items:center;gap:8px}
.studio-steps button{display:flex;align-items:center;gap:8px;min-height:44px;padding:5px 9px;background:none;border:0;border-radius:8px;color:var(--ink-2);font-size:13px}
.studio-steps b{font-size:11px;display:grid;place-items:center;height:23px;width:23px;border:1px solid #d8d7d0;border-radius:50%;font-weight:500}
.studio-steps i{width:24px;height:1px;background:var(--line)}
.studio-steps button[aria-current]{color:var(--ink);font-weight:600}
.studio-steps button[aria-current] b{background:var(--ink);color:white;border-color:var(--ink)}
.studio .icon-btn{width:44px;height:44px}
.studio .top-right{gap:8px}
.studio-menu{position:relative;z-index:40}
.studio-menu>summary,.studio-view>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:12px}
.studio-menu>summary{width:44px}
.studio-menu summary::-webkit-details-marker,.studio-view summary::-webkit-details-marker{display:none}
.studio-menu svg,.studio-view svg{width:20px;height:20px}
.menu-content{position:absolute;right:0;top:52px;min-width:250px;padding:20px;background:white;border:1px solid var(--line);box-shadow:0 14px 36px #25272216;border-radius:16px}
.menu-content p{margin-bottom:10px;color:var(--ink-2);font-size:12px}
.menu-content a{display:block;margin-top:16px;color:var(--ink);font-size:13px;line-height:1.5}
.studio .lang button{min-height:44px;min-width:52px}
.studio .stage{grid-template-rows:auto minmax(0,1fr) auto auto;background:radial-gradient(ellipse at 50% 56%,#e7e5df 0%,#f4f3ef 70%)}
.studio-stage-head{display:flex;align-items:center;justify-content:space-between;padding:40px 48px 0;gap:20px}
.eyebrow{font-size:10px;font-weight:600;letter-spacing:.16em;color:var(--ink-2)}
.studio-stage-head h1{margin-top:9px;font-size:clamp(20px,2.1vw,32px);font-weight:400;letter-spacing:-.035em;line-height:1.2}
.studio-dimensions{font-size:11px;white-space:nowrap;color:var(--ink-2);align-self:end}
.studio .card-workspace{padding:40px 64px 30px}
.studio .scene{width:min(100%,750px,calc((100dvh - 430px)*1.579));max-height:none}
.studio .shadow{opacity:.6;filter:blur(26px);bottom:-10%;height:12%}
.studio .empty-start{display:none!important}
.studio .under-card{padding:6px 24px;gap:8px}
.studio .finish-line,.studio .meta-row{display:none}
.studio-material{display:flex;align-items:center;gap:9px;padding:7px 13px;min-height:44px;border:1px solid transparent;border-radius:24px;background:transparent;font-size:13px}
.studio-material:hover{background:#fff8;border-color:var(--line)}
#studioMaterialSwatch{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 1px #0002}
.studio-material strong{font-weight:500}.studio-material>span:last-child{margin-left:5px;color:var(--ink-2);font-size:12px;text-decoration:underline;text-underline-offset:3px}
.studio .hint-stage{font-size:12px;color:var(--ink-2);min-height:18px}
.studio .toolbar{padding:10px 24px 28px;gap:16px}
.studio #sideSeg{padding:4px;background:#e8e7e1;border:0;border-radius:99px;gap:2px}
.studio #sideSeg button{min-height:40px;min-width:90px;border-radius:99px;font-size:13px;background:transparent;border:0;color:var(--ink-2)}
.studio #sideSeg button[aria-pressed=true]{background:white;color:var(--ink);box-shadow:0 2px 4px #00000008}
.studio-view{position:relative;z-index:25}
.studio-view>summary{padding:0 14px;color:var(--ink-2);font-size:13px}
.studio-view[open]>summary{background:white;color:var(--ink)}
.view-options{position:absolute;bottom:54px;right:0;width:290px;padding:16px;background:white;border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 40px #2527221a}
.studio .view-options .tools{display:grid;grid-template-columns:1fr;border:0;padding:0;gap:4px;margin:0;background:none}
.studio .tool{flex-direction:row;font-size:12px;gap:8px;padding:12px 8px;min-height:44px;text-align:left}
.studio #b-flip{display:none}
.studio .view-options .tool{width:100%;gap:12px;min-height:46px;font-size:14px}
.studio .view-options .tool span{display:block}
.studio .view-options .tool svg{flex:0 0 20px;width:20px;height:20px}
.studio .safe-guide{z-index:5;box-shadow:0 0 0 1px #0003}
.studio .busy{top:12px;right:20px;font-size:11px;pointer-events:none}
.studio .panel{grid-template-rows:minmax(0,1fr) auto;border-left:1px solid var(--line)}
.studio .body{padding:38px 32px 28px;scroll-padding-top:24px}
.studio .panel h1{font-size:30px;font-weight:400;letter-spacing:-.035em;line-height:1.14;margin-bottom:12px}
.studio .lead,.studio-heading p{font-size:14px;line-height:1.6;color:var(--ink-2);margin:0 0 25px}
.studio .studio-heading h1{margin-top:9px}
.studio #finishes{display:flex;flex-direction:column;gap:10px;margin-top:26px}
.studio #finishes .opt{position:relative;display:grid;grid-template-columns:46px 1fr;gap:2px 15px;text-align:left;align-items:center;padding:16px;min-height:82px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.studio #finishes .opt:hover{background:var(--sheet-2)}
.studio #finishes .opt[aria-pressed=true]{border-color:var(--brass);box-shadow:inset 0 0 0 1px var(--brass);background:#faf8f4}
.studio #finishes .sw{grid-row:1/3;width:46px;height:40px;border-radius:6px;margin:0;box-shadow:inset 0 0 0 1px #0002}
.studio #finishes .nm{font-size:15px;font-weight:500;line-height:1.25}
.studio #finishes .sub{font-size:12px;line-height:1.35;color:var(--ink-2);margin:0}
.studio .finish-detail{display:none}
.studio #finishNote{margin-top:20px}
.studio #finishNote .note{background:transparent;border:0;font-size:12px;padding:0;line-height:1.6;color:var(--ink-2)}
.studio .foot{padding:17px 32px 24px;box-shadow:none}
.studio .save-status{display:block;font-size:11px;text-align:center;max-width:none;margin-bottom:9px;color:var(--ink-2)}
.studio .step-caption{text-align:center;font-size:11px;line-height:1.5;margin:0 0 12px;color:var(--ink-2)}
.studio .btn.pri{background:var(--ink);border-color:var(--ink);border-radius:99px;min-height:50px;font-size:14px;font-weight:500}
.studio .btn.pri:hover{background:#454a3e;border-color:#454a3e}
.studio .btn.quiet{font-size:13px;padding-left:0}
.studio #selectionTools,.studio #inspectorTabs,.studio .legacy-heading,.studio #dzBig,.studio #uploadMore,.studio #textDetails,.studio [data-pane="3"]>.presets{display:none!important}
.studio .quick-add{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:0;padding:0;gap:10px;margin-bottom:28px}
.studio .quick-add button{justify-content:center;flex-direction:column;gap:9px;min-height:80px;font-size:12px;background:var(--sheet-2);color:var(--ink);border:1px solid var(--line);padding:14px 8px;border-radius:12px}
.studio .quick-add button:hover{background:var(--brass-tint);border-color:#d2c5ae}
.studio .quick-add #b-addlogo{grid-column:1/-1;min-height:66px;flex-direction:row;gap:12px;font-size:15px;background:#f2eee6;border-color:#e7dfd0}
.studio .quick-add #b-quicktext{grid-column:1/-1;flex-direction:row;gap:12px;min-height:58px;font-size:14px}
.studio .quick-add svg{width:22px;height:22px}
.studio-add-toggle{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;width:100%;background:var(--sheet-2);border:1px solid var(--line);border-radius:10px;font-size:13px;margin-bottom:24px}
.studio-add-toggle>span:first-child{font-size:20px;font-weight:400}
.studio-hub.compact .studio-heading{display:none}
.studio-elements{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.studio .studio-elements h2{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-2);margin:0 0 8px}
#studioElementList{display:grid;gap:5px}
#studioElementList button{display:flex;align-items:center;gap:10px;width:100%;padding:8px 4px;background:none;border:0;border-radius:8px;text-align:left;min-height:48px;font-size:13px}
#studioElementList button:hover{background:var(--sheet-2)}
#studioElementList img,.element-kind{width:36px;height:30px;object-fit:contain;border-radius:4px;background:var(--sheet-2);flex:none;display:grid;place-items:center;font-size:12px;color:var(--ink-2)}
#studioElementList button>span:nth-last-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
#studioElementList button>span:last-child{margin-left:auto}
.studio-connection{display:flex;align-items:center;gap:10px;min-height:54px;background:none;border:0;border-top:1px solid var(--line);width:100%;margin-top:24px;font-size:12px;color:var(--ink-2);text-align:left;padding:10px 0}
.studio-connection svg{width:20px;height:20px}.studio-connection>span:last-child{margin-left:auto}
.studio-selection{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px}
.studio .studio-selection h2{font-size:25px;font-weight:400;letter-spacing:-.025em;margin:5px 0 0}
.studio .mini{min-height:40px;font-size:12px}
.studio #imageActions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 20px}
.studio #imageActions button{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:10px;background:var(--sheet-2);padding:10px 12px;width:auto;min-height:44px;font-size:12px;color:var(--ink)}
.studio #imageActions button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}
.studio #imageActions svg{width:17px;height:17px}
.studio-fitting{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 20px}
.studio-fitting button{justify-content:center;text-align:center;min-height:44px;border-radius:10px;line-height:1.3;padding:10px 8px;background:var(--sheet-2)}
.studio-fitting #b-cover{background:var(--brass-tint);border-color:#d2c5ae;color:var(--ink)}
.studio-fitting p{grid-column:1/-1;margin:0}
.studio .ghost .sel::after{display:none}
.studio .resize-handle{position:absolute;width:12px;height:12px;border:2px solid #fff;background:var(--brass);border-radius:50%;box-shadow:0 1px 3px #0005;pointer-events:auto;touch-action:none}
.studio .corner-0,.studio .corner-3{cursor:nwse-resize}.studio .corner-1,.studio .corner-2{cursor:nesw-resize}
.studio .corner-0{left:-7px;top:-7px}.studio .corner-1{right:-7px;top:-7px}
.studio .corner-2{left:-7px;bottom:-7px}.studio .corner-3{right:-7px;bottom:-7px}
.studio .scene[data-resize="0"],.studio .scene[data-resize="3"]{cursor:nwse-resize}
.studio .scene[data-resize="1"],.studio .scene[data-resize="2"]{cursor:nesw-resize}
.studio #cropLabel,.studio #invertState{position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important;white-space:normal}
.studio .field{margin-bottom:16px}
.studio input:not([type=range]):not([type=checkbox]),.studio select,.studio textarea{font-size:15px;min-height:46px;border-color:var(--line);border-radius:9px;background:var(--sheet-2);padding:11px 12px}
.studio textarea{resize:vertical;line-height:1.5}
.studio label{color:var(--ink-2)}
.studio #freeTextControls{margin-bottom:24px}
.studio #textAlign button{min-height:40px}
.studio-fold{border-top:1px solid var(--line)}
.studio-fold>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;list-style:none;cursor:pointer;min-height:58px;font-size:13px;font-weight:500;line-height:1.4}
.studio-fold>summary::-webkit-details-marker{display:none}
.studio-fold>summary::after{content:'+';font-size:20px;font-weight:400;color:var(--ink-2);flex:none}
.studio-fold[open]>summary::after{content:'−'}
.fold-content{padding:0 0 22px}
.studio .fold-content h2{font-size:12px;margin:18px 0 10px}
.studio .fold-content h2:first-child{margin-top:0}
.studio .help{font-size:12px;line-height:1.6;color:var(--ink-2)}
.studio .slider{grid-template-columns:78px minmax(0,1fr) 50px;gap:8px;margin:16px 0}
.studio .seg button{min-height:42px;font-size:12px}
.studio #powerSwatches{grid-template-columns:repeat(4,1fr);gap:8px}
.studio .power-swatch{min-height:67px;padding:8px 4px;border-radius:10px}
.studio .power-label{font-size:10px;color:var(--ink-2)}
.studio #engravingControls>.row-between{display:none}
.studio #invertHelp{display:none}
.studio details.more{margin-top:15px;border-color:var(--line);background:none}
.studio details.more>summary{min-height:44px;display:flex;align-items:center;font-size:12px;cursor:pointer}
.studio #iconsDetails:not([open]){display:none}
.studio #iconsDetails{margin:10px 0}
.studio #iconsDetails>summary{font-size:22px;font-weight:400;cursor:default}
.studio #studioIconsDone{float:right;margin-bottom:15px}
.studio #elementActions{padding-top:20px;border-top:1px solid var(--line);margin-top:8px;gap:6px;flex-wrap:wrap}
.studio #elementActions button{font-size:11px}
.studio #b-delel{margin-left:auto}
.studio #connectionSettings{margin-top:0;border:0;padding:0}
.studio #connectionSettings>summary{display:none}
.studio #connectionSettings .note{font-size:12px}
.studio .qr-polarity button{min-height:130px;padding:10px;font-size:12px}
.studio .qr-polarity canvas{height:50px;width:50px}
.studio-review-sides{display:flex;gap:6px;margin-bottom:28px}
.studio-review-sides button{flex:1;min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--sheet-2);font-size:12px}
.studio-review-sides button[aria-pressed=true]{background:var(--ink);color:white}
.studio #summary:empty{display:none}
.studio .note{border-radius:10px;font-size:12px;line-height:1.6}
.studio #b-senddesign{width:100%}
.studio :is(button,a,summary,input,select,textarea):focus-visible{outline:2px solid var(--brass);outline-offset:3px}
@media(min-width:981px) and (max-width:1200px){.studio .app{grid-template-columns:minmax(0,1fr) 380px}.studio .top{padding:0 20px}.studio .body{padding:28px 24px}.studio-stage-head{padding:30px 32px 0}.studio-dimensions{display:none}.studio .card-workspace{padding:30px 40px}}
@media(max-width:980px){
 .studio{overflow:auto}.studio .app{display:block;overflow:visible;height:auto;min-height:100dvh;width:100%}
 .studio .top{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:56px 48px;gap:0 12px;height:104px;padding:0 20px;position:sticky;top:0;z-index:35;background:#f4f3eff5;backdrop-filter:blur(16px)}
 .studio .brand{grid-column:1;grid-row:1;display:flex;font-size:11px}.studio .brand small{font-size:10px}
 .studio .top-right{grid-column:2;grid-row:1}.studio .studio-steps{grid-column:1/-1;grid-row:2;justify-self:center;gap:7px}
 .studio-steps button{min-height:42px;font-size:12px}.studio-steps i{width:28px}.studio-steps b{height:21px;width:21px}
 .studio .stage{position:sticky;top:104px;z-index:15;display:grid;grid-template-rows:minmax(0,1fr) auto auto;overflow:visible;border-bottom:1px solid var(--line)}
 .studio-stage-head{display:none}.studio .card-workspace{padding:24px 40px 13px}
 .studio .scene{width:min(100%,440px,calc(24dvh*1.579));max-height:none}
 .studio .under-card{padding:3px 20px;gap:0}.studio .hint-stage{display:none}
 .studio-material{min-height:34px;padding:4px 10px;font-size:12px}.studio-material>span:last-child{font-size:11px}
 .studio .toolbar{padding:3px 20px 12px;gap:15px}.studio #sideSeg button{min-height:36px;min-width:85px;font-size:12px}.studio-view>summary{min-height:44px;font-size:12px}
 .studio .panel{display:block;border:0;min-height:0}
 .studio .body{overflow:visible;max-width:640px;margin:auto;padding:26px 24px calc(165px + env(safe-area-inset-bottom))}
 .studio .panel h1{font-size:27px}.studio .lead,.studio-heading p{font-size:14px;margin-bottom:20px}
 .studio .foot{position:fixed;bottom:0;left:0;right:0;z-index:30;padding:10px 24px calc(14px + env(safe-area-inset-bottom));background:#fffffff5;backdrop-filter:blur(16px);border-top:1px solid var(--line)}
 .studio .foot-actions{max-width:592px;margin:0 auto}.studio .save-status{font-size:10px;margin:0 0 6px}.studio .step-caption{display:none}
 .studio .btn.pri{min-height:47px;font-size:14px}
 .studio #finishes{margin-top:20px;gap:8px}.studio #finishes .opt{min-height:74px;padding:12px 15px}
 .studio .quick-add{gap:8px;margin-bottom:20px}.studio .quick-add button{min-height:70px}.studio .quick-add #b-addlogo{min-height:58px}.studio .quick-add #b-quicktext{min-height:50px}
 .studio .mini{min-height:44px}.studio input:not([type=range]):not([type=checkbox]),.studio select,.studio textarea{font-size:16px}
 .studio .studio-selection h2{font-size:23px}.studio-selection{margin-bottom:18px}
 .studio .busy{top:5px;right:12px;font-size:10px}
}
@media(max-width:480px){.studio .card-workspace{padding:20px 28px 10px}.studio .top{padding:0 16px}.studio .body{padding-left:20px;padding-right:20px}.studio .foot{padding-left:20px;padding-right:20px}.studio .history-controls{gap:0}.studio .top-right{gap:0}.studio .icon-btn{width:38px}.studio .view-options{right:-10px;width:272px}}
@media(max-width:980px) and (max-height:650px){.studio .stage{position:relative;top:auto}.studio .scene{width:min(100%,380px)}.studio .top{position:relative}.studio .card-workspace{padding:20px 40px}.studio .foot{position:sticky}.studio .body{padding-bottom:30px}}
@media(prefers-reduced-motion:reduce){.studio *,.studio *::before,.studio *::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Keep a finish brought into view clear of the fixed preview and bottom action. */
@media(max-width:980px) and (min-height:651px){.studio #finishes .opt{scroll-margin-top:calc(24dvh + 256px);scroll-margin-bottom:110px}}

/* Filled artwork is distinct from line icons used by editor controls. */
.studio .icons svg.brand-icon{fill:currentColor;stroke:none}.studio-icon-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.studio-icon-toolbar>span{font-size:16px;font-weight:500}.studio #studioIconsDone{float:none;flex-shrink:0;margin:0;min-height:44px}.studio #signatureControls .row-between h2{display:none}.studio #signatureControls .row-between{justify-content:flex-end}.studio #imageDetectionHint{color:#4f6651;font-size:12px;margin:0 0 14px}.studio #iconsDetails #icons{clear:both}

.studio #iconsDetails>summary{display:none}

@media(max-width:980px) and (min-height:651px){.studio #iconsDetails{scroll-margin-top:calc(24dvh + 246px)}}

/* Metal thickness belongs to the preview, not the engraving canvas. */
.studio .card3d{--card-half-depth:2px}
.studio .face.front{transform:translateZ(var(--card-half-depth))}
.studio .face.back{transform:rotateY(180deg) translateZ(var(--card-half-depth))}
.card-shell{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.card-shell i{position:absolute;display:block;background:linear-gradient(0deg,#53575a,#e0e3e3 20%,#90989a 50%,#f0f1ee 73%,#555a5c);backface-visibility:visible}
[data-edge-metal=brass] .card-shell i{background:linear-gradient(0deg,#69532e,#e2c88b 20%,#a88a48 50%,#f1dba3 73%,#705931)}
.studio #studioImageTop{margin:0 0 24px}
.studio #studioImageTop #modeHelp{display:none}
.studio #studioImageTop #modeBox{margin:0}
.studio #studioImageTop #modeSeg{margin:0}
.studio #studioImageTop #imageDetectionHint{margin:9px 0 12px;font-size:11px}
.studio #studioImageTop .image-actions{margin:12px 0 0}
.studio .studio-review-spin{border:1px solid var(--line);border-radius:999px;background:var(--sheet);padding:9px 16px;min-height:44px;font-size:12px;white-space:nowrap}
.studio[data-studio-phase="4"] .toolbar{flex-wrap:wrap}
.studio[data-studio-phase="4"] #sideSeg{display:none}
.studio[data-studio-phase="4"] #b-spin{display:none}

@media(max-width:980px) and (min-height:651px){.studio #studioSelection{scroll-margin-top:calc(24dvh + 246px)}}

/* Hardware exclusion is visible only while editing the back. */
.studio .scene{aspect-ratio:84/54.2}
.nfc-boundary{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed #ae9160;pointer-events:none;z-index:4}
.studio-nfc-note{margin:10px auto;color:#686a62;font-size:12px;max-width:460px;line-height:1.5;text-align:center}
.studio-nfc-note button{display:block;margin:5px auto 0;padding:7px 12px;border:1px solid #c9c8bd;border-radius:20px;background:#fff;color:#383a33;min-height:36px}
@media(max-width:980px){.studio-nfc-note{font-size:11px;margin:5px auto;max-width:310px}.studio-nfc-note button{min-height:36px;padding:4px 12px}.studio [data-nfc-overlap=true]{scroll-margin-top:400px}}

/* The back starts with a QR and two useful additions, with other tools one tap away. */
.studio-back-start{padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--sheet-2);margin:0 0 18px}
.back-qr-caption{display:flex;gap:12px;align-items:flex-start}.qr-badge{flex:none;display:grid;place-items:center;width:38px;height:38px;border:1px solid #d7d0c2;border-radius:9px;color:var(--brass);font-size:12px;letter-spacing:.06em}
.back-qr-caption strong{display:block;font-weight:500;font-size:14px;line-height:1.5}.back-qr-caption p{font-size:12px;line-height:1.6;color:var(--ink-2);margin:5px 0 15px}
.studio #studioEditQr{width:100%;border:1px solid #c9bea9;background:white;font-size:13px;color:var(--ink)}
.back-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.back-shortcuts button{padding:10px 5px;min-height:44px;border:0;border-radius:8px;background:#eae6dc;font-size:12px;line-height:1.4}
.studio .qr-destination h2{margin:0 0 12px;font-size:14px;font-weight:500}.studio #qrDestination{display:flex}.studio #qrDestination button{flex:1}
.studio #qrExampleNote{margin:14px 0 22px}.studio #qrBox .slider{margin-bottom:12px}.studio .qr-center{width:100%;margin:0 0 16px;border:1px solid var(--line)}
.studio #qrAppearance{margin:8px 0 18px}.studio #qrAppearance .note{margin-bottom:16px}.review-qr-note{padding:14px;background:var(--brass-tint);border-radius:10px;line-height:1.6;color:var(--ink-2);font-size:13px;margin:0 0 18px}
@media(max-width:980px){.studio .studio-steps{gap:2px;width:100%;justify-content:space-between}.studio-steps button{gap:5px;padding:5px 4px;font-size:11px}.studio-steps i{width:12px}.studio-steps b{width:20px;height:20px;font-size:10px}.studio .foot .btn.quiet{font-size:11px;padding-right:10px}.studio-back-start{padding:16px}}
@media(max-width:360px){.studio-steps i{display:none}.studio .studio-steps button{font-size:10px;gap:4px}}
@media(min-width:981px){.studio .card-workspace{container-type:size}.studio .scene{width:min(100cqw,750px,calc(100cqh * 84 / 54.2))}}
@media(max-width:980px) and (min-height:651px){.studio[data-studio-phase="3"] .scene{width:min(100%,440px,calc(21dvh * 84 / 54.2))}.studio[data-studio-phase="3"] .studio-heading>.eyebrow{display:none}.studio[data-studio-phase="3"] .studio-heading h1{margin-top:0}.studio[data-studio-phase="3"] .studio-heading p{margin-bottom:16px}}
@media(max-width:980px) and (min-height:651px){.studio .body :is(button,input,textarea,select,summary){scroll-margin-top:calc(24dvh + 256px);scroll-margin-bottom:120px}}
.qr-quick-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start}.studio .qr-quick-actions #qrDel{border:1px solid var(--line);padding:8px 14px;border-radius:999px;min-height:40px}

/* Material reflection follows the real finish; engraving keeps its own sheen. */
.studio .face .sheen:not(.engr){opacity:var(--surface-sheen,.22)}
