/* Guided composition over the actual Tonewedge hardware CSS and artwork.
   Keep the cream chassis, pixel serif, worn plate edges and faceted controls. */
body.guided-workshop{display:block;padding:20px 16px 28px}
.guided-workshop .site-bar{margin:0 auto 16px;height:32px}
.guided-workshop .device{margin:auto;width:min(1248px,100%);height:auto;min-height:720px;grid-template-columns:250px minmax(0,1fr);align-items:start;padding:24px;gap:24px}
.guided-workshop .left{display:flex;flex-direction:column;position:sticky;top:18px;align-self:start;height:auto;min-height:0}
.guided-workshop .unit{min-height:360px;grid-template-rows:38px 240px 44px;gap:6px}
.guided-workshop .unit-slide img{width:210px;height:220px}
.guided-workshop .nav-region{padding:14px 10px 10px}
.guided-workshop .nav-heading{display:block;margin:0 0 10px}
.guided-workshop .left-foot{display:block;margin:12px 0;text-align:center}
.guided-workshop .right{display:flex!important;flex-direction:column;height:auto;gap:16px;min-width:0}
.guided-workshop .screen{height:auto;min-height:174px;padding:18px 20px;flex:none}
.guided-workshop .screen h1{font-size:38px;line-height:1.08;margin:14px 0 12px}
.guided-workshop #screen-note{display:block;font:15px/1.55 system-ui,sans-serif;letter-spacing:0;color:var(--glass-ink);max-width:750px;margin:0 0 16px}
.guided-workshop .screen-top{gap:12px;min-height:18px;font:10px/1.4 ui-monospace,monospace;letter-spacing:.06em}
#setup-progress{height:6px;background:var(--case-low);border:1px solid var(--seam);margin:12px 0 0}
#setup-progress i{display:block;height:100%;width:calc(var(--position,.2)*100%);background:var(--accent);box-shadow:inset 0 1px var(--accent-light)}
#step-strip{display:flex;gap:5px;min-width:0}
#step-strip button{flex:1;min-width:0;min-height:44px;padding:6px 5px;font:12px/1.4 'Redaction 50',serif;white-space:normal}
#step-strip button[aria-current=step]{--cap-image:var(--cap-selected);color:#ffe0a3}
.guided-workshop #rack.builder-panel{height:auto;min-height:300px;overflow:visible;padding:22px;isolation:isolate;flex:none}
.guided-workshop #rack .panel-note{font:13px/1.55 system-ui,sans-serif;max-width:760px;margin:18px 0 0}
.guided-workshop .guide-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;bottom:8px;z-index:10;padding:12px;background:var(--case);border:2px solid var(--seam);box-shadow:inset 2px 2px var(--case-light),3px 3px var(--case-low)}
.guide-actions>button{min-height:48px;min-width:92px;padding:10px 16px;font:17px 'Redaction 50',serif}
.guide-actions>div{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 12px;text-align:center}
.guide-actions #save-state{font:11px/1.4 system-ui,sans-serif}
.guide-actions #open-save{min-height:44px;font-size:14px;padding:8px 12px}
.guided-workshop #setup-status{margin:0;font:12px/1.5 system-ui,sans-serif;color:var(--seam);padding:0 4px}
.guided-workshop #setup-status[data-pending=true]{border-left:3px solid var(--accent);padding-left:10px}
.guided-workshop #notice{position:static;margin:18px auto 0;max-width:1200px;min-height:0;padding:0 12px;font-size:14px;color:var(--ink);text-align:left;background:none;border:0}
.guided-workshop #notice:empty{display:none}
.setup-eyebrow{font:10px/1.5 ui-monospace,monospace;letter-spacing:.09em;display:block;color:#dec598;text-transform:uppercase}
.start-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.start-option{display:flex;flex-direction:column;align-items:flex-start;gap:13px;white-space:normal!important;text-align:left;min-width:0;min-height:370px;padding:20px 16px!important;background:var(--plate) url('./materials/study/sf-plate-nw.png') left top/60px 60px no-repeat!important;border:2px solid var(--seam)!important;box-shadow:inset 2px 2px var(--plate-light),inset -3px -3px var(--plate-shadow),3px 3px var(--seam)!important;color:var(--ink)!important;clip-path:none!important}
.start-option::before,.start-option::after{display:none!important}
.start-option>img{width:112px;height:112px;object-fit:contain;image-rendering:pixelated;align-self:center}
.start-option>strong{font:23px/1.1 'Redaction 50',serif}
.start-option>span:not(.setup-eyebrow):not(.option-action){font:13px/1.5 system-ui,sans-serif;color:var(--ink)}
.start-option small{font:11px/1.45 ui-monospace,monospace;color:var(--muted)}
.start-option .option-action{font:15px/1.5 'Redaction 50',serif;color:#ffd18e;border-top:1px solid var(--plate-light);padding-top:12px;margin-top:auto;align-self:stretch}
.start-option:hover{outline:2px solid var(--accent-light);outline-offset:1px}
.resume-draft{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:2px solid var(--plate-light);padding-top:20px;margin-top:24px}
.resume-draft h2{font:23px 'Redaction 50',serif;margin:5px 0}
.resume-draft p{font:13px/1.5 system-ui,sans-serif;max-width:470px;margin:0}
.resume-draft button{min-width:130px;min-height:48px;white-space:normal}
.setup-recap{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:12px;margin-bottom:22px}
.setup-recap>div{min-width:0;padding:12px;background:var(--plate);border:2px solid var(--seam);box-shadow:inset 1px 1px var(--plate-light);display:flex;align-items:flex-start;flex-direction:column;gap:8px}
.setup-recap strong{font:16px/1.35 'Redaction 50',serif;overflow-wrap:anywhere;color:var(--ink)}
.setup-recap button{min-height:44px;font-size:14px;padding:7px 15px;margin-top:auto}
.guided-workshop .builder-panel .pedalboard{height:auto;min-height:340px;gap:12px}
.guided-workshop .pedalboard-track{min-height:300px;align-items:stretch}
.guided-workshop .builder-panel .identity-grid{grid-template-columns:1fr!important;gap:28px!important}
.guided-workshop .builder-panel .guitar-options{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.guided-workshop .builder-panel .identity-details{gap:18px}
.guided-workshop .builder-panel #identity-form .guitar-choice{min-height:120px}
.guided-workshop .foundation-grid{grid-template-columns:1fr 1fr}
.guided-workshop .capture-card select{font-size:16px}
.guided-workshop .asset-card p{font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.guided-workshop .asset-state{font-size:12px}
.guided-workshop .parameter-grid{gap:14px}
.guided-workshop .parameter{min-height:160px}
.setup-jump #open-steps{display:flex;align-items:center;gap:8px;width:100%;min-height:82px;padding:10px 8px;white-space:normal;text-align:left}
.setup-jump img{width:56px;height:56px;image-rendering:pixelated;object-fit:contain;flex:none}
.setup-jump span{font:16px/1.3 'Redaction 50',serif}
.setup-jump small{display:block;font:10px/1.5 ui-monospace,monospace;margin-top:6px;color:inherit}
#step-menu{width:min(560px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 30px);overflow:auto;background:var(--case) url('./materials/option00-quiet.png') repeat;border:4px solid var(--seam);box-shadow:inset 2px 2px var(--case-light),inset -3px -3px var(--case-low),5px 5px var(--seam);color:var(--seam);padding:24px}
#step-menu::backdrop{background:#0c151bc9}
#step-menu>header{display:flex;justify-content:space-between;gap:16px;align-items:center}
#step-menu h2{font:30px/1.2 'Redaction 50',serif;margin:8px 0}
#step-menu .menu-eyebrow{font:10px ui-monospace,monospace;letter-spacing:.06em;color:var(--glass-muted)}
#step-menu>p{font:14px/1.5 system-ui,sans-serif;max-width:400px;margin:12px 0}
#close-steps{min-height:44px;min-width:76px;padding:8px 12px;font:16px 'Redaction 50',serif}
.step-destinations{position:relative;width:min(100%,440px);height:410px;margin:12px auto 0;background:var(--plate) url('./materials/glass-dither.svg');border:2px solid var(--seam);box-shadow:inset 2px 2px var(--plate-shadow),inset -2px -2px var(--plate-light)}
.step-destination{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:104px;min-height:76px;padding:10px 7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;white-space:normal;text-align:center}
.step-destination svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}
.step-destination span{font:13px/1.2 'Redaction 50',serif}
.step-destination[aria-current=step]{--cap-image:var(--cap-selected);color:#ffd18e}
.step-dial{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:86px;height:86px;object-fit:contain;image-rendering:pixelated;pointer-events:none}
/* Use the real cast-cap nine-slice assets for every new navigation action. */
.guided-workshop :is(#step-strip button,.guide-actions button,#open-steps,.step-destination,#close-steps,.resume-draft button,.setup-recap button){position:relative;isolation:isolate;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;color:#eee6ce;text-shadow:0 1px #20231c;clip-path:none!important}
.guided-workshop :is(#step-strip button,.guide-actions button,#open-steps,.step-destination,#close-steps,.resume-draft button,.setup-recap button)::before{content:'';position:absolute;inset:0 0 2px;border:8px solid transparent;border-image:var(--cap-image) 4 fill / 8px / 0 stretch;image-rendering:pixelated;z-index:-1;pointer-events:none;filter:var(--cap-filter,none)}
.guided-workshop :is(#step-strip button,.guide-actions button,#open-steps,.step-destination,#close-steps,.resume-draft button,.setup-recap button):focus-visible{outline:3px solid var(--accent-light);outline-offset:3px}
.guided-workshop :is(#step-next){--cap-image:var(--cap-on)}
.guided-workshop :is(#step-strip button,.guide-actions button,#open-steps,.step-destination,#close-steps):active:not(:disabled)::before{inset:2px 0 0}
.guided-workshop .guide-actions button:active{transform:none}
.guided-workshop :is(#step-strip button,.guide-actions button):disabled{opacity:.5;cursor:default;--cap-image:var(--cap-disabled)}
@media(max-width:1080px){.guided-workshop .device{grid-template-columns:210px minmax(0,1fr);padding:18px;gap:18px}.guided-workshop .unit{grid-template-rows:36px 200px 44px;min-height:300px}.guided-workshop .unit-slide img{width:170px;height:180px}.start-options{grid-template-columns:1fr}.start-option{display:grid;grid-template-columns:96px minmax(0,1fr);min-height:200px;gap:10px 18px;padding:18px!important}.start-option>img{grid-column:1;grid-row:1/6;width:90px;height:120px}.start-option>*:not(img){grid-column:2}.start-option .option-action{margin:0}.guided-workshop #rack.builder-panel{padding:18px}.guided-workshop .foundation-grid{grid-template-columns:1fr}.guided-workshop .builder-panel .guitar-options{grid-template-columns:repeat(3,minmax(0,1fr))!important}.setup-recap{grid-template-columns:1fr}.setup-recap>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}.setup-recap strong{grid-column:1}.setup-recap button{grid-column:2;grid-row:1/3;align-self:center}.guide-actions>div{max-width:150px}.guided-workshop .parameter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
 body.guided-workshop{padding:10px 8px 22px}.guided-workshop .site-bar{margin-bottom:10px;font-size:12px}.guided-workshop .device{display:flex;flex-direction:column;min-height:0;padding:12px;gap:16px}.guided-workshop .left{position:static;display:grid;grid-template-columns:minmax(0,1fr) 150px;width:100%;grid-template-rows:auto;min-height:160px;gap:0}.guided-workshop .unit{min-height:160px;grid-template-rows:26px 83px 40px;padding:5px;border-right:2px solid var(--seam)}.guided-workshop .unit-heading #unit-name{font-size:16px}.guided-workshop .unit-heading button{min-height:26px;width:32px}.guided-workshop .unit-slide img{width:80px;height:80px}.guided-workshop .nav-region{display:flex;align-items:center;flex-direction:column;justify-content:center;padding:12px 4px}.guided-workshop .nav-heading{font:9px ui-monospace,monospace;margin:0 0 8px}.guided-workshop .left-foot{display:none}.setup-jump #open-steps{flex-direction:column;text-align:center;gap:4px;min-height:106px;padding:8px}.setup-jump img{width:40px;height:40px}.setup-jump span{font-size:14px}.setup-jump small{font-size:9px;margin-top:4px}.guided-workshop .right{width:100%;height:auto!important;gap:14px}.guided-workshop .screen{padding:14px 12px;min-height:0}.guided-workshop .screen h1{font-size:31px;margin:14px 0 10px}.guided-workshop #screen-note{font-size:14px;line-height:1.5;margin-bottom:14px}.guided-workshop .screen-top{font-size:8px}.guided-workshop #step-strip{gap:3px}#step-strip button{font-size:10px;line-height:1.3;padding:6px 2px;min-height:48px;overflow-wrap:anywhere}.guided-workshop #rack.builder-panel{padding:14px;min-height:260px}.start-option{grid-template-columns:70px minmax(0,1fr);gap:9px 12px;padding:16px 12px!important}.start-option>img{width:65px;height:100px}.start-option>strong{font-size:22px}.start-option>span:not(.setup-eyebrow):not(.option-action){font-size:12px}.start-option small{font-size:10px}.resume-draft{flex-direction:column;align-items:flex-start;gap:14px}.resume-draft button{width:100%}.guided-workshop .guide-actions{gap:8px;padding:9px;bottom:5px}.guide-actions>button{min-width:70px;font-size:15px;padding:8px 10px}.guide-actions>div{max-width:110px;gap:3px}.guide-actions #save-state{font-size:9px}.guide-actions #open-save{font-size:12px;padding:7px;min-height:44px}.guided-workshop .builder-panel .guitar-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}.guided-workshop .builder-panel #identity-form .guitar-choice{min-height:120px}.guided-workshop .two-fields{grid-template-columns:1fr}.guided-workshop .pedalboard-track{min-height:290px}.guided-workshop .picker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guided-workshop .builder-panel #identity-form .two-fields{grid-template-columns:1fr 1fr}.guided-workshop #step-menu{padding:18px;max-height:calc(100dvh - 24px)}#step-menu h2{font-size:26px}.step-destinations{height:auto;display:grid;grid-template-columns:1fr;gap:8px;padding:12px}.step-destination{position:relative;transform:none;left:auto;top:auto;width:100%;min-height:52px;flex-direction:row;justify-content:flex-start;gap:14px;padding:12px 18px}.step-destination span{font-size:16px}.step-dial{display:none}.guided-workshop #notice{padding:0 8px}
}
@media(prefers-reduced-motion:reduce){.guided-workshop *{scroll-behavior:auto!important;transition:none!important}}

/* Keep desktop actions outside the scrolling editor, without covering its content. */
@media(min-width:701px){
 .guided-workshop .right{height:max(680px,calc(100dvh - 140px));min-height:680px;gap:12px}
 .guided-workshop #rack.builder-panel{flex:1 1 auto;min-height:280px;overflow:auto;scroll-padding:20px}
 .guided-workshop .guide-actions{position:relative;bottom:auto;flex:none}
 .guided-workshop .screen{padding:14px 18px;min-height:0}
 .guided-workshop .screen h1{font-size:34px;margin:10px 0}
 .guided-workshop #screen-note{font-size:14px;margin-bottom:12px}
 .guided-workshop #setup-status{flex:none}
}
.guided-workshop .identity-details{order:-1}
.guided-workshop :is(input,textarea,select){scroll-margin:100px 0}
/* On a phone the document scrolls naturally; persistent actions have their own chassis. */
@media(max-width:700px){
 .guided-workshop .right{padding-bottom:0!important}
 .guided-workshop .guide-actions{position:sticky;bottom:0}
 .guided-workshop #rack.builder-panel{scroll-margin-bottom:100px}
 .guided-workshop .unit-heading button{min-height:44px;min-width:44px;position:absolute;right:0;top:0;z-index:2}
 .guided-workshop .unit-heading{position:relative;padding-right:44px}
}

.guided-workshop #part-title:focus{outline:none}
@media(min-width:1081px){
 .setup-recap>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 8px;padding:10px}
 .setup-recap strong{grid-column:1;font-size:14px}
 .setup-recap button{grid-column:2;grid-row:1/3;align-self:center;padding:7px 12px}
 .setup-recap{margin-bottom:12px}
}
/* Radial destinations must retain absolute placement above shared cast-cap rules. */
@media(min-width:701px){.guided-workshop #step-menu .step-destination{position:absolute}}
@media(max-width:700px){.guided-workshop #step-menu .step-destination{position:relative}}
