@media(max-width:650px) {
/* DUEL ARCHIVE UI SYSTEM
   4px rhythm; one surface per content item; priority uses a badge + leading rule.
   Loaded after legacy layout files. Layout geometry remains in mobile-layout.css.
*/
:root {
 --ui-canvas:#0e131b; --ui-surface:#171e29; --ui-raised:#202a38;
 --ui-line:#2c3747; --ui-text:#e9edf5; --ui-muted:#a8b4c6;
 --ui-accent:#aac1ee; --ui-red:#e48d98; --ui-yellow:#d9be72; --ui-green:#78c7a1;
 --ui-radius:10px; --ui-control-radius:7px;
 --ui-s1:4px; --ui-s2:8px; --ui-s3:12px; --ui-s4:16px; --ui-s5:24px; --ui-s6:32px;
}
body { background:var(--ui-canvas); color:var(--ui-text); }
.topbar { background:var(--ui-canvas); border-bottom:1px solid var(--ui-line); }
.heading h1 { font-size:28px; line-height:1.25; letter-spacing:-.02em; }
.heading p,.hy-sub,.form-hint,.muted,.hy-trap > small { color:var(--ui-muted); }
:where(button,.download-link,.file-label) { border-radius:var(--ui-control-radius); box-shadow:none; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role=button]:focus-visible,summary:focus-visible { outline:2px solid var(--ui-accent); outline-offset:3px; }
:where(.help-heading-actions,.dialog-footer,.tool-actions) > button,
.heading > button[data-site-help],.dialog-head > button[data-site-help],
.hy-heading > .hy-theme-trigger,.hy-heading > .hy-theme-trigger.is-first-choice {
 background:var(--ui-raised); border:1px solid transparent; color:var(--ui-text); border-radius:var(--ui-control-radius); box-shadow:none;
}
button.primary,#addRecord { background:var(--ui-accent); color:#172337; border-color:transparent; }
button.danger { background:transparent; border-color:transparent; color:var(--ui-red); }
input:not([type=checkbox]):not([type=range]):not([type=file]),select,textarea { background:var(--ui-canvas); color:var(--ui-text); border:1px solid var(--ui-line); border-radius:var(--ui-control-radius); }
.search-wrap { background:var(--ui-canvas); border:1px solid var(--ui-line); border-radius:var(--ui-control-radius); }
.search-wrap input { border:0!important; background:transparent!important; }
.viewnav,.tabs { border:0; background:var(--ui-surface); border-radius:var(--ui-control-radius); padding:4px; }
.viewnav a,.tabs button { border:0; border-radius:5px; box-shadow:none; }
.viewnav a.active,.tabs button.active { background:#2a3c56; color:var(--ui-text); }
.hy-card { border:0; background:transparent; border-radius:var(--ui-radius); }
.hy-hero { border:0; border-radius:var(--ui-radius); }
.hy-hero .hy-hero-meta > .cm-meta-feedback,.hy-hero .hy-hero-meta > .hy-ygo-guide { background:#192332e6; border-color:#405068; color:#d7e2f2; border-radius:var(--ui-control-radius); }
.hy-list { border:0; background:transparent; }
.hy-list a { border:1px solid transparent; border-radius:var(--ui-control-radius); }
.hy-list a.active { background:#24364d; border-color:transparent; }
.hy-overview { padding-block:var(--ui-s5); }
.hy-overview h3 { font-size:15px; margin-bottom:12px; }
.hy-overview-grid { gap:8px; }
.hy-matchup { background:var(--ui-surface); border:0!important; border-radius:var(--ui-radius); }
.hy-matchup summary { padding:12px; }
.hy-matchup summary strong { font-size:13px; line-height:1.4; }
.hy-matchup summary b { font-size:12px; }
.hy-overview > small { color:var(--ui-muted); font-size:11px; line-height:1.5; }
.hy-rows { gap:var(--ui-s6); }
.hy-row,.hy-row:first-child { background:transparent; border:0; border-radius:0; padding:24px 0; }
.hy-row + .hy-row { border-top:1px solid var(--ui-line); }
.hy-trap::after,.hy-sevgroup.has-peer-rule::before,.hy-sevgroup.starts-group-line::after { display:none!important; }
.hy-trap-heading b { color:var(--ui-text); font-size:18px; line-height:1.3; }
.hy-trap > small { font-size:12px; line-height:1.5; }
.hy-secnote:not(:empty) { background:transparent!important; border:0!important; border-left:2px solid var(--ui-line)!important; padding:0 0 0 12px!important; color:var(--ui-muted); border-radius:0; font-size:12px; line-height:1.6; }
.hy-sevgroups { gap:24px; }
.hy-sevgroup > .hy-sevlabel { border:0; border-radius:4px; padding:4px 8px; font-size:11px; line-height:1.3; }
.hy-sevlabel.sev-r { background:#34242c; color:var(--ui-red); }
.hy-sevlabel.sev-y { background:#302d22; color:var(--ui-yellow); }
.hy-sevlabel.sev-g { background:#20332c; color:var(--ui-green); }
.hy-sevlabel.sev-n { background:var(--ui-raised); color:var(--ui-muted); }
.hy-ctiles .hy-ctile { --entry-priority:var(--ui-line); border:0!important; border-left:2px solid var(--entry-priority)!important; border-radius:0 8px 8px 0; background:var(--ui-surface)!important; box-shadow:none; }
.hy-ctiles .hy-ctile:has(.sev-r) { --entry-priority:var(--ui-red); }
.hy-ctiles .hy-ctile:has(.sev-y) { --entry-priority:var(--ui-yellow); }
.hy-ctiles .hy-ctile:has(.sev-g) { --entry-priority:var(--ui-green); }
.hy-ctiles .hy-ctile::before,.hy-ctiles .hy-ctile::after { content:none!important; }
.hy-ctiles .hy-card-set > .hy-tile { border:0!important; background:transparent!important; box-shadow:none!important; }
.hy-ctiles .hy-tile strong { font-weight:650; font-size:12px; line-height:1.45; }
.hy-tile.sev-r strong { color:var(--ui-red); }
.hy-tile.sev-y strong { color:var(--ui-yellow); }
.hy-tile.sev-g strong { color:var(--ui-green); }
.hy-ctile p,.hy-mobile-copy > p { color:#bdc7d7; line-height:1.6; }
.hy-ctile .hy-timing { color:var(--ui-text); }
.hy-ctile > .hy-mobile-footer,.hy-card-strip .hy-mobile-footer { background:transparent; border:0; padding-top:4px; padding-bottom:6px; }
.hy-mobile-footer .hy-sources summary { color:var(--ui-muted); }
.hy-srcline { background:var(--ui-canvas); border:0; border-radius:6px; padding:8px; }
.hy-sources[open] > summary { margin-bottom:6px; }
.cm-btn,.hy-card-set > .cm-tile,.hy-mobile-footer > .cm-tile { color:var(--ui-muted); background:transparent; border-color:transparent; box-shadow:none; border-radius:6px; }
.cm-btn:hover,.hy-mobile-footer > .cm-tile:hover { background:var(--ui-raised); color:var(--ui-text); }
.cm-deck { border:0; border-top:1px solid var(--ui-line); background:transparent; }
.cm-guide { color:var(--ui-muted); }
.hy-theme-drawer { background:var(--ui-surface); }
.hy-theme-drawer header button { border:0; background:transparent; }
.hy-screen-modes button { border-color:transparent; background:var(--ui-surface); color:var(--ui-muted); }
.hy-screen-modes button[aria-pressed=true] { border-color:transparent; background:#2a3c56; color:var(--ui-text); }
.toolbar { background:var(--ui-surface); border:0; border-radius:var(--ui-radius); padding:16px; }
.board-scroll { border:1px solid var(--ui-line); border-radius:var(--ui-radius); }
.dialog-head,.dialog-footer { border-color:var(--ui-line); background:var(--ui-surface); }
dialog.editor { background:var(--ui-surface); border:1px solid var(--ui-line); }
.dialog-head h2 { line-height:1.35; }
.dialog-body .row label { color:#cbd5e4; }
.rank-context,.form-hint { color:var(--ui-muted); font-size:12px; line-height:1.5; }
@media(min-width:651px) {
 .hy-ctiles .hy-ctile { padding:12px; box-sizing:border-box; }
 .hy-ctiles { align-items:start; gap:16px; }
}
@media(max-width:650px) {
 .heading h1 { font-size:24px; }
 .hy-heading { border:0; margin-bottom:16px; }
 .hy-heading > button { min-height:40px; }
 .hy-overview { padding:20px 0; }
 .hy-card { --hy-inset:0px; }
 .hy-rows { padding:0; gap:0; }
 .hy-row,.hy-row:first-child { padding:24px 0; gap:16px; }
 .hy-ctiles .hy-ctile,.hy-card-strip > .hy-ctile.hy-image-only { border-radius:0 8px 8px 0; }
 .hy-ctile > .hy-mobile-copy { gap:6px; }
 .hy-mobile-copy > .hy-timing::before { font-size:10px; color:#8e9caf; }
 .hy-card-strip { gap:10px; }
 .hy-ctiles .hy-card-set .hy-tile strong { font-size:11px; }
 .hy-trap:has(.hy-trap-icons) > .cm-sec { width:36px; height:36px; }
 .hy-mobile-footer > .cm-tile { min-height:30px; }
 .hy-screen-modes { padding-block:16px 24px; }
}

}
/* Larger type and artwork, tighter spacing for mobile reading. */
@media(max-width:650px) {
 .hy-row,.hy-row:first-child { padding:16px 0; gap:10px; }
 .hy-sevgroups { gap:16px; }
 .hy-sevgroup,.hy-sevgroup + .hy-sevgroup { gap:8px; }
 .hy-ctiles { gap:8px; }
 .hy-overview { padding:12px 0; }
 .hy-overview-grid { gap:8px; }
 .hy-matchup { border:1px solid var(--ui-line)!important; border-top-width:3px!important; }
 .hy-matchup.is-high { border-top-color:#f27575!important; }
 .hy-matchup.is-conditional { border-top-color:#dfba68!important; }
 .hy-matchup.is-low { border-top-color:#79a998!important; }
 .hy-matchup summary { padding:10px; }
 .hy-matchup summary strong { font-size:14px; }
 .hy-matchup summary b { font-size:13px; }
 .hy-ctiles > .hy-ctile:not(.hy-multiple):not(.hy-image-only):has(> .hy-card-set) { grid-template-columns:96px minmax(0,1fr); padding:8px 8px 0; gap:6px 8px; }
 .hy-ctile:not(.hy-multiple) > .hy-card-set { width:96px; }
 .hy-ctiles .hy-card-set > .hy-tile,
 .hy-ctiles .hy-card-set > .hy-tile:only-child { width:96px!important; max-width:100%; padding:2px!important; }
 .hy-ctiles .hy-card-set .hy-tile strong { font-size:13px; line-height:1.4; padding:4px 0 2px; }
 .hy-mobile-copy > p,.hy-ctile p { font-size:14px; line-height:1.5; }
 .hy-mobile-copy > .hy-timing,.hy-ctile .hy-timing { font-size:14px; line-height:1.4; }
 .hy-mobile-copy > .hy-timing::before { font-size:11px; }
 .hy-ctile.hy-multiple > .hy-card-set { grid-template-columns:repeat(auto-fit,96px); gap:8px; }
 .hy-ctiles > .hy-ctile.hy-multiple { padding:8px 8px 0; }
 .hy-ctile:has(> .hy-card-set) > .hy-mobile-footer { margin-left:-8px; margin-right:-8px; padding:2px 8px 4px; }
 .hy-card-strip > .hy-ctile.hy-image-only { padding:8px 6px 0; gap:4px; }
 .hy-card-strip .hy-card-set > .hy-tile,
 .hy-card-strip .hy-card-set > .hy-tile:only-child { width:104px!important; flex-basis:104px; }
 .hy-card-strip .hy-mobile-footer { margin:2px -6px 0!important; padding:2px 6px 4px!important; }
 .hy-secnote:not(:empty) { font-size:13px; line-height:1.5; }
 .hy-trap > small { font-size:13px; }
}

/* Moderate mobile density; leave the names room before secondary actions. */
@media(max-width:650px) {
 .hy-matchup:has(.cm-ov) summary > strong { padding-right:0; font-size:13px; white-space:nowrap; letter-spacing:-.02em; }
 .hy-matchup summary { padding:10px; }
 .hy-matchup summary > .cm-ov { top:auto; bottom:4px; right:5px; }
 .hy-matchup summary b { font-size:12px; }
 .hy-ctiles > .hy-ctile:not(.hy-multiple):not(.hy-image-only):has(> .hy-card-set) { grid-template-columns:80px minmax(0,1fr); }
 .hy-ctile:not(.hy-multiple) > .hy-card-set { width:80px; }
 .hy-ctiles .hy-card-set > .hy-tile,.hy-ctiles .hy-card-set > .hy-tile:only-child { width:80px!important; }
 .hy-card-strip .hy-card-set > .hy-tile,.hy-card-strip .hy-card-set > .hy-tile:only-child { width:90px!important; flex-basis:90px; }
 .hy-ctiles .hy-card-set .hy-tile strong { font-size:12px; padding:3px 0 0; }
 .hy-mobile-copy > p,.hy-ctile p,.hy-mobile-copy > .hy-timing,.hy-ctile .hy-timing { font-size:13px; line-height:1.45; }
 .hy-ctile.hy-multiple > .hy-card-set { grid-template-columns:repeat(auto-fit,80px); }
 .hy-row,.hy-row:first-child { padding:12px 0; gap:8px; }
 .hy-trap:has(.hy-trap-icons) > .hy-trap-heading > b { font-size:17px; }
 .hy-trap:has(.hy-trap-icons) > small { font-size:12px; }
 .hy-ctile > .hy-mobile-footer { min-height:28px; margin-top:0; padding-block:0; }
 .hy-mobile-footer > .cm-tile { min-height:28px; }
}

/* Equal artwork size; priority is carried by the label and a quiet surface tint. */
@media(max-width:650px) {
 .hy-ctiles > .hy-ctile:not(.hy-multiple):not(.hy-image-only):has(> .hy-card-set) { grid-template-columns:90px minmax(0,1fr); }
 .hy-ctile:not(.hy-multiple) > .hy-card-set { width:90px; }
 .hy-ctiles .hy-card-set > .hy-tile,.hy-ctiles .hy-card-set > .hy-tile:only-child { width:90px!important; max-width:100%; }
 .hy-ctile.hy-multiple > .hy-card-set { grid-template-columns:repeat(auto-fit,90px); }
 .hy-ctiles .hy-card-set .hy-tile-art { display:block; width:100%; aspect-ratio:59 / 86; }
 .hy-ctiles .hy-card-set .hy-tile-art > img:not(.hy-ban) { display:block; width:100%; height:100%; object-fit:contain; }
 .hy-ctiles .hy-ctile,.hy-card-strip > .hy-ctile.hy-image-only { border:0!important; border-radius:9px; background:#171e29!important; }
 .hy-ctiles .hy-ctile:has(.sev-r) { background:#211e29!important; }
 .hy-ctiles .hy-ctile:has(.sev-y) { background:#24241f!important; }
 .hy-ctiles .hy-ctile:has(.sev-g) { background:#1a2725!important; }
 .hy-ctiles .hy-ctile::before { content:none!important; }
}

/* Canonical mobile type hierarchy. Change these tokens together, not per layout. */
@media(max-width:650px) {
 :root { --hy-type-heading:17px; --hy-type-card:14px; --hy-type-timing:13px; --hy-type-body:12px; --hy-type-meta:11px; }
 .hy-trap:has(.hy-trap-icons) > .hy-trap-heading > b,
 .hy-trap-heading b { font-size:var(--hy-type-heading); font-weight:750; line-height:1.3; }
 .hy-ctiles .hy-card-set .hy-tile strong,
 .hy-card-strip .hy-card-set .hy-tile strong { font-size:var(--hy-type-card); font-weight:700; line-height:1.35; padding-top:5px; letter-spacing:0; }
 .hy-ctile .hy-timing,.hy-mobile-copy > .hy-timing { font-size:var(--hy-type-timing); font-weight:650; color:#e2e8f2; line-height:1.45; }
 .hy-ctile p,.hy-mobile-copy > p { font-size:var(--hy-type-body); font-weight:400; color:#b6c1d2; line-height:1.55; }
 .hy-secnote:not(:empty),.hy-trap:has(.hy-trap-icons) > small { font-size:var(--hy-type-body); font-weight:400; color:#a8b4c6; line-height:1.5; }
 .hy-ctile .hy-sources,.hy-ctile .cm-tile { font-size:var(--hy-type-meta); }
 .hy-card-strip .hy-mobile-footer > .cm-tile { font-size:0; }
 .hy-card-strip > .hy-ctile { height:100%; box-sizing:border-box; }
 .hy-card-strip .hy-mobile-footer { margin-top:auto!important; }
}

/* A single mobile grid, irrespective of whether an entry has explanatory copy. */
@media(max-width:650px) {
 .hy-row,.hy-row:first-child { gap:16px; padding-block:20px; }
 .hy-trap > small { color:#9eacc0!important; }
 .hy-secnote:not(:empty) { margin:4px 0 0!important; padding:12px 14px!important; border:0!important; border-radius:8px; background:#1c2634!important; font-size:12px; line-height:1.6; color:#c7d2e2; }
 .hy-secnote:not(:empty)::before { content:'덱별 참고'; display:block; margin-bottom:6px; color:#e1e8f2; font-size:12px; font-weight:700; }
 .hy-ctiles,.hy-ctiles:has(> .hy-image-only) { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:stretch; }
 .hy-ctiles > .hy-ctile,
 .hy-ctiles > .hy-ctile:not(.hy-multiple):not(.hy-image-only):has(> .hy-card-set),
 .hy-ctiles > .hy-ctile.hy-image-only { display:flex; flex-direction:column; grid-column:auto; width:auto!important; min-width:0; padding:12px 10px 0; gap:10px; box-sizing:border-box; }
 .hy-ctiles:has(> .hy-image-only) > .hy-ctile:not(.hy-image-only) { grid-column:auto; }
 .hy-ctiles > .hy-ctile.hy-multiple,
 .hy-ctiles > .hy-ctile:not(:has(> .hy-card-set)) { grid-column:1 / -1; }
 .hy-ctiles .hy-ctile > .hy-card-set { width:100%; display:flex; flex-direction:row; justify-content:center; gap:12px; margin:0; }
 .hy-ctiles .hy-card-set > .hy-tile,
 .hy-ctiles .hy-card-set > .hy-tile:only-child { width:100%!important; max-width:100%; padding:0!important; flex:1 1 0; min-width:0; }
 .hy-ctiles .hy-card-set .hy-tile-art { width:90px; max-width:100%; margin-inline:auto; }
 .hy-ctiles .hy-card-set .hy-tile strong { width:100%; box-sizing:border-box; font-size:13px; line-height:1.45; padding:7px 0 0; word-break:keep-all; overflow-wrap:anywhere; }
 .hy-ctile > .hy-mobile-copy { display:flex; flex-direction:column; flex:1; gap:8px; width:100%; }
 .hy-ctile > .hy-mobile-copy:has(> .hy-mobile-names:only-child) { display:none; }
 .hy-ctile > .hy-mobile-footer,
 .hy-ctile:has(> .hy-card-set) > .hy-mobile-footer,
 .hy-ctile:not(:has(> .hy-card-set)) > .hy-mobile-footer { margin:2px -10px 0!important; padding:6px 10px!important; min-height:36px; border-top:1px solid #ffffff0d; }
 .hy-ctile.hy-image-only > .hy-mobile-footer { margin-top:auto!important; }
}

/* Desktop uses the same ordered entry content and section hierarchy. */
@media(min-width:651px) {
 .hy-card { border:0; background:transparent; }
 .hy-row,.hy-row:first-child { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; padding:24px 0; border:0; }
 .hy-row + .hy-row { border-top:1px solid #303b4d; }
 .hy-trap { display:grid!important; grid-template-columns:minmax(0,1fr) 36px!important; gap:6px 12px; padding:0; }
 .hy-trap > .hy-trap-heading { display:flex!important; align-items:center; gap:12px; grid-column:1; }
 .hy-trap-heading b { font-size:19px; line-height:1.3; }
 .hy-trap .hy-trap-heading > .hy-trap-icons { position:static; height:auto; margin:0; transform:none; }
 .hy-trap > small,.hy-trap:has(.hy-trap-icons) > small { grid-column:1; padding-left:0; margin:0; font-size:12px; line-height:1.5; color:#a8b4c6; }
 .hy-trap > .cm-sec,.hy-trap:has(.hy-trap-icons) > .cm-sec { position:static; grid-column:2; grid-row:1 / span 2; margin:0; align-self:start; }
 .hy-trap::after,.hy-sevgroup.has-peer-rule::before,.hy-sevgroup.starts-group-line::after { display:none!important; }
 .hy-targets { min-width:0; }
 .hy-secnote:not(:empty) { padding:12px 14px!important; border:0!important; border-radius:8px; background:#1c2634!important; color:#c7d2e2; font-size:13px; line-height:1.6; }
 .hy-secnote:not(:empty)::before { content:'덱별 참고'; display:block; margin-bottom:6px; color:#e1e8f2; font-size:12px; font-weight:700; }
 .hy-sevgroups { display:flex; flex-direction:column; gap:20px; }
 .hy-sevgroup,.hy-sevgroup + .hy-sevgroup { display:flex; flex-direction:column; align-items:stretch; width:100%; padding:0; gap:10px; }
 .hy-sevgroup > .hy-sevlabel { align-self:flex-start; width:auto; border:0; border-radius:4px; padding:4px 8px; }
 .hy-ctiles { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; width:100%; align-items:stretch; }
 .hy-ctiles > .hy-ctile { display:flex; flex-direction:column; gap:12px; width:auto!important; min-width:0; box-sizing:border-box; padding:14px 14px 0; background:#171e29; border:0; border-radius:9px; overflow:hidden; }
 .hy-ctiles > .hy-ctile:has(.sev-r) { background:#211e29; }
 .hy-ctiles > .hy-ctile:has(.sev-y) { background:#24241f; }
 .hy-ctiles > .hy-ctile:has(.sev-g) { background:#1a2725; }
 .hy-ctiles > .hy-ctile.hy-multiple,.hy-ctiles > .hy-ctile:not(:has(> .hy-card-set)) { grid-column:1 / -1; }
 .hy-ctile > .hy-card-set { display:flex; justify-content:center; align-items:start; gap:16px; width:100%; }
 .hy-ctiles .hy-card-set > .hy-tile,.hy-ctiles .hy-card-set > .hy-tile:only-child { width:100%; max-width:220px; flex:1 1 0; min-width:0; background:transparent; border:0; padding:0; box-shadow:none; }
 .hy-ctiles .hy-tile-art { display:block; width:110px; max-width:100%; aspect-ratio:59 / 86; margin:auto; }
 .hy-ctiles .hy-tile-art > img:not(.hy-ban) { display:block; width:100%; height:100%; object-fit:contain; }
 .hy-ctiles .hy-tile strong { display:block; min-height:0!important; font-size:14px; line-height:1.4; font-weight:700; padding:8px 0 0; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; }
 .hy-mobile-copy { display:flex; flex-direction:column; gap:8px; flex:1; min-width:0; }
 .hy-mobile-copy > * { margin:0; }
 .hy-mobile-copy .hy-mobile-names { display:none; }
 .hy-mobile-copy:has(> .hy-mobile-names:only-child) { display:none; }
 .hy-mobile-copy > .hy-timing { font-size:13px; font-weight:650; line-height:1.5; color:#e2e8f2; }
 .hy-mobile-copy > .hy-timing::before { content:'타이밍'; display:block; font-size:11px; font-weight:400; color:#97a6bd; margin-bottom:3px; }
 .hy-mobile-copy > p { font-size:13px; line-height:1.6; color:#b6c1d2; }
 .hy-ctile > .cm-tile-actions:empty { display:none; }
 .hy-ctile > .hy-mobile-footer { display:flex; align-items:start; justify-content:space-between; gap:8px; margin:2px -14px 0; padding:8px 14px; border-top:1px solid #ffffff0d; }
 .hy-ctile.hy-image-only > .hy-mobile-footer { margin-top:auto; }
 .hy-mobile-footer > .hy-sources { flex:1; min-width:0; font-size:11px; padding:5px 0; margin:0; }
 .hy-mobile-footer > .cm-tile { position:static; width:auto; flex:none; min-height:30px; padding:4px 6px; margin-left:auto; font-size:11px; border:0; background:transparent; }
}
@media(min-width:1400px) {
 .hy-ctiles { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* Restriction badges are overlays, never full-size card artwork. */
.hy-ctiles .hy-tile-art > img.hy-ban { position:absolute; width:22px; height:22px; top:-4px; left:-4px; object-fit:contain; z-index:2; }
/* Desktop tiles keep a readable measure rather than stretching across the row. */
@media(min-width:651px) {
 .hy-ctiles { grid-template-columns:repeat(auto-fill,minmax(180px,220px)); justify-content:start; gap:14px; }
 .hy-ctiles > .hy-ctile.hy-multiple { grid-column:span 2; }
 .hy-ctiles > .hy-ctile:not(:has(> .hy-card-set)) { grid-column:span 2; max-width:454px; }
}

/* PC sections share one bounded grid; headers cannot push actions off-screen. */
@media(min-width:651px) {
 .hy-row,.hy-row:first-child { width:100%; max-width:922px; box-sizing:border-box; }
 .hy-targets,.hy-sevgroups,.hy-sevgroup,.hy-secnote:not(:empty) { width:100%; max-width:none; min-width:0; box-sizing:border-box; }
 .hy-ctiles { grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); }
 .hy-ctiles > .hy-ctile:not(:has(> .hy-card-set)) { grid-column:auto; max-width:none; align-self:start; }
 .hy-ctile:not(:has(> .hy-card-set)) > .hy-mobile-copy { flex:0 0 auto; }
 .hy-mobile-copy > .hy-chip { max-width:100%; white-space:normal; overflow-wrap:anywhere; box-sizing:border-box; }
 .hy-trap,.hy-trap:has(.hy-trap-icons),.hy-trap:has(.hy-trap-icons img:only-child) { display:grid!important; grid-template-columns:60px minmax(0,1fr) 36px!important; grid-template-rows:auto auto; column-gap:12px; row-gap:4px; width:100%; box-sizing:border-box; }
 .hy-trap > .hy-trap-heading { display:contents!important; }
 .hy-trap .hy-trap-heading > .hy-trap-icons { grid-column:1; grid-row:1 / span 2; position:static; align-self:start; height:auto; margin:0!important; transform:none!important; }
 .hy-trap .hy-trap-heading > b { grid-column:2; grid-row:1; margin:0; font-size:18px; line-height:1.3; }
 .hy-trap > small,.hy-trap:has(.hy-trap-icons) > small,.hy-trap:has(.hy-trap-icons img+img) > small { grid-column:2; grid-row:2; padding:0!important; margin:0; line-height:1.5; }
 .hy-trap > .cm-sec,.hy-trap:has(.hy-trap-icons) > .cm-sec,.hy-trap:has(.hy-trap-icons img+img) > .cm-sec { position:static!important; grid-column:3!important; grid-row:1 / span 2!important; margin:0!important; width:32px; min-width:32px; height:32px; align-self:start; justify-self:end; transform:none; }
 .hy-trap:not(:has(.hy-trap-icons)) { grid-template-columns:minmax(0,1fr) 36px!important; }
 .hy-trap:not(:has(.hy-trap-icons)) .hy-trap-heading > b,.hy-trap:not(:has(.hy-trap-icons)) > small { grid-column:1; }
 .hy-trap:not(:has(.hy-trap-icons)) > .cm-sec { grid-column:2!important; }
}

@media(min-width:651px) {
 .hy-detail { container-type:inline-size; }
 .hy-row,.hy-row:first-child { max-width:454px; }
 .hy-ctiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@container (min-width:688px) {
 .hy-row,.hy-row:first-child { max-width:688px; }
 .hy-ctiles { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@container (min-width:922px) {
 .hy-row,.hy-row:first-child { max-width:922px; }
 .hy-ctiles { grid-template-columns:repeat(4,minmax(0,1fr)); }
}

/* Equal row heights and a shared source/comment control baseline. */
@media(min-width:651px) {
 .hy-ctiles > .hy-ctile:not(:has(> .hy-card-set)) { align-self:stretch; }
 .hy-ctile:not(:has(> .hy-card-set)) > .hy-mobile-copy { flex:1 1 auto; }
}
.hy-ctile > .hy-mobile-footer { align-items:flex-start; margin-top:auto!important; }
.hy-mobile-footer > .hy-sources { padding-top:0!important; padding-bottom:0!important; margin-top:0; }
.hy-mobile-footer > .hy-sources > summary { box-sizing:border-box; min-height:30px; line-height:30px; padding-top:0; padding-bottom:0; }
.hy-mobile-footer > .cm-tile { display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; height:30px; min-height:30px; line-height:1; padding-top:0; padding-bottom:0; margin-top:0; align-self:flex-start; }