/* AGE-355: complete stationary artwork, then a scrolling card workspace. */
#deck-detail-view { position: relative; isolation: isolate; padding: 0; --deck-hero-height: 65dvh; --deck-hero-top: 56px; }
#deck-detail-view #deck-analysis-stage.deck-backdrop {
  position: fixed; inset: var(--deck-hero-top) 0 auto; width: 100%; max-width: none;
  height: var(--deck-hero-height); min-height: 0; aspect-ratio: auto;
  margin: 0; border-radius: 0; pointer-events: none; z-index: 0;
  background: var(--panel-sunken);
}
#deck-analysis-stage.deck-backdrop::after { display: none; }
#deck-analysis-stage.deck-backdrop .wp-empty { background: radial-gradient(ellipse at 75% 8%,rgba(158,146,213,.12),transparent 60%),var(--panel-sunken); }
#deck-analysis-stage.deck-backdrop .wp-hero-img { object-fit: contain; object-position: center; }
#deck-hero-scene { position: relative; z-index: 1; height: var(--deck-hero-height); margin-top: -20px; scroll-margin-top: var(--deck-hero-top); }
.deck-hero-tools { position: absolute; inset: 16px 0 auto; display: flex; justify-content: space-between; gap: 12px; }
.deck-hero-tool-group { display: flex; align-items: center; gap: 8px; }
.deck-hero-tools .btn { background: var(--panel); color: var(--text); box-shadow: 0 2px 12px #0003; }
#deck-hero-details { position: absolute; inset: auto 0 20px; max-height: calc(100% - 80px); overflow: auto; visibility: hidden; opacity: 0; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease; }
#deck-hero-scene.details-revealed #deck-hero-details { visibility: visible; opacity: 1; transform: none; }
#deck-workspace-surface { position: relative; z-index: 2; background: var(--bg); border-radius: 16px 16px 0 0; box-shadow: 0 -12px 32px #0002; padding: 18px; min-height: 70dvh; }
.deck-workspace-bar { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 18px; }
#deck-detail-view .deck-head { margin: 0; padding: 20px; min-height: 0; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb,var(--panel) 94%,transparent); backdrop-filter: blur(12px); }
#deck-detail-view .deck-head-main { align-items: center; }
#deck-detail-view #back-to-decks { background: var(--panel); color: var(--text); border: 1px solid var(--border); }
#deck-detail-view .deck-head-title { flex-basis: 250px; }
#deck-hero-details #deck-hero-title { margin: 0 0 8px; font-family: "Archivo","Work Sans",sans-serif; font-size: clamp(1.4rem,3vw,2rem); line-height: 1.15; color: var(--text); overflow-wrap: anywhere; }
.deck-name-editor { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: center; margin: 8px 0 18px; }
.deck-name-editor label,.deck-name-editor #deck-meta-status { grid-column: 1/-1; font-size: .8rem; color: var(--text-muted); }
#deck-detail-view .deck-name-input { max-width: 100%; font-size: clamp(1.35rem,3vw,2rem); }
#deck-detail-view .deck-summary-actions { margin-top: 16px; }
#deck-detail-view .deck-art-toggle { color: var(--text); background: var(--panel); border: 1px solid var(--border); padding: 8px 12px; border-radius: 8px; margin: 0; font-size: .75rem; }
#deck-detail-view .deck-settings { background: var(--panel); margin-bottom: 16px; width: 100%; margin-inline: 0; }
#deck-detail-view .deck-settings:not([open]) { display: none; }
#deck-pull-strip[hidden],#deck-detail-view.shared-view #mana-pill,#deck-detail-view.shared-view #mana-panel { display: none; }
#deck-detail-view .deck-settings > summary { flex-wrap: wrap; gap: 10px; }
#deck-settings .deck-head-actions { padding: 8px 0 16px; }
#deck-wallpaper-chrome { position: static; opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
#deck-wallpaper-chrome .wp-facts { padding: 12px 0; color: var(--text); }
#deck-wallpaper-chrome .wp-facts-row { align-items: flex-start; flex-wrap: wrap; }
#deck-wallpaper-chrome .wp-textblock { display: none; }
#deck-wallpaper-chrome .wp-card-group { margin: 0; align-items: flex-start; }
#deck-wallpaper-chrome .wp-controls { flex-wrap: wrap; }
#deck-artwork-panel { position: absolute; right: 0; top: 64px; max-height: calc(100% - 80px); z-index: 3; width: 304px; max-width: 100%; overflow: auto; padding: 18px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); color: var(--text); box-shadow: 0 10px 32px #0003; overscroll-behavior: contain; }
#deck-artwork-panel[hidden] { display: none; }
.deck-artwork-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.deck-artwork-panel-head h3 { margin: 0; font-size: 1rem; }
#deck-artwork-close { min-width: 40px; min-height: 40px; font-size: 1.3rem; }
#deck-artwork-panel .wp-facts { padding: 0; }
#deck-artwork-panel .wp-facts-row { display: block; }
#deck-artwork-panel .wp-card-group { display: flex; flex-direction: column; align-items: stretch; gap: 20px; width: 100%; }
#deck-artwork-panel .wp-controls { display: flex; flex-direction: column; align-items: stretch; gap: 10px; width: 100%; }
#deck-artwork-panel .wp-control-label { font-size: .72rem; color: var(--text-muted); font-weight: 600; }
#deck-artwork-panel .wp-control-label:not(:first-child) { margin-top: 10px; }
#deck-artwork-panel .wp-style-picker { display: grid; gap: 8px; width: 100%; }
#deck-artwork-panel .wp-swatch { display: flex; align-items: center; gap: 10px; width: 100%; height: auto; min-height: 48px; padding: 7px 26px 7px 7px; background: var(--panel-sunken); color: var(--text); font-size: .8rem; text-align: left; border-radius: 7px; }
#deck-artwork-panel .wp-swatch img { width: 48px; height: 32px; object-fit: cover; border-radius: 3px; flex: none; }
#deck-artwork-panel .wp-swatch.active { border-color: var(--accent); }
#deck-artwork-panel .wp-fmt-seg { display: flex; width: 100%; border-color: var(--border); background: var(--panel-sunken); }
#deck-artwork-panel .wp-fmt-seg button { flex: 1; justify-content: center; color: var(--text); background: transparent; min-height: 44px; }
#deck-artwork-panel .wp-fmt-seg button[aria-pressed="true"] { background: var(--accent); color: #fff; }
#deck-artwork-panel .wp-dl-btn { justify-content: center; width: 100%; min-height: 44px; margin-top: 6px; background: var(--panel-raised); color: var(--text); border-color: var(--border); }
#deck-artwork-panel .wp-proxy-card { width: 100%; border-radius: 0; background: transparent; box-shadow: none; border-top: 1px solid var(--border); filter: none; opacity: 1; padding-top: 12px; }
#deck-artwork-panel .wp-proxy-title { min-height: 44px; padding: 8px 0; color: var(--text); background: transparent; gap: 8px; }
#deck-artwork-panel .wp-proxy-name { color: var(--text); font-size: .8rem; font-weight: 600; }
#deck-artwork-panel .wp-proxy-cost { margin-left: auto; width: auto; height: auto; background: var(--panel-sunken); color: var(--text-muted); font-size: .68rem; padding: 4px 7px; border-radius: 5px; white-space: nowrap; }
#deck-artwork-panel .wp-proxy-chevron { color: var(--text-muted); transition: transform .2s; }
#deck-artwork-panel .wp-proxy-card[data-open="true"] .wp-proxy-chevron { transform: rotate(180deg); }
#deck-artwork-panel .wp-proxy-body-outer { transition: none; }
#deck-artwork-panel .spellcard-chip { margin: 0; padding: 8px 0; background: transparent; color: var(--text-muted); font-size: .78rem; line-height: 1.5; }
#deck-artwork-panel .spellcard-lock-note { font-size: .73rem; color: var(--bad); }
#deck-artwork-panel .spellcard-cast-btn { min-height: 44px; background: var(--accent); color: #fff; font-size: .8rem; margin-top: 12px; }
#deck-artwork-panel .spellcard-cast-btn:disabled { background: var(--panel-sunken); color: var(--text-faint); }
#deck-artwork-panel .spellcard-status { color: var(--text-muted); font-size: .73rem; }
@media (max-width: 900px) {
  #deck-artwork-panel { width: min(340px,100%); top: 64px; max-height: calc(100% - 76px); padding: 16px; }
}
#deck-detail-view.shared-view #deck-wallpaper-chrome { display: none; }
#deck-detail-view .deck-views { background: var(--panel); overflow: visible; width: 100%; margin-inline: 0; }
#deck-detail-view .panelstage { overflow: visible; }
#deck-detail-view .deck-view-panel { animation: none; }
#deck-analysis-toggle[hidden] { display: none; }
#deck-detail-view .views { flex-wrap: wrap; overflow: visible; }
#deck-detail-view .views button { min-height: 48px; white-space: normal; }
.deck-view-description { margin: 0 0 20px; color: var(--text-muted); font-size: .86rem; line-height: 1.6; }
.deck-type-disclosure { margin: 14px 0; }
.deck-type-disclosure > summary { color: var(--text-muted); font-size: .76rem; cursor: pointer; padding: 6px 0; }
.color-balance-row[data-mana-color="W"] .color-balance-fill { box-shadow: inset 0 0 0 1px var(--text-muted); }
#deck-detail-view .indeck-toolbar { gap: 12px; align-items: end; flex-wrap: wrap; }
#deck-detail-view .indeck-toolbar h2 { width: 100%; margin-bottom: 0; font-size: 1.1rem; }
.workspace-control { display: flex; flex-direction: column; gap: 5px; font-size: .72rem; color: var(--text-muted); }
.workspace-control select { min-height: 36px; max-width: 100%; padding: 6px 28px 6px 10px; color: var(--text); border: 1px solid var(--border); border-radius: 6px; background: var(--panel-sunken); font: inherit; font-size: .8rem; }
.workspace-extra { display: flex; flex-wrap: wrap; gap: 12px; font-size: .8rem; }
#deck-filter-pop { width: min(360px,calc(100vw - 48px)); max-height: 70dvh; overflow: auto; z-index: 10; }
.deck-workspace { display: grid; gap: 24px; align-items: start; }
.deck-workspace-text,.deck-workspace-condensed { grid-template-columns: repeat(auto-fit,minmax(min(100%,420px),1fr)); }
.deck-workspace-group { min-width: 0; }
.deck-group-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 8px; padding-bottom: 10px; border-bottom: 1px solid var(--border); font-size: .86rem; }
.deck-group-head small { color: var(--text-muted); font-size: .75rem; font-weight: 400; margin-left: 6px; }
.deck-group-value { color: var(--text-muted); font-size: .7rem; font-weight: 400; }
.deck-workspace .deck-dense-row { padding: 8px 0; column-gap: 8px; grid-template-areas: 'key name meta remove' 'key name pull remove' 'reason reason reason reason'; }
.deck-workspace .dd-name { white-space: normal; cursor: pointer; font-size: .79rem; }
.deck-workspace .dd-meta { gap: 7px; }
.deck-workspace .dd-why-wrap { grid-area: reason; padding: 2px 10px 6px; }
.deck-workspace .dd-mv { display: inline-flex; gap: 2px; }
.deck-workspace .workspace-mana { display: inline-flex; gap: 3px; margin-bottom: 8px; }
.deck-workspace-condensed .dd-why-wrap { display: none; }
.deck-workspace-condensed .deck-dense-row { padding-block: 5px; }
.deck-workspace-grid,.deck-workspace-spoiler { grid-template-columns: 1fr; }
.deck-workspace-grid .deck-group-cards,.deck-workspace-spoiler .deck-group-cards { display: grid; grid-template-columns: repeat(auto-fill,minmax(170px,1fr)); gap: 14px; }
.deck-workspace .deck-tile2 { width: 100%; min-width: 0; }
.deck-workspace .deck-tile2 > img { width: 100%; }
.deck-workspace-stacks,.deck-workspace-split { grid-template-columns: repeat(auto-fit,minmax(min(100%,230px),1fr)); }
.deck-workspace-split .deck-group-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.workspace-card-disclosure > summary { list-style: none; cursor: pointer; position: relative; }
.workspace-card-disclosure > summary::-webkit-details-marker { display: none; }
.workspace-card-disclosure > summary > img { display: block; width: 100%; height: auto; border-radius: 8px; }
.workspace-card-disclosure > summary > span { display: block; padding: 8px 10px; background: var(--panel-raised); color: var(--text); font-size: .76rem; line-height: 1.35; }
.deck-workspace-stacks .workspace-card-disclosure:not([open]) > summary > img,.deck-workspace-split .workspace-card-disclosure:not([open]) > summary > img { height: 58px; object-fit: cover; object-position: top; }
.deck-workspace-stacks .deck-tile2,.deck-workspace-split .deck-tile2 { margin-bottom: 4px; }
.workspace-set { font: .68rem 'IBM Plex Mono',monospace; color: var(--text-muted); }
.deck-workspace .workspace-set { display: block; }
.deck-workspace.hide-set .workspace-set,.deck-workspace.hide-price .dd-price,.deck-workspace.hide-price .deck-tile2-price,.deck-workspace.hide-price .deck-group-value,.deck-workspace.hide-mana .dd-mv,.deck-workspace.hide-mana .workspace-mana { display: none; }
.deck-workspace [role=button]:focus-visible,.workspace-card-disclosure > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 3px; }
#deck-analysis-overlay { margin-top: 18px; border: 0; background: transparent; overflow: visible; }
#deck-analysis-overlay #deck-analysis-scroll { padding: 0; }
.insight-section { border: 1px solid var(--border); border-radius: 10px; background: var(--panel-raised); margin-bottom: 12px; }
.insight-section > summary { padding: 16px; font-weight: 600; font-size: .9rem; cursor: pointer; }
.insight-section .analysis-feature { padding: 0 16px 16px; }
#deck-detail-view.shared-view .deck-settings,#deck-detail-view.shared-view #deck-art-toggle { display: none; }
@media (max-width:640px) {
  #deck-hero-scene { margin-top: -14px; }
  .deck-hero-tools { inset: 12px 0 auto; }
  #deck-hero-details { bottom: 16px; }
  #deck-workspace-surface { padding: 14px; margin-inline: -14px; }
  #deck-detail-view #deck-hero-details .deck-head { padding: 14px; margin: 0; }
  #deck-detail-view .deck-head { padding: 16px; min-height: 150px; }
  #deck-detail-view .deck-head-thumb { width: 48px; height: 66px; }
  #deck-detail-view .deck-head-title { flex: 1 1 180px; }
  #deck-detail-view .views button { flex: 1 1 0; padding: 10px 6px; font-size: .76rem; gap: 4px; }
  #deck-detail-view .views { padding-inline: 8px; }
  #deck-detail-view .deck-count-reconcile { font-size: .72rem; padding: 8px 14px; }
  #deck-detail-view .deck-view-description { font-size: .76rem; margin-bottom: 12px; }
  #deck-detail-view .deck-head-sub { font-size: .75rem; }
  #deck-detail-view .deck-head-main { gap: 8px; }
  #deck-detail-view .indeck-toolbar { position: static; padding: 0; background: transparent; }
  #deck-detail-view .indeck-wrap { padding: 0; }
  #deck-detail-view .indeck-toolbar { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  #deck-detail-view .indeck-toolbar h2,#deck-card-list-count { grid-column: 1/-1; }
  .indeck-tb-spacer { display: none; }
  .workspace-control select { width: 100%; }
  .deck-workspace .deck-dense-row { grid-template-areas: 'key name name remove' 'key meta meta remove' 'key pull pull remove' 'reason reason reason reason'; }
  .deck-workspace .dd-meta { justify-content: flex-start; flex-wrap: wrap; }
  .deck-workspace-grid .deck-group-cards,.deck-workspace-spoiler .deck-group-cards { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .deck-workspace-split { grid-template-columns: 1fr; }
  #deck-wallpaper-chrome .wp-card-group { max-width: 100%; }
  #deck-settings .deck-section { width: 100%; margin-left: 0; margin-right: 0; border-radius: 8px; }
  #deck-detail-view .deck-view-panel > .deck-section { width: 100%; margin-left: 0; margin-right: 0; border-radius: 8px; }
  #deck-filter-pop { position: fixed; inset: 76px 12px auto; width: auto; max-height: calc(100dvh - 166px); }
}
#deck-hero-details .manapanel { position: static; flex-basis: 100%; width: min(100%,400px); margin-top: 8px; }
@media (prefers-reduced-motion: reduce) { #deck-hero-details { transition: none; transform: none; } }
@media print { #deck-analysis-stage,#deck-hero-scene { display: none !important; } }
@media print {
  body > #decks-view { display: block !important; }
  #decks-view > :not(#deck-detail-view) { display: none !important; }
}