.shop-lane,.shop-split{background:#000;color:#e7edf5;color-scheme:dark}
.shop-lane{padding:12px 0 40px}
.shop-kicker{margin:0 0 6px;color:#52a8ff;font:500 13px/1.2 var(--font-mono);letter-spacing:.04em;text-transform:uppercase}
.shop-kicker a{color:#52a8ff;text-decoration:none}
.shop-back{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border:1px solid rgba(219,229,242,.16);background:#05080d;color:#fff;font:600 15px/1 var(--font-sans);letter-spacing:0;text-transform:none;text-decoration:none}
.shop-back:hover{background:#ededed;color:#121212}
.shop-lane__head{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-bottom:8px}
.shop-lane h1,.shop-decide h1{margin:0;color:#fff;font-size:clamp(28px,3vw,40px);line-height:1.12;letter-spacing:-.03em;text-wrap:balance}
.shop-bar{display:grid;gap:8px;margin-bottom:8px}
.shop-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin:0}
.shop-suggest{position:relative;min-width:0}
.shop-suggest__list{position:absolute;z-index:5;top:calc(100% + 4px);left:0;right:0;margin:0;padding:4px;list-style:none;background:#05080d;border:1px solid rgba(219,229,242,.16);max-height:240px;overflow:auto}
.shop-suggest__list[hidden]{display:none}
.shop-suggest__list li{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:0 10px;color:#e7edf5;cursor:pointer}
.shop-suggest__list li[aria-selected="true"],.shop-suggest__list li:hover{background:#101826}
.shop-suggest__list strong{font:600 16px/1.3 var(--font-sans)}
.shop-suggest__list span{color:#9aa6b4;font:500 13px/1.2 var(--font-mono)}
.shop-tools label{color:#c3c9d1;font:600 13px/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase}
.shop-tools input,.shop-tools select{
  min-height:44px;background:#070b12;color:#e7edf5;border:1px solid #3a4a62;font:400 16px/1.4 var(--font-sans)
}
.shop-tools input,.shop-tools select{width:100%;height:44px;padding:0 12px;line-height:1}
.shop-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.shop-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;flex:1 1 auto}
.shop-chip,.shop-btn{
  min-height:44px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(219,229,242,.16);background:transparent;color:#ededed;font:600 15px var(--font-sans);text-decoration:none;cursor:pointer
}
.shop-chip[aria-pressed="true"]{background:#fff;color:#121212;border-color:#fff}
.shop-btn--primary{background:#fff;border-color:#fff;color:#121212}
.shop-btn--primary:hover,.shop-chip:hover,.shop-btn:hover{background:#ededed;color:#121212}
.shop-count,.shop-empty,.shop-dek,.shop-note,.shop-more p{margin:0;color:#c3c9d1;font-size:16px;line-height:1.5}
.shop-count{white-space:nowrap}
.shop-grid,.shop-related{display:grid;grid-template-columns:1fr;gap:12px}
.shop-card{display:flex;flex-direction:column;min-width:0;background:#05080d;border:1px solid rgba(219,229,242,.16);color:#e7edf5;text-decoration:none}
.shop-card[hidden]{display:none}
.shop-card img{width:100%;height:auto;aspect-ratio:2/1;max-height:168px;object-fit:cover;object-position:center;display:block;background:#101826}
.shop-card__body{display:grid;gap:2px;padding:8px 10px 10px}
.shop-card strong{color:#fff;font:600 16px/1.3 var(--font-sans)}
.shop-fact{color:#e7edf5;font:600 15px/1.4 var(--font-sans)}
.shop-sum{color:#c3c9d1;font-size:16px;line-height:1.45}
.shop-badge{justify-self:start;padding:4px 8px;border:1px solid rgba(219,229,242,.16);color:#c3c9d1;font:500 13px/1.3 var(--font-mono)}
.shop-card:focus-visible,.shop-btn:focus-visible,.shop-chip:focus-visible,.shop-back:focus-visible,.shop-tablist button:focus-visible,.shop-tools input:focus-visible,.shop-tools select:focus-visible,.shop-thumbs button:focus-visible,.shop-nav:focus-visible,.shop-note-form textarea:focus-visible,.shop-rel:focus-visible{outline:2px solid #52a8ff;outline-offset:2px}
.shop-empty a,.shop-more a{color:#52a8ff}
.shop-split{display:grid;grid-template-columns:minmax(0,1fr);background:#000}
.shop-pane{min-width:0;padding:16px 16px calc(84px + env(safe-area-inset-bottom))}
.shop-stage{background:#0c121c;border:1px solid rgba(219,229,242,.16)}
.shop-stage figure{position:relative;margin:0}
.shop-nav{position:absolute;top:50%;transform:translateY(-50%);left:8px;min-height:44px;min-width:44px;padding:0 10px;background:#05080d;color:#fff;border:1px solid rgba(219,229,242,.16);font:600 14px var(--font-sans);cursor:pointer}
.shop-nav--next{left:auto;right:8px}
.shop-stage img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center;display:block;background:#0c121c}
.shop-stage figcaption{padding:8px 12px;color:#9aa6b4;font:500 13px/1.3 var(--font-mono)}
.shop-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:8px}
.shop-thumbs button{min-height:44px;padding:4px;background:#05080d;color:#c3c9d1;border:1px solid rgba(219,229,242,.16);font:500 12px/1.2 var(--font-mono);cursor:pointer}
.shop-thumbs button[aria-pressed="true"]{border-color:#fff;box-shadow:inset 0 0 0 1px #fff;color:#fff}
.shop-thumbs img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center;background:#0c121c}
.shop-thumbs span{display:block;padding-top:4px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shop-block{margin-top:16px}
.shop-block>h2,.shop-panel>h2{margin:0 0 8px;color:#9aa6b4;font:500 13px/1.3 var(--font-mono);letter-spacing:.04em;text-transform:uppercase}
.shop-block .dl-specs>h2,.shop-panel .dl-details>h2{display:none}
.shop-panel .dl-block>h2{margin:0 0 8px;color:#fff;font:600 18px/1.3 var(--font-sans);letter-spacing:0;text-transform:none}
.shop-specs dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}
.shop-specs .dl-specs dl>div{min-height:0;padding:8px 10px;border:0;background:#05080d}
.shop-specs dt{color:#9aa6b4;font:500 12px/1.3 var(--font-mono);letter-spacing:.04em;text-transform:uppercase}
.shop-specs dd,.shop-block p,.shop-panel p,.shop-dek,.shop-note{margin:0 0 8px;color:#c3c9d1;font-size:16px;line-height:1.5}
.shop-specs dd{margin:4px 0 0;color:#e7edf5}
.shop-pick{display:inline-flex;align-items:center;min-height:44px;margin:0 0 8px;padding:0 12px;border:1px solid #fff;color:#fff;font:600 15px var(--font-sans)}
.shop-actions,.shop-dock{display:flex;flex-wrap:wrap;gap:8px}
.shop-dock{margin-bottom:8px}
.shop-dock .shop-btn--primary{flex:1 1 160px}
.shop-status{min-height:1.5em;margin:8px 0 0}
.shop-note-form{display:grid;gap:8px;margin:8px 0}
.shop-note-form label{color:#c3c9d1;font:600 13px/1.2 var(--font-mono);letter-spacing:.04em;text-transform:uppercase}
.shop-note-form textarea{width:100%;min-height:88px;padding:8px 10px;background:#070b12;color:#e7edf5;border:1px solid #3a4a62;font:400 16px/1.4 var(--font-sans)}
.shop-tabs{margin-top:16px}
.shop-tablist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.shop-tablist button{min-height:44px;padding:0 8px;border:1px solid rgba(219,229,242,.16);background:transparent;color:#ededed;font:600 15px var(--font-sans);cursor:pointer}
.shop-tablist button[aria-selected="true"]{background:#fff;color:#121212;border-color:#fff}
.shop-panel{padding-top:12px}
.shop-panel[hidden]{display:none}
.shop-notes article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px 0}
.shop-notes p,.shop-empty-note{margin:0;color:#e7edf5}
.shop-related{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.shop-rel{display:flex;flex-direction:column;min-width:0;background:#05080d;border:1px solid rgba(219,229,242,.16);color:#fff;text-decoration:none}
.shop-rel img{width:100%;aspect-ratio:16/10;object-fit:contain;background:#0c121c}
.shop-rel strong{padding:8px 8px 10px;font:600 16px/1.3 var(--font-sans)}
@media (max-width:899px){
  .shop-split{display:flex;flex-direction:column}
  .shop-back{display:none}
  .shop-pane{display:contents}
  .shop-stage{order:1;margin:12px 16px 0;height:auto;flex:none}
  .shop-stage figure{display:block;height:auto;flex:none}
  .shop-stage img{height:auto;flex:none;aspect-ratio:16/10;max-height:none}
  .shop-thumbs{grid-template-columns:repeat(6,minmax(0,1fr));padding:8px}
  .shop-buy{order:2;margin:16px 16px 0}
  .shop-block,.shop-tabs{order:4;margin-left:16px;margin-right:16px}
  .shop-specs{order:3}
  .shop-dock{position:fixed;left:0;right:0;bottom:0;z-index:30;margin:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:#000;border-top:1px solid rgba(219,229,242,.16)}
  .shop-buy h1{font-size:26px}
  .shop-dek{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .shop-note,.shop-dek{margin-bottom:8px}
  .shop-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .shop-actions .shop-btn{width:100%}
  .shop-actions .shop-btn:last-child:nth-child(odd){grid-column:1 / -1}
  .shop-block,.shop-tabs{margin-top:12px}
  .shop-specs dl>div{padding:8px 10px}
  .shop-pick{margin-bottom:4px}
}
@media (min-width:720px){
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shop-tools{grid-template-columns:minmax(0,1fr) auto;align-items:center}
}
@media (min-width:900px){
  .shop-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);height:calc(100dvh - 70px);overflow:hidden}
  .shop-back{grid-column:2;grid-row:1;justify-self:start;margin:8px 16px 0}
  .shop-pane--media{grid-column:1;grid-row:1 / -1}
  .shop-pane--buy{grid-column:2;grid-row:2}
  .shop-pane{height:100%;overflow:auto;overscroll-behavior:contain;padding:12px 16px 16px}
  .shop-pane--media{overflow:hidden;display:flex;flex-direction:column}
  .shop-stage{flex:1;min-height:0;display:flex;flex-direction:column}
  .shop-stage figure{flex:1;min-height:0;display:flex;flex-direction:column}
  .shop-stage img{flex:1;height:0;min-height:0;width:100%;aspect-ratio:auto;object-fit:contain}
  .shop-thumbs{grid-template-columns:repeat(6,minmax(0,1fr));flex:none}
  .shop-pane--buy{overflow:auto}
  .shop-buy h1{font-size:32px}
  .shop-dek{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .shop-dock,.shop-actions{margin-bottom:8px}
  .shop-actions .shop-btn{flex:1}
  .shop-dock{position:static;border:0;padding:0;background:transparent}
}
@media (min-width:1100px){
  .shop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){
  .shop-read,.shop-stage,.shop-thumbs,.shop-related{scroll-behavior:auto}
}