#shop-page {inset:0;box-sizing:border-box;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#11191d;color:#edf0e8;overflow:auto;overscroll-behavior:contain}
.shop-shell {max-width:1280px;margin:auto;padding:clamp(20px,4vw,60px) max(18px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}
.shop-heading,.shop-tools,#shop-tabs {display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.shop-heading,.shop-tools {justify-content:space-between}
.shop-heading h1 {font-size:clamp(32px,5vw,54px);letter-spacing:-.045em;margin:3px 0 16px}
.shop-tools {padding:12px 0;border-block:1px solid #34464a}
#shop-page button {border:1px solid #4c6a64;color:#c1efdc;border-radius:6px;padding:10px 14px;min-height:42px}
#shop-page button[aria-pressed=true],#shop-page .primary {background:#a1e5c8;color:#11211b}
#shop-status {min-height:1em;margin:12px 0;color:#b1cbbe}
#shop-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:16px;align-items:stretch}
#shop-grid article {min-width:0;display:flex;flex-direction:column;background:#1b282d;border:1px solid #34464a;border-radius:8px;overflow:hidden}
#shop-grid img {width:100%;height:clamp(150px,15vw,200px);object-fit:contain;background:#101619;padding:12px}
.shop-card-body {flex:1;display:flex;flex-direction:column;align-items:flex-start;padding:18px;gap:8px}
.shop-card-body small {color:#a1e5c8;font-size:11px}
.shop-card-body h2 {font-size:21px;letter-spacing:-.025em;margin:0}
.shop-card-body p,#shop-manager p {line-height:1.5;color:#b7c6c7;margin:0 0 8px}
.shop-card-body button {margin-top:auto}
.shop-card-body details {font-size:13px;margin-bottom:10px}
.shop-card-body summary {cursor:pointer;color:#a1e5c8}
:is(#shop-manager,.shop-code-form) {max-width:600px;padding:24px;background:#1b282d;border:1px solid #34464a;border-radius:8px;display:grid;gap:10px}
:is(#shop-manager,.shop-code-form) h2 {margin:0}
:is(#shop-manager,.shop-code-form) :is(select,input) {width:100%;min-width:0;border:1px solid #4c6a64;border-radius:5px;background:#11191d;color:#edf0e8;padding:10px}
:is(#shop-manager,.shop-code-form) label {margin:5px 0 0}
@media(max-width:700px),(pointer:coarse){.discord-activity .shop-shell {padding-top:max(80px,calc(env(safe-area-inset-top) + 64px))}}
@media(max-width:520px){#shop-tabs {gap:6px}#shop-page button {font-size:13px;padding:9px 11px}#shop-grid img {height:165px}}


#shop-page [hidden] {display:none!important}
#created-code-wrap:not([hidden]) {display:grid;gap:8px}
#created-code {font-family:monospace}
.sound-heading, #sound-nav { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.sound-heading { justify-content:space-between; }
.sound-heading strong, #sound-list small, #sound-slots { color:#a1e5c8; }
#sound-status { min-height:1.5em; color:#c1efdc; }
#sound-form { max-width:680px; margin-bottom:18px; }
#sound-form, #sound-list article { background:#1b282d; border:1px solid #34464a; border-radius:8px; padding:16px; }
#sound-form fieldset, #sound-form label { display:grid; gap:6px; min-width:0; }
#sound-form fieldset { border:0; padding:0; gap:12px; }
#sound-form :is(input:not([type=checkbox]),select) { width:100%; min-width:0; padding:9px; background:#11191d; color:#edf0e8; border:1px solid #4c6a64; border-radius:5px; }
#sound-form label.sound-rights { display:flex; align-items:center; }
#sound-form .sound-rights input { width:auto; }
#sound-form p, #sound-list p { color:#bbcaca; line-height:1.45; margin:.4rem 0; }
#sound-list { display:grid; gap:12px; grid-template-columns:repeat(auto-fill,minmax(min(100%,275px),1fr)); }
#sound-list article { display:flex; align-items:flex-start; flex-direction:column; gap:8px; overflow-wrap:anywhere; min-width:0; }
#sound-list h3 { margin:0; } #sound-list audio { display:block; width:100%; max-width:100%; height:38px; }
#sound-list summary { cursor:pointer; color:#a1e5c8; }
