.skin-gallery { background:var(--white); border-top:1px solid var(--line); padding:24px 26px 20px; }
.skin-tabs { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 24px; }
.skin-tabs button { border:1px solid var(--line); border-radius:4px; background:transparent; color:var(--soft); padding:8px 11px; font:400 12px/1.4 var(--sans); cursor:pointer; }
.skin-tabs button[aria-selected="true"] { border-color:var(--safe); color:var(--safe); background:var(--safe-pale); }
.skin-content { display:grid; grid-template-columns:1.25fr 1fr; gap:30px; align-items:center; }
#skin-art { display:block; width:100%; height:auto; }
#skin-art text { font-family:var(--sans); }
.skin-workorder { min-width:0; }
.skin-status { color:var(--muted); font:400 11px/1.4 var(--sans); }
.skin-workorder h4 { margin:8px 0 10px; font:500 21px/1.3 var(--sans); color:var(--heading); }
.skin-workorder p { margin:0 0 14px; font:400 14px/1.7 var(--sans); color:var(--soft); }
.skin-tools { border-top:1px solid var(--line); padding-top:10px; }
.skin-tools > div { display:grid; grid-template-columns:102px minmax(0,1fr); gap:10px; padding:5px 0; font:400 11px/1.6 var(--sans); color:var(--muted); }
.skin-tools code { font-size:11px; color:var(--safe); overflow-wrap:anywhere; }
.skin-invariants { display:flex; flex-wrap:wrap; gap:7px 20px; border-top:1px solid var(--line); padding-top:16px; margin-top:22px; font:400 12px/1.6 var(--sans); color:var(--muted); }
.skin-invariants strong { font-weight:400; color:var(--soft); }
@media(max-width:700px) { .skin-gallery { padding:22px 16px 18px; } .skin-content { grid-template-columns:1fr; gap:12px; } #skin-art { max-width:520px; margin:auto; } .skin-tabs { gap:6px; margin-bottom:10px; } .skin-tabs button { font-size:11px; padding:7px 9px; } }