/* Plain reference-site presentation. Existing card data and reading layout stay shared. */
:root{--side:0px;--bg:#fff;--paper:#fff;--ink:#222;--muted:#555;--line:#b9b9b9;--green:#0645ad;--accent:#e7e7e7;--card-grid-gap:10px}
[hidden]{display:none!important}body{background:#fff;color:#222;font-size:13px;line-height:1.65}a{color:#0645ad}a:hover{text-decoration:underline}button,input,select{border-radius:0!important;box-shadow:none!important}button{color:#222}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #345b8a;outline-offset:2px}
.sidebar{position:static;inset:auto;width:auto;transform:none;padding:10px max(20px,calc((100% - 1200px)/2)) 0;background:#e7e7e7;color:#222;display:flex;align-items:baseline;gap:32px;border-bottom:1px solid #999;box-shadow:none}
.brand{display:block;flex:none;padding:0 0 9px;border:0;color:#222;font-size:19px;letter-spacing:0;font-weight:600}.brand:hover{text-decoration:none}.brand-symbol,.nav-icon{display:none}.sidebar nav{display:flex;gap:0;padding:0;flex-wrap:wrap}.nav-item{display:block;margin:0 0 -1px;padding:7px 16px;border:1px solid transparent;border-bottom-color:#999;border-radius:0;color:#0645ad}.nav-item>span:last-child{display:block;font-size:13px}.nav-item:hover{background:#f5f5f5;text-decoration:underline}.nav-item.active,.nav-item.active:hover{border-color:#999;border-bottom-color:#fff;background:#fff;color:#222;font-weight:600;text-decoration:none}.workspace{margin:0}.topbar{max-width:1240px;margin:auto;height:36px;padding:0 20px;border-bottom:1px solid #ccc;background:#fff;gap:12px}.topbar #breadcrumb{font-size:12px;max-width:none}.icon-button{display:none!important}#global-search{width:230px;border-bottom:0;gap:4px}#global-search input{border:1px solid #aaa;background:#fff;padding:3px 6px;font-size:12px}#global-search button{font-size:16px;min-width:28px;padding:0 5px;border:1px solid #aaa;background:#eee}
main{max-width:1240px;margin:0 auto;padding:12px 20px 32px;min-height:calc(100vh - 90px)}.page-heading{margin:0 0 12px;border-bottom:2px solid #888;padding-bottom:5px}.page-heading h1{font-size:21px;font-weight:500;color:#222}.query-form{border:1px solid #aaa;border-radius:0;padding:10px;background:#f6f6f6}.query-input{border:1px solid #999;background:#fff;border-radius:0;padding:0 8px}.query-input>span{display:none}.query-input input{padding:6px 0;font-size:13px}.primary-button,.copy-button,.pagination button,.relation-search button,.relation-pagination button{background:#eaeaea;color:#222;border:1px solid #999;padding:4px 12px;border-radius:0;font-size:12px;min-height:28px}.primary-button:hover,.copy-button:hover,.relation-search button:hover,.relation-pagination button:hover{background:#ddd}.filters{margin-top:8px;gap:8px 12px}.filter-label,.type-field>legend{color:#444;font-size:12px}.filter-field select{border:1px solid #999;color:#222;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='m4 5.5 3 3 3-3' stroke='%23555' stroke-width='1.3' stroke-linecap='square'/%3E%3C/svg%3E");height:32px;font-size:12px}.filter-choices{background:#fff;border:1px solid #999;border-radius:0;gap:0;padding:0;height:32px}.filter-choices button{border:0;border-right:1px solid #ccc;border-radius:0;color:#0645ad;background:#f5f5f5;font-size:12px;padding:3px 10px}.filter-choices button:last-child{border-right:0}.filter-choices button[aria-pressed=true]{background:#d9d9d9;color:#111;font-weight:600}.filter-choices button:hover:not([aria-pressed=true]){background:#eee;color:#0645ad}.filters>.reset-button{height:32px;color:#0645ad;font-size:12px;padding:3px 6px}.filter-field.is-disabled{opacity:.55}.filter-field select:disabled{background-color:#eee;color:#666}.filter-field select:hover:not(:disabled){border-color:#555}.result-count{font-size:12px;color:#444;margin:10px 0 6px}.card-view-toolbar{margin-bottom:8px}.density-control,.density-end{font-size:11px;color:#444}.density-control input{accent-color:#666}.view-switch{padding:0;gap:0;border:1px solid #999;border-radius:0;background:#fff}.view-switch button{color:#0645ad;border-right:1px solid #bbb;border-radius:0;padding:3px 12px;font-size:12px;background:#f4f4f4}.view-switch button:last-child{border-right:0}.view-switch button.active{background:#ddd;color:#222;box-shadow:none;font-weight:600}
.entity-tile{border:0;border-radius:0;padding:4px;background:transparent;transition:none}.entity-tile:hover{border-color:transparent;text-decoration:none}.tile-image{background:#f1f1f1;border:1px solid #aaa}.tile-name{color:#0645ad}.tile-name:hover{text-decoration:underline}.tile-meta{color:#444;border-color:#ccc;font-size:11px}.tile-rarity{color:#444;border-color:#ccc;font-size:11px}.quantity{border-radius:0;background:#eee;color:#222;border:1px solid #777}.image-placeholder{background:#eee;color:#999}.pack-grid{gap:10px}.pack-tile,.card-relations .pack-tile{border:1px solid #aaa;padding:10px;min-height:106px;background:#fff}.pack-tile:hover{border-color:#555}.pack-number{font-size:11px;color:#555}.pack-tile .tile-name{margin:3px 0 8px}.pack-tile-facts{border-color:#ccc;padding-top:6px}.pack-tile-facts dt,.pack-tile-facts dd{color:#444;font-size:11px}.pack-tile-facts dd{color:#222}.card-list{gap:0;border:1px solid #aaa}.card-list-item{border:0;border-bottom:1px solid #ccc;border-radius:0;padding:12px;background:#fff}.card-list-item:last-child{border-bottom:0}.card-list-title a{color:#0645ad}.card-list-meta{border-color:#ccc}.card-list-meta dt,.card-list-effect h4{color:#555}.card-list-meta dd,.list-effect-ja{color:#222}.list-effect-zh{color:#444}.card-list-image{background:#eee}
.entity-table{border:1px solid #aaa;border-radius:0}.table-head{background:#e5e5e5;color:#222;font-size:12px;font-weight:500}.entity-row{color:#222;border-color:#ccc;font-size:12px}.entity-row:nth-child(odd){background:#f5f5f5}.entity-row:hover{background:#edf1f5}.entity-row>div:nth-last-child(-n+2),.character-row .row-rating{color:#444}.character-row .row-decks{color:#0645ad;font-size:12px}.table-head,.entity-row{padding:8px 10px}.deck-card-count{color:#222!important;font-weight:600}.inline-decks{margin-top:3px;color:#222}.inline-decks>summary{cursor:pointer;color:#0645ad;font-size:12px}.inline-decks input{width:100%;max-width:220px;margin:5px 0;padding:3px 5px;border:1px solid #aaa;font-size:12px}.inline-decks a{margin:3px 0}.inline-deck-status{font-size:12px;color:#555}.empty{padding:12px;border-color:#aaa;border-radius:0;color:#555}.pagination{color:#444;font-size:12px}.pagination button{padding:3px 12px}
.detail-title{padding-bottom:6px;border-bottom:2px solid #888;margin-bottom:12px;gap:12px}.detail-title h1{font-size:22px;font-weight:500;color:#222}.detail-title .card-name-zh{color:#555;font-size:14px}.detail-summary{border:1px solid #aaa;border-radius:0;padding:12px;background:#fff}.detail-summary.card-overview{grid-template-columns:160px minmax(0,1fr);gap:12px 18px}.card-overview .detail-media>.entity-image{max-height:232px}.card-overview .detail-media>.image-placeholder{min-height:232px}.facts>div{border-color:#ccc}.facts dt,.card-overview .facts dt{color:#555;font-size:11px}.facts dd,.card-overview .facts dd{color:#222}.image-actions button{border:1px solid #aaa;background:#f4f4f4;color:#0645ad;border-radius:0}.image-actions button.active{background:#ddd;color:#222}.image-actions a{color:#0645ad}.card-effects>h2,.data-section>h2,.section-heading h2{background:#e9e9e9;border:1px solid #bbb;border-left:3px solid #777;border-radius:0;padding:3px 7px;color:#222;font-size:14px;font-weight:500;line-height:1.6}.card-effects>h2{margin:0 0 7px}.effect-language h3{color:#555;font-size:12px;margin-bottom:5px}.card-effects .text-ja{color:#222}.card-effects .text-zh{color:#444}.effect-columns.has-translation>.effect-language+ .effect-language{border-color:#ccc}.text-ja,.text-zh,.text-zh.text-only{background:#fff;border-color:#aaa;border-radius:0;color:#222}.text-zh{color:#444}.text-ja a,.text-zh a{color:#0645ad;text-decoration:underline}.section-heading>a{color:#0645ad}.card-relations{display:block;margin-top:14px}.card-relations>.data-section{margin:0 0 8px}.data-section{margin-top:14px}
/* Relationship sections use one shared searchable disclosure, with native keyboard operation. */
.relation-section{border:1px solid #aaa;background:#fff;border-radius:0;margin-top:10px;min-width:0}.relation-section>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:5px 9px;background:#e9e9e9;min-height:32px;color:#222}.relation-section>summary::-webkit-details-marker{display:none}.relation-section>summary::before{content:'[+]';font-size:12px;font-family:monospace;width:22px;flex:none}.relation-section[open]>summary::before{content:'[-]'}.relation-section>summary h2{display:block;flex:1;margin:0;padding:0;border:0;background:none;font-size:14px;font-weight:500;line-height:1.6}.relation-total{font-size:12px;font-weight:400;color:#555}.relation-action{font-size:12px;color:#555}.relation-action::after{content:'展开'}.relation-section[open]>summary .relation-action::after{content:'收起'}.relation-body{padding:9px;border-top:1px solid #aaa;min-width:0}.relation-search{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:7px}.relation-search label{font-size:12px;color:#444;flex:none}.relation-search input{flex:1;min-width:100px;border:1px solid #999;background:#fff;padding:4px 6px;font:inherit;height:29px}.relation-search button{min-height:29px;font-size:12px;padding:3px 10px}.relation-result-count{display:flex;justify-content:space-between;margin:4px 0 7px;color:#555;font-size:12px}.relation-empty{margin:5px 0;font-size:12px;color:#555}.relation-pagination{display:flex;gap:12px;align-items:center;justify-content:center;font-size:12px;margin-top:9px}.relation-pagination button{font-size:12px;padding:3px 9px}.relation-body .entity-table{border-color:#bbb}.relation-body .pack-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}.relation-body .pack-tile .single-name>span{font-size:13px}.relation-body .entity-row .bilingual>span{font-size:12px}.relation-body .card-collection{margin-top:8px}#toast{border:1px solid #777;background:#eee;color:#222;border-radius:0}
@media(max-width:1150px){:root{--side:0px}.sidebar{padding:8px 20px 0;gap:24px}.topbar{padding:0 20px}main{padding:12px 20px 30px}.detail-summary.card-overview{grid-template-columns:148px minmax(0,1fr);gap:12px 16px}.card-relations .character-table .table-head,.card-relations .character-table .character-row{grid-template-columns:minmax(0,1.1fr) 90px 90px minmax(0,1.7fr)}}
@media(max-width:620px){:root{--side:0px;--card-grid-gap:8px}.sidebar,.sidebar.open{display:block;position:static;transform:none;width:auto;padding:7px 12px 0;box-shadow:none}.brand{font-size:17px;padding:0 0 4px}.sidebar nav{display:flex;padding:0;gap:0;flex-wrap:nowrap}.nav-item{padding:5px 9px;flex:1;text-align:center}.nav-item>span:last-child{font-size:12px;white-space:nowrap}.topbar{height:34px;padding:0 12px;gap:8px}.topbar #breadcrumb{font-size:11px;max-width:none}#global-search{width:140px}#global-search input{font-size:11px;padding:3px 5px}main{padding:10px 12px 24px}.page-heading h1{font-size:20px}.page-heading{margin-bottom:10px}.query-form{padding:8px}.filter-label,.type-field>legend{font-size:11px}.filter-field select,.filter-choices{height:34px}.filter-choices button{font-size:11px}.density-control input{width:85px}.detail-title h1{font-size:20px}.detail-title .card-name-zh{font-size:13px}.detail-summary.card-overview{grid-template-columns:100px minmax(0,1fr);gap:12px;padding:10px}.card-overview .detail-media>.entity-image{max-height:150px}.card-overview .detail-media>.image-placeholder{min-height:148px}.card-overview .facts dt{font-size:10px}.card-overview .facts dd{font-size:12px}.copy-button{font-size:11px;padding:3px 7px}.card-relations{margin-top:12px}.relation-section>summary{padding:5px 7px}.relation-section>summary h2{font-size:13px}.relation-body{padding:7px}.relation-search{gap:5px}.relation-search label{width:100%;font-size:12px}.relation-search input{height:32px;font-size:12px}.relation-search button{min-height:32px;padding:3px 8px}.relation-body .pack-grid{grid-template-columns:1fr}.card-relations .character-table .table-head{display:none}.card-relations .character-table .character-row{grid-template-columns:1fr 1fr;padding:10px;gap:8px 14px}.deck-usage-table .table-head,.deck-usage-table .deck-row{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) 52px 36px 36px;gap:5px;padding:7px 5px;font-size:10px}.relation-body .deck-usage-table .table-head,.relation-body .deck-usage-table .deck-row{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) 48px 32px 32px;gap:4px}.relation-body .entity-row .bilingual>span{font-size:11px}.character-row [data-label]::before{color:#555}.card-list-item{padding:10px}.tile-meta{font-size:10px}.pack-tile{min-height:104px;padding:9px}.relation-result-count{font-size:11px}}
@media(max-width:360px){.nav-item{padding:5px 6px}.detail-summary.card-overview{grid-template-columns:84px minmax(0,1fr);gap:10px}.relation-body .deck-usage-table .table-head,.relation-body .deck-usage-table .deck-row{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 40px 28px 28px;gap:3px;padding:7px 4px}.relation-body .entity-row .bilingual>span{font-size:10px}}
.facts a,.image-actions a,.row-name a,.row-decks a,.relation-body a,.card-list-title a:hover{color:#0645ad}.entity-tile,.sidebar,#toast{transition:none}
.relation-search label.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#toast{left:50%}

#global-search button{font-size:12px;min-width:36px;padding:0 5px;white-space:nowrap}

/* At the compact end, keep all names and metadata within a phone's four-column grid. */
.card-grid.is-dense .tile-name{min-height:32px;margin-top:5px}
.card-grid.is-dense .tile-name .single-name>span{font-size:11px;line-height:1.45}
.card-grid.is-dense .tile-meta{flex-wrap:wrap;gap:2px 4px;line-height:1.4;font-size:10px}
.card-grid.is-dense .tile-meta span:last-child{margin-left:0}
.card-grid.is-dense .card-meta-mode{flex-basis:100%}
.card-grid.is-dense .tile-rarity{font-size:10px;padding-top:4px;margin-top:4px}
