/* The deck library and builder are scoped separately from both game tables. */
#decks-section .deck-intro-actions { display: flex; gap: 8px; align-items: center; flex-shrink: 0; }
#decks-section .deck-intro-actions .button, #decks-section .deck-intro-actions .primary { margin: 0; white-space: nowrap; }
#app #decks-section .deck-intro { padding: 8px 0 16px; }
#decks-section .format-help { margin-bottom: 14px; background: #15251e; }
#decks-section .format-help>summary { padding: 11px 14px; font-size: 11px; }
#app #decks-section .deck-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 0; }
#app #decks-section .deck-tile { display: grid; grid-template-columns: minmax(115px,.8fr) minmax(0,1fr); background: radial-gradient(ellipse at 0 0,#36554340,transparent 70%),linear-gradient(145deg,#1c3025,#13231c); transition: border-color .2s,box-shadow .2s; }
#app #decks-section .deck-tile:hover { border-color: #9e8b526e; box-shadow: 0 8px 24px #0003; }
#app #decks-section .deck-banner { height: 238px; display: flex; flex-direction: column; gap: 8px; padding: 12px; background: linear-gradient(140deg,#36553b30,#0b191730); border-right: 1px solid #68856e20; }
#app #decks-section .deck-banner img { object-fit: contain; object-position: center; height: 182px; max-width: 100%; width: auto; border-radius: 6px; flex: 0 1 auto; filter: drop-shadow(0 5px 8px #0006); }
#decks-section .deck-banner .deck-format-tag { max-width: 100%; border: 0; padding: 0; font-size: 10px; text-align: center; background: transparent; color: #c4b888; line-height: 1.4; }
#app #decks-section .deck-tile-body { display: flex; flex-direction: column; align-items: stretch; justify-content: center; padding: 16px; min-width: 0; }
#app #decks-section .deck-tile-body>small { font-size: 9px; letter-spacing: 1px; color: #98ac91; }
#app #decks-section .deck-tile h2 { font-size: 20px; line-height: 1.35; margin: 9px 0 12px; overflow-wrap: anywhere; }
#app #decks-section .deck-tile-count { flex-direction: column; align-items: flex-start; gap: 6px; margin: 0 0 16px; }
#app #decks-section .deck-tile-count strong { font-size: 16px; }
#decks-section .deck-tile-count>span { font-size: 10px; line-height: 1.5; }
#decks-section .deck-tile-body .button { padding: 10px 8px; font-size: 11px; }

/* Name, format and save actions remain readable without crowding out cards. */
#deck-editor .deck-setup { display: contents; }
#deck-editor .deck-setup>summary { display: none; }
#app #deck-editor .deck-toolbar { gap: 8px; margin: 0 0 14px; padding: 9px 0; }
#deck-editor .deck-toolbar .button, #deck-editor .deck-toolbar .primary, #deck-editor .deck-toolbar select { min-height: 38px; padding-top: 8px; padding-bottom: 8px; font-size: 11px; }
#deck-editor .deck-toolbar>select { max-width: 158px; }
#app #deck-editor .deck-toolbar #deck-save-status { font-size: 10px; line-height: 1.4; }
#app #deck-editor .deck-fields { grid-template-columns: minmax(180px,1.5fr) minmax(155px,1fr) minmax(165px,1fr); gap: 12px; margin-bottom: 7px; }
#deck-editor .deck-fields label { font-size: 11px; color: #afbea8; gap: 6px; }
#app #deck-editor .deck-fields input, #app #deck-editor .deck-fields select { height: 43px; padding: 10px 12px; font-size: 12px; }
#app #deck-editor .deck-fields select, #deck-editor .deck-toolbar select { padding-right: 34px; text-overflow: ellipsis; overflow: hidden; }
#app #deck-editor .deck-fields #deck-name { font-size: 18px; }
#deck-editor .deck-planned-option, #deck-editor .deck-missing-filter { font-size: 11px; gap: 8px; padding: 9px 0; color: #aebbab; }
#deck-editor #commander-label { max-width: none; margin: 6px 0 14px; font-size: 11px; }
#deck-editor #commander-label select { margin-top: 5px; }
#app #deck-editor .deck-analysis { grid-template-columns: 108px 216px minmax(0,1fr); padding: 12px 15px; gap: 18px; margin-bottom: 0; border-color: #6476554a; background: radial-gradient(ellipse at 0 0,#50603b18,transparent 75%),#16271e; border-radius: 10px 10px 0 0; }
#app #deck-editor .deck-total>strong { font-size: 31px; }
#deck-editor .deck-total>small { font-size: 9px; line-height: 1.6; margin-top: 8px; }
#deck-editor .curve-label { font-size: 8px; letter-spacing: .7px; }
#deck-editor .curve-plot { margin-top: 9px; gap: 7px; }
#deck-editor .curve-col { gap: 4px; }
#deck-editor .curve-col>svg { width: 15px; height: 48px; }
#app #deck-editor #deck-validation { max-height: 122px; font-size: 11px; line-height: 1.55; }
#deck-editor #deck-validation ul { margin: 8px 0 0; }
#deck-editor .deck-value { margin: 0 0 12px; padding: 9px 15px; gap: 5px 20px; border-top: 0; border-color: #6476554a; background: #11221a; border-radius: 0 0 10px 10px; font-size: 11px; }
#deck-editor .deck-value small { color: #8f9f89; font-size: 9px; line-height: 1.5; }
#deck-editor .deck-statistics-toggle, #deck-editor .deck-notes { margin: 0 0 12px; background: #14241c; border: 1px solid #62735140; border-radius: 8px; }
#deck-editor .deck-statistics-toggle:not([open]), #deck-editor .deck-notes:not([open]) { display: inline-block; width: calc(50% - 5px); vertical-align: top; }
#deck-editor .deck-statistics-toggle:not([open]) { margin-right: 10px; }
#deck-editor .deck-statistics-toggle:not([open])>summary>span { display: none; }
#deck-editor .deck-compact-status { display: none; }
#deck-editor .deck-statistics-toggle>summary, #deck-editor .deck-notes>summary { padding: 11px 13px; font-size: 11px; color: #d9d3b6; }
#deck-editor .deck-statistics-toggle>summary>span { color: #91a48c; font-size: 10px; }
#deck-editor .deck-notes { padding: 0; }
#deck-editor .deck-notes>p, #deck-editor .deck-notes>textarea { margin: 0 12px 12px; width: calc(100% - 24px); }
#deck-editor .deck-notes>label { margin: 0 12px 12px; }
#app #deck-editor .deck-workspace { gap: 16px; grid-template-columns: 1.08fr 1fr; }
#app #deck-editor .deck-composition, #app #deck-editor .deck-pool { padding: 15px; border-color: #637a5740; background: radial-gradient(ellipse at 10% 0,#42634318,transparent 65%),#15261e; }
#app #deck-editor .deck-pool { top: 70px; }
#app #deck-editor .deck-pane-title { margin-bottom: 10px; }
#app #deck-editor .deck-pane-title h2 { font-size: 19px; }
#deck-editor .deck-pane-title span { font-size: 10px; }
#app #deck-editor .zone-title { font-size: 10px; letter-spacing: 1.3px; padding-bottom: 9px; margin: 18px 0 10px; }
#app #deck-editor .deck-card-row { gap: 11px; padding: 9px 0; }
#app #deck-editor .deck-thumb { width: 78px; min-width: 78px; }
#app #deck-editor .deck-row-title strong { font-size: 12px; line-height: 1.4; }
#app #deck-editor .deck-row-title small { font-size: 10px; margin-top: 4px; }
#deck-editor .deck-step { gap: 5px; }
#deck-editor .deck-step button { width: 29px; height: 31px; border-color: #6e805548; background: #2d402b; }
#deck-editor .deck-step button:disabled { opacity: .4; }
#app #deck-editor .deck-transfer { display: inline-flex; align-items: center; max-width: 100%; margin-top: 7px; padding: 5px 8px; min-height: 28px; border: 1px solid #a89b5c66; border-radius: 5px; background: #38472b66; color: #dfcf9e; font-size: 10px; line-height: 1.4; text-align: left; cursor: pointer; }
#app #deck-editor .deck-transfer:hover { background: #4b5b3477; border-color: #c9b77b; color: #f2dfae; }
#app #deck-editor .deck-transfer:focus-visible { outline: 2px solid #d3be83; outline-offset: 2px; }
#deck-editor .deck-missing-filter { margin: 2px 0 5px; padding: 7px 9px; border-radius: 6px; background: #9e865d0c; }
#deck-editor .deck-missing-filter:has(input:checked) { color: #e2cb92; background: #a88e4920; }
#app #deck-editor #deck-pool-cards { gap: 12px 9px; max-height: 650px; }
#app #deck-editor .pool-card { background: #102219; border-color: #73865d30; }
#app #deck-editor .pool-card .pool-add { min-width: 32px; min-height: 35px; }
#deck-editor #pool-hint { font-size: 10px; line-height: 1.5; margin: 9px 0; }
#deck-editor .rules-note { padding: 11px 13px; margin: 14px 0; border-color: #62735140; }
#deck-editor .deck-sharing-state { border: 1px solid #62735140; border-radius: 9px; background: #14241c; padding: 13px; gap: 8px; font-size: 11px; margin: 12px 0; }
#deck-editor .deck-sharing-state p { line-height: 1.6; }
#deck-editor .deck-sharing-state .button, #deck-editor .deck-sharing-state input { font-size: 11px; min-height: 36px; }
#deck-editor #deck-delete { font-size: 11px; padding: 8px 0; max-width: none; }

/* The illustrated dossier keeps its hierarchy when expanded. */
#deck-editor #deck-statistics.illustrated-stats { padding: 14px; }
#deck-editor .illustrated-stats .deck-stats-heading { display: none!important; }
#deck-editor .deck-visual-overview { grid-template-columns: 1fr 1.6fr; gap: 10px; }
#deck-editor .deck-land-ring { padding: 8px; gap: 12px; }
#deck-editor .deck-ring-chart { width: 84px; height: 84px; }
#deck-editor .illustrated-stats .deck-metrics article { padding: 12px 6px; }
#deck-editor .illustrated-stats .deck-metrics strong { margin-bottom: 6px; }
#deck-editor .illustrated-stats .deck-stats-panels { margin-top: 16px; gap: 16px; }
#deck-editor .deck-type-tile { padding: 10px 7px 12px; }
#deck-editor .deck-profile-row { gap: 16px; margin-top: 14px; padding-top: 13px; }

/* Public decks share the collection's quiet frame and prominent card art. */
.public-deck-page .shared-main { max-width: 1380px; }
.public-deck-page .shared-brand { padding-bottom: 18px; }
.public-deck-page .shared-intro { padding: 23px 0 18px; }
.public-deck-page .shared-intro h1 { font-size: clamp(26px,3vw,38px); margin: 9px 0 10px; }
.public-deck-page .shared-counts { font-size: 13px; color: #e0decf; line-height: 1.5; }
.public-deck-page .public-deck-value { font-size: 11px!important; margin: 6px 0 0; color: #97a88e!important; line-height: 1.5; }
.public-deck-page .public-deck-search { display: flex; align-items: center; gap: 12px; max-width: 530px; color: #aabd9f; font-size: 11px; }
.public-deck-page .public-deck-search input { flex: 1; min-width: 0; margin: 0; height: 42px; }
.public-deck-page .public-deck-zone { margin-top: 25px; }
.public-deck-page .public-deck-zone h2 { display: flex; align-items: center; gap: 16px; font-size: 18px; margin-bottom: 16px; color: #ddd1ae; }
.public-deck-page .public-deck-zone h2::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg,#8f805544,transparent); }
.public-deck-page .public-deck-zone .cards { gap: 18px; }
.public-deck-page .public-deck-zone .card>strong { font-size: 12px; line-height: 1.5; padding: 8px 5px 3px; }
.public-deck-page .public-deck-zone .card>small { padding: 4px 5px 7px; font-size: 10px; }
.public-deck-page .public-deck-card { border-radius: 8px; overflow: hidden; }
.public-deck-page .public-deck-card img { object-fit: contain; border-radius: 8px; }
.public-deck-page #public-deck-dialog { border: 1px solid #a28e5b66; background: radial-gradient(ellipse at 0 0,#36523a33,transparent 75%),#14231e; border-radius: 16px; padding: 24px; }
.public-deck-page #public-deck-dialog .card-detail { gap: 26px; }
.public-deck-page #public-deck-dialog h2 { font-size: 24px; line-height: 1.4; margin: 12px 0; }
.public-deck-page #public-deck-dialog #public-deck-image { width: 100%; max-height: 72vh; object-fit: contain; border-radius: 12px; }
.public-deck-page #public-deck-dialog .public-deck-oracle { font-size: 13px; color: #c1cdbb; line-height: 1.8; }

@media(min-width:1360px) { #app #decks-section .deck-list { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media(max-width:1150px) {
  #app #deck-editor .deck-fields { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  #deck-editor .deck-fields>label:first-child { grid-column: 1/-1; }
  #app #deck-editor .deck-analysis { grid-template-columns: 90px 200px minmax(0,1fr); gap: 14px; }
  #app #deck-editor #deck-validation { grid-column: auto; }
  #app #decks-section .deck-banner { height: 220px; padding: 10px; }
  #app #decks-section .deck-banner img { height: 167px; }
  #app #decks-section .deck-tile-body { padding: 12px; }
  #app #decks-section .deck-tile h2 { font-size: 18px; }
  #decks-section .deck-intro-actions { flex-direction: column-reverse; align-items: stretch; }
  #app #deck-editor .deck-workspace { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; }
  #app #deck-editor .deck-step { flex-direction: column-reverse; }
  #app #deck-editor .deck-composition, #app #deck-editor .deck-pool { padding: 12px; }
  #app #deck-editor .deck-thumb { width: 65px; min-width: 65px; }
}
@media(max-width:850px) {
  #app #deck-editor .deck-workspace { grid-template-columns: minmax(0,1fr); }
  #app #deck-editor .deck-pool { position: static; order: 0; }
  #app #deck-editor .deck-step { flex-direction: row; }
  #app #deck-editor .deck-thumb { width: 78px; min-width: 78px; }
  #app #deck-editor #deck-entries { max-height: 470px; overflow: auto; scrollbar-width: thin; padding-right: 5px; }
  #app #deck-editor #deck-pool-cards { grid-template-columns: repeat(3,minmax(0,1fr)); max-height: 540px; }
  #app #deck-editor .deck-analysis { grid-template-columns: 85px minmax(0,1fr); }
  #app #deck-editor #deck-validation { grid-column: 1/-1; max-height: 110px; border-top: 1px solid #72845922; padding-top: 9px; }
  #deck-editor .curve-col>svg { height: 42px; }
  #deck-editor .curve-plot { max-width: 270px; }
}
@media(max-width:600px) {
  #deck-editor .deck-setup { display: block; margin: 0 0 11px; border: 1px solid #62735140; border-radius: 8px; background: #14241c; }
  #deck-editor .deck-setup>summary { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 12px; cursor: pointer; padding: 12px; font-size: 10px; color: #abbba2; list-style: none; }
  #deck-editor .deck-setup>summary::-webkit-details-marker { display: none; }
  #deck-editor .deck-setup>summary::after { content: '+'; color: #d5be82; font-size: 17px; line-height: 1; }
  #deck-editor .deck-setup[open]>summary::after { content: '−'; }
  #deck-editor .deck-setup>summary strong { font-size: 11px; font-weight: 500; color: #e0dbc9; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #deck-editor .deck-setup[open]>summary { border-bottom: 1px solid #62735130; margin-bottom: 12px; }
  #app #deck-editor .deck-setup .deck-fields { margin-left: 12px; margin-right: 12px; }
  #deck-editor .deck-setup .deck-planned-option, #deck-editor .deck-setup #commander-label { margin-left: 12px; margin-right: 12px; }
  #app #decks-section .deck-intro { flex-wrap: wrap; gap: 12px; padding-top: 3px; }
  #decks-section .deck-intro-actions { flex-direction: row; width: 100%; }
  #decks-section .deck-intro-actions>* { flex: 1; }
  #app #decks-section .deck-list { grid-template-columns: minmax(0,1fr); gap: 12px; }
  #app #decks-section .deck-tile { grid-template-columns: minmax(110px,.8fr) minmax(0,1fr); }
  #app #decks-section .deck-banner { height: 224px; }
  #app #decks-section .deck-banner img { height: 169px; }
  #decks-section .deck-banner .deck-format-tag { font-size: 9px; }
  #app #decks-section .deck-tile h2 { font-size: 20px; }
  #app #deck-editor .deck-toolbar { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 7px; padding: 7px 0; }
  #deck-editor #deck-back { grid-column: 1/4; grid-row: 1; margin: 0; }
  #deck-editor #deck-save { grid-column: 4/7; grid-row: 1; }
  #deck-editor #deck-export-format { grid-column: 1/3; grid-row: 2; max-width: none; width: 100%; }
  #deck-editor #deck-export { grid-column: 3/5; grid-row: 2; }
  #deck-editor #deck-duplicate { grid-column: 5/7; grid-row: 2; }
  #app #deck-editor .deck-toolbar #deck-save-status { grid-column: 1/-1; grid-row: 3; width: auto; font-size: 9px; margin: 0; }
  #deck-editor .deck-toolbar .button, #deck-editor .deck-toolbar .primary, #deck-editor .deck-toolbar select { min-height: 36px; font-size: 10px; padding: 8px 6px; }
  #deck-editor .deck-toolbar select { padding-right: 29px; }
  #app #deck-editor .deck-fields { gap: 9px; margin-bottom: 4px; }
  #app #deck-editor .deck-fields label { font-size: 10px; }
  #app #deck-editor .deck-fields input, #app #deck-editor .deck-fields select { padding: 9px 10px; height: 39px; font-size: 11px; }
  #app #deck-editor .deck-fields select { padding-right: 30px; }
  #app #deck-editor .deck-fields #deck-name { font-size: 17px; }
  #deck-editor .deck-planned-option { font-size: 10px; padding: 8px 0 11px; align-items: center; }
  #app #deck-editor .deck-analysis { padding: 12px; gap: 10px; }
  #app #deck-editor #deck-validation:has(.valid)>p { display: none; }
  #deck-editor .deck-value { padding: 9px 12px; font-size: 10px; gap: 4px 12px; }
  #deck-editor .deck-value>span { flex-basis: auto; }
  #deck-editor .deck-value small { font-size: 9px; }
  #deck-editor .deck-statistics-toggle>summary>span { display: none; }
  #deck-editor .deck-statistics-toggle:not([open]), #deck-editor .deck-notes:not([open]) { width: 100%; margin-right: 0; }
  #deck-editor .deck-statistics-toggle>summary { display: flex; align-items: center; gap: 8px; }
  #deck-editor .deck-statistics-toggle>summary::before { content: '▸'; color: #d5be82; }
  #deck-editor .deck-statistics-toggle[open]>summary::before { content: '▾'; }
  #deck-editor .deck-statistics-toggle>summary { list-style: none; }
  #deck-editor .deck-statistics-toggle>summary::-webkit-details-marker { display: none; }
  #deck-editor .deck-statistics-toggle>summary>span.deck-compact-status { display: inline; font-size: 10px; margin: 0 0 0 auto; color: #b8c89e; }
  #deck-editor .deck-statistics-toggle>summary>span.deck-compact-status.needs-work { color: #e0b373; }
  #deck-editor .deck-statistics-toggle .deck-analysis { border: 0; border-radius: 0; background: #16271e; }
  #deck-editor .deck-statistics-toggle .deck-value { border-left: 0; border-right: 0; border-radius: 0; margin-bottom: 0; }
  #app #deck-editor .deck-pane-title h2 { font-size: 19px; }
  #app #deck-editor .deck-pane-title span { font-size: 9px; }
  #app #deck-editor .deck-row-title strong { font-size: 11px; }
  #app #deck-editor .deck-row-title small { font-size: 9px; }
  #app #deck-editor .deck-step { flex-direction: column-reverse; gap: 4px; }
  #app #deck-editor .deck-thumb { width: 74px; min-width: 74px; }
  #app #deck-editor #deck-pool-cards { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px 8px; max-height: 570px; }
  #deck-editor .pool-filters select { font-size: 10px; }
  #deck-editor .deck-sharing-state input { flex-basis: calc(100% - 100px); }
  #deck-editor .deck-sharing-state .button { padding: 9px; }
  #deck-editor #deck-statistics.illustrated-stats { padding: 11px; }
  #deck-editor .deck-visual-overview { grid-template-columns: 1fr 1.5fr; gap: 8px; }
  #deck-editor .deck-land-ring { flex-direction: column; gap: 2px; padding: 8px; }
  #deck-editor .deck-land-ring .stat-overline { display: none; }
  #deck-editor .deck-land-ring>div:last-child { text-align: center; }
  #deck-editor .deck-ring-chart { width: 74px; height: 74px; }
  #deck-editor .illustrated-stats .deck-metrics article { padding: 10px 4px; }
  #deck-editor .illustrated-stats .deck-metrics article>span { font-size: 9px; }
  #deck-editor .illustrated-stats .deck-metrics strong { font-size: 23px; }
  #deck-editor .illustrated-stats .deck-stats-panels { gap: 14px; }
  #deck-editor .deck-type-tile { padding: 9px 3px 11px; }
  #deck-editor .deck-type-tile span:not(.stat-type-icon) { font-size: 8px; }
  #deck-editor .deck-color-orb>span:not(.stat-mana-icon), #deck-editor .deck-color-orb small { font-size: 8px; }
  .public-deck-page .shared-brand { padding-bottom: 15px; gap: 8px; }
  .public-deck-page .shared-intro { padding: 22px 0 16px; }
  .public-deck-page .shared-intro h1 { font-size: 27px; }
  .public-deck-page .shared-counts { font-size: 12px; }
  .public-deck-page .shared-readonly { font-size: 7px; letter-spacing: .7px; }
  .public-deck-page .public-deck-search { gap: 9px; font-size: 10px; }
  .public-deck-page .public-deck-search input { height: 40px; font-size: 12px; }
  .public-deck-page .public-deck-zone { margin-top: 22px; }
  .public-deck-page .public-deck-zone h2 { font-size: 16px; gap: 10px; }
  .public-deck-page .public-deck-zone .cards { gap: 15px 10px; }
  .public-deck-page .public-deck-zone .card>strong { font-size: 11px; }
  .public-deck-page #public-deck-dialog { padding: 18px; }
  .public-deck-page #public-deck-dialog .card-detail { gap: 18px; }
  .public-deck-page #public-deck-dialog h2 { font-size: 21px; }
  .public-deck-page #public-deck-dialog #public-deck-image { max-height: 58vh; }
}
@media(prefers-reduced-motion:reduce) { #app #decks-section .deck-tile { transition: none; } }

/* Compact card-pool filters stay separate from the target deck zone. */
#deck-editor #pool-mechanics{margin-top:9px}
#app #deck-editor .pool-filter-tools{display:flex;align-items:flex-start;gap:10px;margin:8px 0 4px;min-width:0}
#app #deck-editor #pool-extra-filters{flex:1;min-width:0}
#app #deck-editor #pool-extra-filters>summary{cursor:pointer;color:#b9c8b6;font:500 11px/1.5 Manrope,system-ui,sans-serif;padding:5px 0}
#app #deck-editor .pool-extra-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:10px 0 5px}
#app #deck-editor .pool-extra-grid label{display:grid;gap:5px;font:500 10px/1.4 Manrope,system-ui,sans-serif;color:#b4c1af;min-width:0}
#app #deck-editor .pool-extra-grid :is(input,select){width:100%;min-width:0;min-height:36px;padding:7px 9px;font-size:11px}
#app #deck-editor .pool-clear{flex:none;padding:5px 0;border:0;background:transparent;color:#d6c28c;font:500 11px/1.5 Manrope,system-ui,sans-serif}
#app #deck-editor .pool-clear:hover{color:#f0dca6;text-decoration:underline}
#app #deck-editor .pool-clear[hidden]{display:none}
.collection-mechanics{margin-top:10px}