:root{--paper:#f2f0e7;--ink:#171913;--arcade-panel:#25271f;--arcade-muted:#bdc3ae}
body{background:var(--ink);color:var(--paper)}
header{border-color:#454a3b}
aside{border-top-color:#646b55}
h1,h2{color:var(--paper)}
.eyebrow{color:var(--lime)}
.hint,.note p{color:var(--arcade-muted)}
.note{border-color:#454a3b}
.canvas-wrap,#quickAdjust,#caseEditor,#teeEditor,#illustratedTeeEditor{background:var(--arcade-panel);color:var(--paper)}
.canvas-actions span{color:var(--arcade-muted)}
.upload,#clearBackground,#addCustomCase,#addText,#export,.toolbar button,.base-picker button,.canvas-actions button,#clearCasePhoto,#clearTeePrint,#addCustomTee,#addOriginalTee,#addLongSleeveTee,#inspector button{border:0;border-radius:4px;box-shadow:0 5px 0 #6b8035;color:var(--ink)}
.upload,#clearBackground{background:var(--lime);box-shadow:0 5px 0 #6b8035}
.upload:hover,#clearBackground:hover{background:#e1ff8b}
.upload.secondary{background:var(--pop-sky);box-shadow:0 5px 0 #467a90}
.stock-section>summary{border:0;border-radius:4px;background:var(--pop-sky);color:var(--ink);box-shadow:0 5px 0 #467a90;min-height:65px;font-size:17px}
.stock-section>summary:hover{background:#b3eaff}
.stock-section>summary::after{border-radius:0;background:transparent;color:var(--ink);border-left:2px solid var(--ink);width:35px;height:39px;padding-left:7px}
.tabs{gap:10px}
.tabs button:nth-child(n){border:0;border-radius:4px;background:var(--pop-purple);color:var(--ink);box-shadow:0 5px 0 #756399}
.tabs button.active{background:var(--lime);color:var(--ink);box-shadow:0 5px 0 #6b8035}
#export{background:var(--pop-pink);color:var(--ink);box-shadow:0 5px 0 #a45678}
#export:not(:disabled):hover{background:#ffb6d6}
.base-picker button{background:var(--pop-purple);box-shadow:0 5px 0 #756399}
.base-picker button[aria-pressed=true]{background:var(--lime);box-shadow:0 5px 0 #6b8035}
.toolbar button,.toolbar #reset{background:var(--pop-purple);box-shadow:0 5px 0 #756399}
.canvas-actions button,#clearCasePhoto,#clearTeePrint,#inspector #remove{background:var(--pop-pink);box-shadow:0 5px 0 #a45678}
#addCustomCase,#addText{background:var(--pop-yellow);box-shadow:0 5px 0 #a58d35}
#addCustomTee{background:var(--lime);box-shadow:0 5px 0 #6b8035}
#addOriginalTee{background:var(--pop-sky);box-shadow:0 5px 0 #467a90}
#addLongSleeveTee{background:var(--pop-purple);box-shadow:0 5px 0 #756399}
#inspector button,#inspector #flip{background:var(--pop-yellow);box-shadow:0 5px 0 #a58d35}
#inspector #remove{background:var(--pop-pink)}
select{border:0;border-radius:4px;color:var(--ink);box-shadow:0 4px 0 #5b614b}
input[type=text],input:not([type]),input[type=number]{color:var(--ink);background:var(--paper);border-color:#91997b}
.accessories button{border-color:#4b513f;background:var(--arcade-panel);color:var(--paper);border-radius:4px}
.accessories button:hover{background:#383d2e}
.layer{background:var(--arcade-panel);color:var(--paper);border-color:#636b52;border-radius:4px}
.layer.selected{background:#3d4c22;border-color:var(--lime)}
.stock-background{background:var(--paper);color:var(--ink);border-color:#687255}
.stock-credits{color:var(--arcade-muted)}
.upload:active,button:not(:disabled):is(#clearBackground,#addCustomCase,#addText,#export,#quickRemove):active,.toolbar button:not(:disabled):active,.base-picker button:active{transform:translateY(3px);box-shadow:0 2px 0 #64733b}
.tool-group{margin:18px 0 26px;min-width:0}
.tool-group>summary,.custom-tool>summary{list-style:none;position:relative;cursor:pointer;display:flex;align-items:center;min-height:52px;padding:13px 42px 13px 14px;border-radius:4px;font-size:17px;font-weight:900;color:var(--ink);background:var(--lime);box-shadow:0 5px 0 #6b8035;text-transform:lowercase}
.tool-group>summary::-webkit-details-marker,.custom-tool>summary::-webkit-details-marker{display:none}
.tool-group>summary::marker,.custom-tool>summary::marker{content:''}
.tool-group>summary::after,.custom-tool>summary::after{content:'↓';position:absolute;right:14px;font-size:22px}
.tool-group[open]>summary::after,.custom-tool[open]>summary::after{content:'↑'}
.tool-group[open]>summary{margin-bottom:20px}
.dress-group>summary{background:var(--pop-purple);box-shadow:0 5px 0 #756399}
.custom-tool{margin:14px 0 18px;min-width:0}
.custom-tool>summary{background:var(--arcade-panel);color:var(--paper);box-shadow:none;border:1px solid #636b52;font-size:14px;min-height:46px;padding:12px 36px 12px 12px}
.custom-tool[open]>summary{margin-bottom:16px}
.custom-tool .stock-section{margin-top:18px}
.tool-group>summary:focus-visible,.custom-tool>summary:focus-visible{outline:3px solid var(--pop-sky);outline-offset:4px}

/* One consistent state language across the studio controls. */
body :is(button,.upload,select,summary){background-color:var(--pop-purple)!important;color:var(--ink)!important;box-shadow:0 5px 0 #756399!important}
body :is(button,.upload,select,summary):hover{background-color:#d5c8ff!important}
body details[open]>summary,
body details[open]>summary:hover,
body button:is(.active,.selected,[aria-pressed="true"],[aria-selected="true"]),
body button:is(.active,.selected,[aria-pressed="true"],[aria-selected="true"]):hover,
body button:not(:disabled):active,
body .upload:active,
body select:focus{background-color:var(--lime)!important;color:var(--ink)!important;box-shadow:0 5px 0 #6b8035!important}
body select:open{background-color:var(--lime)!important;box-shadow:0 5px 0 #6b8035!important}
body button:disabled{box-shadow:none!important}
body .stock-credits>summary{padding:12px;border-radius:4px;min-height:44px}
body .stock-background small{color:#34362c}
