/* Crown atelier: presentation only. Never alter card masks, battle hit areas or scene opacity. */
body.theme-feijin {
  --atelier-ink: #f6ecd5; --atelier-muted: #b9b4a2; --atelier-gold: #d6b779;
  --atelier-edge: #a88b515e; --atelier-crimson: #7f3548;
  --atelier-serif: "Songti SC", "Noto Serif CJK SC", Georgia, serif;
  --atelier-panel: radial-gradient(ellipse at 50% 0, #35504640, transparent 65%), linear-gradient(145deg, #162b25fa, #0b1916fc);
  --atelier-control: linear-gradient(180deg, #3a5045, #22392f 12%, #11271f 88%, #0b1c16);
  --atelier-ruby: radial-gradient(ellipse at 50% 0, #da8b6b45, transparent 75%), linear-gradient(#944653, #742c3f 48%, #4f1f30);
  color: var(--atelier-ink);
  scrollbar-color: #a68a55 #10201b;
}
/* Metal bevels, velvet centers and visible keyboard focus. */
.theme-feijin :is(.ghost-button,.primary-button,.theme-button,.difficulty-button,.collection-icon,.chess-open-decks) {
  border: 1px solid #ad935d; border-radius: 4px;
  background: var(--atelier-control); color: var(--atelier-ink);
  box-shadow: inset 0 1px #fff1bc28, inset 0 0 0 3px #09141077, 0 2px 0 #060f0c, 0 4px 10px #0003;
  text-shadow: 0 1px 2px #000; transition: border-color 150ms, background-color 150ms, box-shadow 150ms, translate 150ms;
}
.theme-feijin :is(.primary-button,.theme-button.active,.difficulty-button.active) {
  background: var(--atelier-ruby); border-color: #d4b579;
  box-shadow: inset 0 1px #fff0bc55, inset 0 0 0 3px #3c152c55, 0 3px 0 #251015, 0 5px 15px #0004;
}
.theme-feijin :is(.ghost-button,.primary-button,.theme-button,.difficulty-button,.collection-icon):not(:disabled):hover {
  border-color: #f6dfa4; box-shadow: inset 0 1px #fff1bc55, inset 0 0 0 3px #d8ba7020, 0 0 14px #d8ba7020, 0 5px 12px #0004;
}
.theme-feijin :is(.ghost-button,.primary-button,.theme-button,.difficulty-button):not(:disabled):active { translate: 0 1px; }
.theme-feijin :is(button,select,input,summary):focus-visible { outline: 2px solid #f6dfaa; outline-offset: 4px; }
.theme-feijin :is(input:not([type=checkbox]),select) {
  border: 1px solid #9c875c88; border-radius: 3px; background: linear-gradient(#091814,#14271f);
  color: #f4e9d0; box-shadow: inset 0 2px 5px #0005; min-height: 38px;
}
.theme-feijin :is(input,select)::placeholder { color: #aaa997; }
.theme-feijin option { background: #13291f; color: #f4e9d0; }
/* Cover: an engraved title and a clear primary invitation. */
.theme-feijin #introOverlay::after {
  content: ""; position: absolute; inset: 18px; pointer-events: none; z-index: 0;
  border: 1px solid #d3b77d66; box-shadow: 0 0 0 5px #07120c55, inset 0 0 0 4px #07120c33;
  border-radius: 18px 2px;
}
.theme-feijin .intro-content { z-index: 1; gap: 11px; padding: 20px 8px; }
.theme-feijin .intro-content::before {
  content: ""; display: block; width: 130px; height: 64px; margin: 0 auto 0 0;
  background: url('./assets/ui/crown-seal.svg') center / contain no-repeat;
}
.theme-feijin .intro-content .intro-kicker { letter-spacing: .24em; font-size: 11px; color: #d5be8c; }
.theme-feijin .intro-content .intro-title {
  font-size: clamp(40px,4.5vw,66px); letter-spacing: .12em; line-height: 1.15; color: #f8e6bc;
  text-shadow: 0 2px 0 #75592f, 0 4px 12px #000a;
}
.theme-feijin .intro-subtitle { color: #dbccb1; font-size: 16px; letter-spacing: .18em; margin-bottom: 8px; }
.theme-feijin #startIntroButton {
  position: relative; min-height: 66px; border-radius: 8px 2px; background: var(--atelier-ruby);
  border-color: #e0c68c; font-family: var(--atelier-serif); font-size: 25px; letter-spacing: .16em;
  box-shadow: inset 0 0 0 4px #4b1b2c, inset 0 0 0 5px #c9a46299, inset 0 12px 24px #e6b17818, 0 5px 0 #251018, 0 10px 24px #0005;
}
.theme-feijin #startIntroButton::before,.theme-feijin #startIntroButton::after {
  content: ""; width: 7px; height: 7px; position: absolute; top: calc(50% - 4px); rotate: 45deg;
  background: #dfc383; box-shadow: 0 0 0 3px #381522, 0 0 0 4px #d3b27077; pointer-events: none;
}
.theme-feijin #startIntroButton::before { left: 18px; }.theme-feijin #startIntroButton::after { right: 18px; }
.theme-feijin #startIntroButton:hover { background: var(--atelier-ruby); filter: brightness(1.12); }
.theme-feijin .home-deck-leader { padding: 8px 0 2px; color: #cec2a8; font-size: 12px; }
.theme-feijin .difficulty-panel { padding: 5px 0 12px; margin: 0; border-color: #c2a16566; }
.theme-feijin .difficulty-button { padding-inline: 13px; min-height: 30px; }
.theme-feijin .intro-content .cover-menu { gap: 8px 12px; }
.theme-feijin .cover-menu .home-option {
  position: relative; min-height: 54px; padding: 10px 16px; border: 1px solid #a88b5166;
  background: linear-gradient(110deg,#263b2ded,#10231ded 65%); border-radius: 5px 1px;
  box-shadow: inset 0 1px #eed7a422, inset 3px 0 #bfa16677, 0 3px 6px #0004;
}
.theme-feijin .cover-menu .home-option::after { content: ""; width: 5px; height: 5px; margin-left: auto; border-top: 1px solid #bda06a; border-right: 1px solid #bda06a; rotate: 45deg; flex: 0 0 5px; }
.theme-feijin .cover-menu .home-option span { font-size: 17px; letter-spacing: .05em; }
.theme-feijin .cover-menu .royal-menu-icon { color: #e0c386; filter: drop-shadow(0 1px 2px #000); }
.theme-feijin .cover-menu .home-option:not(:disabled):hover { background: linear-gradient(110deg,#3b5240,#192d24); border-color: #d5b77c; }
.theme-feijin .home-leader figcaption { border: 1px solid #b5955e88; border-left: 3px solid #d4b879; background: var(--atelier-panel); border-radius: 2px 12px 2px 2px; box-shadow: 0 5px 16px #0006; }
.theme-feijin .home-stats { border-top: 1px solid #b89d5844; padding-top: 10px; }
.theme-feijin .home-stats span { color: #c5b89d; }
/* Every destination uses the same architectural panel, not a flat webpage rectangle. */
.theme-feijin :is(.guide-panel,.library-panel,.changelog-panel,.settings-panel,.deck-builder-panel,.online-panel),
.theme-feijin #libraryOverlay.library-gallery-mode .library-panel,
.theme-feijin :is(.chess-decks,.chess-choice,.phase1-setup,.remaining-deck-dialog,#battleJournal,#phase1RewardDialog) {
  color: var(--atelier-ink); border: 1px solid #bc9d63; border-radius: 12px 3px;
  background: var(--atelier-panel);
  box-shadow: inset 0 0 0 4px #081712, inset 0 0 0 5px #b1975845, 0 18px 60px #0008;
  scrollbar-width: thin;
}
.theme-feijin .library-header {
  position: relative; border-bottom: 1px solid #b79c6266; padding-bottom: 20px; margin-bottom: 20px;
  background: linear-gradient(90deg,#d7b6750b,transparent); gap: 16px;
}
.theme-feijin .library-header::after { content: ""; position: absolute; left: 0; bottom: -3px; width: 38px; height: 5px; background: #c4a66b; clip-path: polygon(0 50%,85% 0,100% 50%,85% 100%); }
.theme-feijin .library-header .eyebrow { color: #bfa36d; letter-spacing: .2em; font: 10px/1.4 Georgia,serif; text-transform: uppercase; }
.theme-feijin .library-header h2 { font: 500 30px/1.3 var(--atelier-serif); letter-spacing: .08em; color: #f2dfb2; }
.theme-feijin :is(.library-tab,.library-view-switch button,.gallery-series-tabs button,.journal-tabs button) {
  border-radius: 3px 3px 0 0; border: 1px solid transparent; border-bottom: 1px solid #a88b5166;
  background: #10231a; color: #cfc6af; box-shadow: inset 0 1px #d6b77918;
}
.theme-feijin :is(.library-tab.active,.library-view-switch button[aria-pressed=true],.gallery-series-tabs button[aria-pressed=true],.journal-tabs button[aria-selected=true]) {
  background: linear-gradient(#773548,#3d242c); color: #f9e6b8; border-color: #c5a566;
  box-shadow: inset 0 -2px #dfc587, inset 0 1px #ffe6a930;
}
.theme-feijin :is(.library-series-intro,.deck-builder-toolbar,.online-loadout-bar,.version-card,.chess-deck-intro) {
  background: linear-gradient(110deg,#bd9b5815,transparent 75%); border: 1px solid #ab8f5744;
  border-left: 3px solid #bfa368; border-radius: 2px; padding: 16px 18px;
}
.theme-feijin #libraryFilters { background: #06170e40; border-block-color: #ac935442; padding: 14px 10px; }
.theme-feijin #libraryFilters label { color: #c5ba9f; letter-spacing: .05em; }
.theme-feijin #libraryResultCount { color: #d6bd84; font-size: 12px; }
.theme-feijin #libraryTerms { border-color: #b79c6244; }
.theme-feijin :is(.skill-item,.flow-step,.guide-grid article) { border: 1px solid #a98c5155; background: linear-gradient(135deg,#2b4032,#12271e); border-radius: 7px 2px; box-shadow: inset 0 1px #e4c8901a; }
.theme-feijin :is(.skill-item strong,.guide-grid article strong,.flow-step strong) { color: #ebd6a5; font-family: var(--atelier-serif); }
.theme-feijin :is(.deck-builder-card,.library-card,.remaining-deck-card) { background: linear-gradient(145deg,#24352a,#10241c); border: 1px solid #a68b5155; border-radius: 6px; }
.theme-feijin .deck-builder-toolbar { gap: 18px; }
.theme-feijin #deckBuilderCount { font: 28px/1.2 Georgia,serif; color: #f0d69b; }
.theme-feijin :is(.deck-builder-card,.remaining-deck-card) p { color: #c6c2b1; }
/* Exhibit: quiet, carved frames around the artwork rather than over it. */
.theme-feijin #cardGallery { background: radial-gradient(ellipse at 28% 42%,#c5a56a18,transparent 55%); }
.theme-feijin .gallery-details { border-left: 1px solid #c4a26866; padding-left: 30px; }
.theme-feijin .gallery-details h3 { font-family: var(--atelier-serif); color: #f7e2b4; text-shadow: 0 2px #0005; }
.theme-feijin .gallery-details h4 { color: #d5ba81; letter-spacing: .15em; }
.theme-feijin .gallery-footer { border-top-color: #b79c6255; color: #b6a583; }
.theme-feijin .gallery-pagination button { background: var(--atelier-control); border-color: #b79a62; box-shadow: inset 0 0 0 3px #07170f88; }
.theme-feijin #cardInspector { background: var(--atelier-panel); border: 1px solid #c7ab70; border-radius: 12px 3px; box-shadow: inset 0 0 0 4px #071711, inset 0 0 0 5px #ad8f5144,0 24px 80px #000a; }
.theme-feijin #cardInspector .inspect-reading { background: linear-gradient(135deg,#d6b87809,transparent); }
.theme-feijin #cardInspector :is(header,.inspect-keywords) { border-color: #b49a5c55; }
.theme-feijin #cardInspector #inspectTitle { color: #f4dcaa; font-family: var(--atelier-serif); letter-spacing: .06em; }
.theme-feijin #cardInspector .inspect-meta { color: #c2ac80; }
.theme-feijin #cardInspector .inspect-effect { line-height: 1.95; color: #efe4ce; }
.theme-feijin #cardInspector .inspect-stats { border-block: 1px solid #b99b5144; padding-block: 10px; color: #c4ddd6; }
/* Lobby, setup, rewards and chess construction share the same visual language. */
.theme-feijin .online-grid { gap: 20px; }
.theme-feijin .online-card { position: relative; padding: 28px 22px 24px; background: linear-gradient(145deg,#31453880,#13271f); border: 1px solid #c0a36a77; border-radius: 10px 2px; }
.theme-feijin .online-card::before { content: "I"; display: block; color: #ceb177; font: 22px/1 Georgia,serif; border-bottom: 1px solid #bfa16644; padding-bottom: 14px; margin-bottom: 16px; }
.theme-feijin .online-card:nth-child(2)::before { content: "II"; }
.theme-feijin .online-card > strong { font: 24px/1.4 var(--atelier-serif); color: #f0d9a5; }
.theme-feijin .online-card p { line-height: 1.8; color: #bfbda9; }
.theme-feijin :is(.room-share,.online-room-lobby) { border: 1px solid #b59c6255; background: #081b1480; padding: 18px; border-radius: 4px; }
.theme-feijin #roomCodeText { color: #dfc48b; font-family: var(--atelier-serif); }
.theme-feijin .settings-section { border-bottom: 1px solid #ac935444; }
.theme-feijin .settings-section > strong { display: block; color: #e6d09e; letter-spacing: .08em; margin-bottom: 12px; }
.theme-feijin :is(.sound-preference,.salon-preferences) input[type=checkbox] { accent-color: #ae8552; width: 22px; height: 22px; }
.theme-feijin .changelog-list article { border-left: 1px solid #bfa06477; padding: 18px 22px; margin-left: 5px; background: linear-gradient(90deg,#d8b4650b,transparent); }
.theme-feijin .changelog-list article h3 { color: #ead4a6; font-family: var(--atelier-serif); }
.theme-feijin .changelog-list article > span { color: #bda16b; font-size: 12px; }
.theme-feijin :is(.chess-decks,.chess-choice,.phase1-setup,#phase1RewardDialog) h2 { font-family: var(--atelier-serif); color: #efd8a7; letter-spacing: .08em; }
.theme-feijin :is(.chess-decks,.chess-choice) button { background: var(--atelier-control); border-color: #b69a625f; border-radius: 5px 2px; }
.theme-feijin .chess-decks button[aria-pressed=true] { background: var(--atelier-ruby); border-color: #dec58b; box-shadow: inset 0 -2px #dabb7b; }
.theme-feijin .chess-presets button { border-top: 3px solid #cfb47c; padding: 20px 16px; }
.theme-feijin .chess-presets button:nth-child(2) { border-top-color: #9c83b2; }.theme-feijin .chess-presets button:nth-child(3) { border-top-color: #73a59f; }
.theme-feijin .chess-presets small { color: #c3bca7; line-height: 1.6; }
.theme-feijin .chess-deck-card { background: #0b201c77; border-color: #a18b5155; }
.theme-feijin .chess-decks footer { background: #10231b; border-top: 1px solid #ad935d66; }
.theme-feijin .chess-decks button.chess-deck-art { background: transparent; border: 0; }
.theme-feijin .phase1-setup fieldset { border: 1px solid #b79b6266; border-radius: 6px 2px; background: #07170e66; }
.theme-feijin .phase1-setup legend { color: #e7d099; font-family: var(--atelier-serif); }
.theme-feijin :is(#phase1RewardDialog button,.chess-choice-options button) { background: var(--atelier-control); color: #f0dfbb; border: 1px solid #b99f68; }
/* Battle instruments: increase local contrast, keeping the battlefield itself unobscured. */
.theme-feijin.phase-one .battle-layout .battle-status-strip { text-shadow: 0 1px 3px #000; }
.theme-feijin.phase-one .battle-layout .turn-counter {
  background: linear-gradient(90deg,#10291ee6,#263c2af0,#10291ee6); padding: 4px 16px;
  border: 1px solid #c0a56e99; border-radius: 2px 10px; color: #f5dfa9;
  box-shadow: inset 0 0 0 2px #08190d,0 3px 8px #0003; font: 16px/1.25 var(--atelier-serif);
}
.theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-economy {
  padding: 10px 14px; border: 1px solid #bca16b99; border-left: 3px solid #d6be82;
  border-radius: 3px 12px 3px 3px; background: linear-gradient(110deg,#102b25f2,#0b231ddb);
  box-shadow: inset 0 0 0 3px #06181055,0 5px 12px #0003;
}
.theme-feijin.phase-one .battle-layout .phase1-balance { color: #f9e0a4; font: 600 23px/1.2 var(--atelier-serif); text-shadow: 0 2px 2px #000; }
.theme-feijin.phase-one .battle-layout .phase1-next { color: #d6d4b8; }
.theme-feijin.phase-one .battle-layout .hero.has-deck-leader { border-color: #e4c78c; box-shadow: inset 0 0 0 3px #15231c,0 0 0 1px #694e30,0 0 0 4px #c5a26233,0 7px 20px #0007; }
.theme-feijin.phase-one .battle-layout .hero.has-deck-leader > div { background: radial-gradient(ellipse at 40% 0,#c06365,#7b283f 70%); box-shadow: inset 0 0 0 2px #561a2d,0 3px 5px #0005; }
.theme-feijin.phase-one .battle-layout :is(.phase1-level,.hero .evo) { background: var(--atelier-control); border-color: #c5ac70; color: #eee0bc; box-shadow: inset 0 1px #ffffdd22,0 2px 5px #0004; }
.theme-feijin.phase-one .battle-layout #endTurnButton {
  background: radial-gradient(circle at 40% 28%,#537e7b,#1f4b50 48%,#102d39 80%); border: 3px solid #d6bc7d;
  box-shadow: inset 0 0 0 3px #122a2e,inset 0 0 0 4px #c3c4a255,0 0 0 2px #6d603f,0 6px 16px #0006;
  color: #fff0c8; font-family: var(--atelier-serif); text-shadow: 0 2px 3px #000; letter-spacing: .06em;
}
.theme-feijin.phase-one .battle-layout #endTurnButton:not(:disabled):hover { box-shadow: inset 0 0 0 3px #122a2e,inset 0 0 0 4px #ead5a2,0 0 0 2px #9b834f,0 0 24px #d4bb7455; }
.theme-feijin.phase-one .battle-layout #endTurnButton:disabled { filter: saturate(.4); }
.theme-feijin.phase-one .battle-layout :is(.chess-skills button,.battle-details summary) { background: var(--atelier-control); color: #efdcac; border-color: #a78d55; box-shadow: inset 0 1px #f5daa133,0 2px 5px #0004; }
.theme-feijin.phase-one .battle-layout .log-panel { border-left-color: #cfb27699; }
.theme-feijin.phase-one .battle-layout .journal-heading { padding-bottom: 6px; border-bottom: 1px solid #b69b5b66; }
.theme-feijin.phase-one .battle-layout .journal-heading h2 { font-family: var(--atelier-serif); color: #f0dfb7; letter-spacing: .14em; text-shadow: 0 1px 3px #000; }
.theme-feijin.phase-one .battle-layout .mulligan-panel,
.theme-feijin #phase1DrawPrompt { border: 1px solid #c5aa70; background: var(--atelier-panel); box-shadow: inset 0 0 0 3px #14241a,0 8px 24px #0006; border-radius: 8px 2px; }
.theme-feijin #phase1DrawPrompt strong { font-family: var(--atelier-serif); color: #efd9a6; letter-spacing: .08em; }
.theme-feijin .phase1-draw-options button { background: var(--atelier-control); border-color: #b7995d; color: #f5e1b6; }
.theme-feijin .remaining-deck-dialog > header { background: linear-gradient(100deg,#293e2e,#10251e); border-bottom: 1px solid #c1a266; }
.theme-feijin #battleJournal h2 { font-family: var(--atelier-serif); color: #f0dcad; }
.theme-feijin .battle-info-table thead th { background: #293e30; color: #e7cea0; }
.theme-feijin .battle-info-table tbody tr:nth-child(even) { background: #d2b17308; }
.theme-feijin .battle-info-table :is(td,th) { border-bottom-color: #a48c4d33; }
.theme-feijin .journal-events li { border-color: #bfa56c44; color: #ddd6c2; }
.theme-feijin .result-panel { position: relative; background: var(--atelier-panel); border: 1px solid #d6bb7c; border-radius: 18px 3px; box-shadow: inset 0 0 0 5px #101f16,inset 0 0 0 6px #b89f5c66,0 20px 80px #0008; padding: 36px; }
.theme-feijin .result-panel::before { content: ""; display: block; width: 150px; height: 90px; background: url('./assets/ui/crown-seal.svg') center / contain; margin: 0 auto 12px; }
.theme-feijin #resultTitle { font: 600 clamp(36px,6vw,60px)/1.2 var(--atelier-serif); color: #f2dda8; letter-spacing: .18em; text-shadow: 0 2px #785939; }
/* Short and mobile screens keep the same craft without sacrificing reachability. */
@media(min-width:1000px) and (max-height:800px) {
  .theme-feijin .intro-content { gap: 8px; padding-block: 8px; }
  .theme-feijin .intro-content::before { height: 38px; width: 100px; }
  .theme-feijin .intro-content .intro-title { font-size: 44px; }
  .theme-feijin .intro-subtitle { margin-bottom: 0; }
  .theme-feijin #startIntroButton { min-height: 54px; font-size: 23px; }
  .theme-feijin .cover-menu .home-option { min-height: 43px; padding-block: 7px; }
  .theme-feijin .home-deck-leader { padding-block: 4px 0; }
  .theme-feijin .home-stats { padding-top: 6px; }
}
@media(max-width:999px) {
  .theme-feijin .intro-content::before { height: 42px; width: 105px; }
  .theme-feijin .gallery-details { padding-left: 18px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-economy { padding: 6px 8px; }
  .theme-feijin.phase-one .battle-layout .phase1-balance { font-size: 18px; }
}
@media(max-width:600px) {
  .theme-feijin #introOverlay::after { inset: 8px; }
  .theme-feijin .intro-content { gap: 10px; padding: 16px 10px; }
  .theme-feijin .intro-content .intro-title { font-size: 38px; }
  .theme-feijin .intro-subtitle { font-size: 14px; }
  .theme-feijin #startIntroButton { min-height: 56px; font-size: 22px; }
  .theme-feijin .cover-menu .home-option { padding: 10px 12px; min-height: 46px; gap: 9px; }
  .theme-feijin .cover-menu .home-option span { font-size: 15px; }
  .theme-feijin .library-header { flex-wrap: wrap; gap: 10px; }
  .theme-feijin .library-header h2 { font-size: 24px; }
  .theme-feijin .gallery-details { border-left: 0; border-top: 1px solid #b49a5c55; padding: 18px 0 0; }
  .theme-feijin :is(.guide-panel,.changelog-panel,.settings-panel,.deck-builder-panel,.online-panel) { padding: 20px 16px; }
  .theme-feijin .online-card { padding: 18px 16px; }
  .theme-feijin #libraryFilters { padding-inline: 0; }
  .theme-feijin .deck-builder-toolbar { padding: 12px; }
  .theme-feijin .chess-presets button { padding: 12px; }
  .theme-feijin .result-panel { padding: 24px; }
}
@media(prefers-reduced-motion:reduce) { .theme-feijin :is(button,.intro-content) { transition: none; animation: none; } }
.theme-feijin.salon-reduced-motion :is(button,.intro-content) { transition: none; animation: none; }
/* Reading typography stays quiet so illustration and headings carry the hierarchy. */
.theme-feijin :is(.guide-panel,.library-panel,.changelog-panel,.settings-panel,.deck-builder-panel,.online-panel) :is(p,small,label) { font-weight: 400; }
.theme-feijin #onlineOverlay .online-card { border: 1px solid #b99b6266; background: linear-gradient(145deg,#35513c77,#0c201a); border-radius: 10px 2px; }
.theme-feijin #libraryOverlay .library-series-intro { padding: 16px 18px; border: 1px solid #ab8f5744; border-left: 3px solid #bfa368; background: linear-gradient(100deg,#d0af5e12,transparent); }
.theme-feijin #libraryOverlay .library-view-switch button[aria-pressed=true],
.theme-feijin #cardGallery .gallery-series-tabs button[aria-pressed=true] { background: var(--atelier-ruby); border-color: #c5a566; color: #f5dfa8; }
/* A portrait phone needs a full-width menu, not a squeezed desktop column. */
@media(max-width:699px) and (orientation:portrait) {
  .theme-feijin #introOverlay { overflow-y: auto; padding: 28px 20px; display: block; }
  .theme-feijin #introOverlay::after { position: fixed; }
  .theme-feijin #homeLeader { display: none; }
  .theme-feijin .intro-content {
    position: relative; top: auto; left: auto; transform: none; width: 100%; max-height: none; overflow: visible;
    margin: 0 auto; padding: 20px 10px; gap: 13px; align-content: start; background: linear-gradient(#10241a88,#0b2016e8);
  }
  .theme-feijin .intro-content::before { width: 120px; height: 62px; margin-inline: auto; }
  .theme-feijin .intro-content :is(.intro-title,.intro-kicker,.intro-subtitle) { text-align: center; }
  .theme-feijin .intro-content .intro-title { font-size: clamp(30px,9vw,46px); letter-spacing: .1em; }
  .theme-feijin .intro-content .intro-subtitle { margin-bottom: 9px; }
  .theme-feijin .intro-content .cover-menu { gap: 10px; }
  .theme-feijin .cover-menu .home-option { min-height: 54px; padding-inline: 10px; }
  .theme-feijin .cover-menu .home-option span { font-size: 15px; white-space: nowrap; }
  .theme-feijin .cover-menu .royal-menu-icon { width: 17px; height: 17px; flex-basis: 17px; }
  .theme-feijin .difficulty-panel { flex-wrap: wrap; gap: 10px; }
  .theme-feijin .difficulty-options { margin-left: auto; }
  .theme-feijin .home-stats { gap: 6px; flex-direction: column; }
  .theme-feijin #startIntroButton { white-space: nowrap; }
}
@media(max-height:500px) and (min-width:560px) {
  .theme-feijin .intro-content { top: 16px; transform: none; height: calc(100dvh - 32px); max-height: none; align-content: start; overflow-y: auto; padding: 4px 8px 18px; }
  .theme-feijin .intro-content::before { display: none; }
  .theme-feijin .intro-content .intro-title { font-size: 30px; }
  .theme-feijin .intro-kicker { font-size: 9px; }
  .theme-feijin .intro-subtitle { font-size: 13px; }
  .theme-feijin #startIntroButton { min-height: 46px; font-size: 20px; }
  .theme-feijin .cover-menu .home-option { min-height: 38px; padding: 6px 10px; }
  .theme-feijin .cover-menu .home-option span { font-size: 14px; }
  .theme-feijin .home-leader figcaption { padding: 8px 12px; }
}
/* Collection layout gives the actual cards priority over filter chrome. */
.theme-feijin #libraryOverlay:not(.library-gallery-mode) .library-header { padding-bottom: 12px; margin-bottom: 12px; }
.theme-feijin #libraryOverlay .library-series-intro { padding: 10px 14px; margin-block: 10px; }
.theme-feijin #libraryOverlay .library-series-intro p { margin-block: 6px 0; line-height: 1.6; font-size: 14px; }
.theme-feijin #libraryTerms { padding-block: 8px; margin-block: 4px 12px; }
.theme-feijin #cardLibrary { gap: 18px; grid-template-columns: repeat(auto-fill,minmax(175px,1fr)); }
.theme-feijin #cardLibrary > .card { padding: 10px; background: linear-gradient(140deg,#2b3d2f,#11271e); border-color: #ac92555e; box-shadow: inset 0 1px #f9e0a922,0 4px 10px #0003; }
.theme-feijin #cardLibrary > .card:hover { border-color: #d9bb7d; box-shadow: 0 0 0 1px #ccb47566,0 8px 18px #0005; }
.theme-feijin #cardLibrary .cost { background: radial-gradient(circle at 35% 25%,#638d92,#235664 65%,#153344); color: #fff4d7; border: 1px solid #d1b579; font-family: Georgia,serif; }
.theme-feijin .deck-builder-card { box-shadow: inset 0 1px #f0dba922,0 4px 12px #0003; }
@media(max-width:540px) {
  .theme-feijin #cardLibrary { grid-template-columns:repeat(2,minmax(0,1fr)); gap: 10px; }
  .theme-feijin #cardLibrary > .card { padding: 7px; }
}
/* Compact battle layout: give each leader a dedicated information rail on small screens. */
@media(max-width:999px) {
  .theme-feijin.phase-one .game-shell.battle-layout { display: flex; flex-direction: column; gap: 8px; min-height: 100dvh; height: auto; padding: 8px; }
  .theme-feijin.phase-one .battle-layout > :is(.center-board,.target-zone) { display: contents; }
  .theme-feijin.phase-one .battle-layout .topbar { min-height: 32px; padding: 0; }
  .theme-feijin.phase-one .battle-layout .top-actions { justify-content: flex-end; flex-wrap: nowrap; }
  .theme-feijin.phase-one .battle-layout .top-actions button { flex: 0 0 auto; }
  .theme-feijin.phase-one .battle-layout .battle-status-strip { min-height: 44px; gap: 4px 10px; padding: 0; }
  .theme-feijin.phase-one .battle-layout .battle-status-strip .trait-status { font-size: 10px; }
  .theme-feijin.phase-one .battle-layout .turn-counter { font-size: 14px; padding: 4px 12px; }
  .theme-feijin.phase-one .battle-layout > .player-panel { display: flex; flex-direction: column-reverse; gap: 7px; padding: 0; min-height: 0; border: 0; }
  .theme-feijin.phase-one .battle-layout > .opponent-panel { flex-direction: column; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader {
    position: relative; width: 100%; height: 84px; min-height: 84px; max-height: 84px; padding: 0;
    border: 1px solid #b99e65; border-radius: 10px 2px; overflow: visible;
    background: linear-gradient(95deg,#294337f0,#0c201cf0); box-shadow: inset 0 0 0 3px #06180d66,0 3px 8px #0004;
  }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .battle-leader-art {
    display: block; position: absolute; inset: 2px auto 2px 4px; width: 62px; height: 78px;
    object-fit: contain; object-position: center; filter: drop-shadow(0 2px 3px #0007); mask-image: none;
  }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader > div { position: absolute; inset: 8px auto auto 77px; padding: 3px 7px; min-width: 54px; border: 1px solid #c5a570; border-radius: 5px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .role { display: none; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .health-line { display: flex; align-items: baseline; justify-content: center; gap: 2px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader strong { font: 700 23px/1 Georgia,serif; color: #ffe7c7; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-level { position: absolute; inset: auto auto 6px 75px; min-width: 34px; padding: 3px 5px; font-size: 10px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .evo { position: absolute; inset: auto auto 6px 115px; min-width: 32px; height: auto; padding: 3px 5px; font-size: 10px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-economy { position: absolute; inset: 6px 6px auto auto; width: min(52%,210px); padding: 5px 8px; gap: 2px; transform: none; border: 0; border-left: 1px solid #bda37166; border-radius: 0; background: none; box-shadow: none; text-align: left; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-balance { font-size: 17px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-next { font-size: 10px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-upgrades { inset: auto auto 4px 154px; width: 20px; height: 26px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-upgrades img { width: 18px; height: 24px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-skills { position: absolute; inset: auto 8px 4px auto; display: flex; gap: 6px; width: auto; }
  .theme-feijin.phase-one .battle-layout .phase1-skills button { width: 28px; height: 28px; border-radius: 50%; border: 1px solid #d4b878; padding: 0; background: radial-gradient(circle at 30% 25%,#58858c,#183f50); font: 600 17px/1 Georgia,serif; }
  .theme-feijin.phase-one .battle-layout .phase1-skills [data-leader-skill=dominion] { background: radial-gradient(circle at 30% 25%,#9e516a,#4f203b); }
  .theme-feijin.phase-one .battle-layout .hero.enemy .phase1-skills { display: none; }
  .theme-feijin.phase-one .battle-layout .chess-skills { inset: auto 6px 4px auto; gap: 4px; }
  .theme-feijin.phase-one .battle-layout .chess-skills button { padding: 4px 8px; font-size: 10px; }
  .theme-feijin.phase-one .battle-layout .board-row { display: flex; justify-content: flex-start; align-items: center; overflow-x: auto; gap: 8px; height: 132px; min-height: 132px; padding: 4px; scroll-snap-type: x proximity; }
  .theme-feijin.phase-one .battle-layout .board-row .card { flex: 0 0 80px; width: 80px; height: 120px; min-height: 120px; max-height: 120px; margin: 0; scroll-snap-align: start; }
  .theme-feijin.phase-one .battle-layout .board-row .empty-slot { flex: 0 0 80px; height: 118px; }
  .theme-feijin.phase-one .battle-layout #turnNotice { min-height: 0; height: auto; margin: 0; font-size: 11px; }
  .theme-feijin.phase-one .battle-layout #turnNotice:not(.is-action-notice) { display: none; }
  .theme-feijin.phase-one .battle-layout .hand-panel { min-height: 156px; padding: 0; border: 0; background: none; }
  .theme-feijin.phase-one .battle-layout .hand-row { --hand-card-height: 144px; height: 156px; min-height: 156px; flex-basis: 156px; padding: 6px 3px; overflow-x: auto; overflow-y: hidden; }
  .theme-feijin.phase-one .battle-layout .hand-row .card { height: 144px; max-height: 144px; flex: 0 0 96px; width: 96px; margin-left: 0; }
  .theme-feijin.phase-one .battle-layout > .deck-dock { position: sticky; bottom: 0; align-self: stretch; width: 100%; z-index: 10; display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 8px; background: linear-gradient(#12251fef,#081811); border-top: 1px solid #b79c62aa; }
  .theme-feijin.phase-one .battle-layout #endTurnButton { width: 62px; height: 62px; min-height: 62px; padding: 0; border-radius: 50%; font-size: 12px; margin-right: auto; }
  .theme-feijin.phase-one .battle-layout .deck-dock :is(.deck-pack,#phase1SpecialPileButton) { width: 43px; height: 63px; padding: 2px; min-width: 43px; }
  .theme-feijin.phase-one .battle-layout .deck-pack-back { display: none; }
  .theme-feijin.phase-one .battle-layout #phase1DiscardButton { width: 52px; padding: 5px; }
  .theme-feijin.phase-one .battle-layout .mulligan-panel { position: relative; inset: auto; width: 100%; padding: 8px 12px; }
  .theme-feijin.phase-one .battle-layout .mulligan-panel p { font-size: 11px; margin-block: 3px; }
}
@media(max-width:999px) {
  .theme-feijin.phase-one .battle-layout > .player-panel { flex-direction: column; }
  .theme-feijin.phase-one .battle-layout .board-row { width: 100%; min-width: 0; max-width: 100%; }
  .theme-feijin.phase-one .battle-layout :is(#playerEvo,#enemyEvo) { inset: auto auto 6px 115px; }
}
/* Landscape phones use both axes of the screen rather than stacking a tall portrait board. */
@media(min-width:560px) and (max-width:999px) and (max-height:550px) and (orientation:landscape) {
  .theme-feijin.phase-one .game-shell.battle-layout {
    display: grid; height: 100dvh; min-height: 380px; padding: 6px; gap: 4px 8px;
    grid-template-columns: 154px minmax(0,1fr) 72px; grid-template-rows: 26px minmax(106px,1fr) minmax(106px,1fr) 114px;
  }
  .theme-feijin.phase-one .battle-layout > .player-panel { display: contents; }
  .theme-feijin.phase-one .battle-layout .topbar { grid-area: 1 / 3; min-height: 26px; }
  .theme-feijin.phase-one .battle-layout .topbar .top-actions { gap: 4px; }
  .theme-feijin.phase-one .battle-layout .topbar button { width: 28px; height: 28px; padding: 6px; }
  .theme-feijin.phase-one .battle-layout .battle-status-strip { grid-area: 1 / 1 / 2 / 3; flex-wrap: nowrap; min-height: 0; padding: 0; overflow: hidden; }
  .theme-feijin.phase-one .battle-layout .turn-counter { font-size: 12px; padding: 3px 8px; flex-shrink: 0; }
  .theme-feijin.phase-one .battle-layout .battle-status-strip .trait-status { font-size: 9px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader { height: 100%; min-height: 0; max-height: none; }
  .theme-feijin.phase-one .battle-layout .hero.enemy { grid-area: 2 / 1; }
  .theme-feijin.phase-one .battle-layout .hero.player { grid-area: 3 / 1; }
  .theme-feijin.phase-one .battle-layout #enemyBoard { grid-area: 2 / 2; }
  .theme-feijin.phase-one .battle-layout #playerBoard { grid-area: 3 / 2; }
  .theme-feijin.phase-one .battle-layout .board-row { height: 100%; min-height: 0; padding: 2px; gap: 6px; }
  .theme-feijin.phase-one .battle-layout .board-row .card { width: 66px; height: 99px; min-height: 99px; flex-basis: 66px; }
  .theme-feijin.phase-one .battle-layout .board-row .empty-slot { height: 98px; flex-basis: 66px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .battle-leader-art { width: 54px; height: 66px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader > div { left: 68px; top: 5px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-level { inset: 37px auto auto 68px; }
  .theme-feijin.phase-one .battle-layout :is(#playerEvo,#enemyEvo) { inset: 37px auto auto 108px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-economy { inset: auto 4px 3px 4px; width: auto; border: 0; padding: 3px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-balance { font-size: 14px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-next { font-size: 9px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-skills { inset: auto auto -38px 3px; z-index: 4; }
  .theme-feijin.phase-one .battle-layout .hero .chess-skills { inset: auto auto -33px 0; z-index: 4; }
  .theme-feijin.phase-one .battle-layout > .hand-panel { grid-area: 4 / 2; min-height: 0; align-self: stretch; }
  .theme-feijin.phase-one .battle-layout .hand-row { --hand-card-height: 102px; height: 114px; min-height: 0; flex-basis: 114px; }
  .theme-feijin.phase-one .battle-layout .hand-row .card { width: 68px; height: 102px; max-height: 102px; flex-basis: 68px; }
  .theme-feijin.phase-one .battle-layout > .deck-dock { position: static; grid-area: 2 / 3 / 5 / 4; width: 72px; height: auto; padding: 4px; display: flex; flex-direction: column; justify-content: center; gap: 8px; border: 0; background: none; }
  .theme-feijin.phase-one .battle-layout #endTurnButton { margin: 0; width: 58px; height: 58px; min-height: 58px; font-size: 11px; }
  .theme-feijin.phase-one .battle-layout .log-panel { display: none; }
  .theme-feijin.phase-one .battle-layout .battle-emote-area { grid-area: 4 / 1; align-self: end; }
  .theme-feijin.phase-one .battle-layout .battle-details { display: none; }
  .theme-feijin.phase-one .battle-layout #turnNotice { grid-area: 2 / 2; align-self: start; z-index: 4; pointer-events: none; }
  .theme-feijin.phase-one .battle-layout .mulligan-panel:not(.hidden) { position: fixed; inset: auto auto 8px 8px; width: 154px; max-height: 145px; overflow: auto; z-index: 15; }
  .theme-feijin.phase-one .battle-layout .mulligan-panel p { display: none; }
}
.theme-feijin .journal-tabs button[aria-pressed=true] { background: var(--atelier-ruby); color: #f9e6b8; border-color: #c5a566; box-shadow: inset 0 -2px #dfc587; }
.theme-feijin .guide-flow { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 10px; }
.theme-feijin .guide-flow .flow-arrow { display: none; }
.theme-feijin .guide-flow .flow-step { min-width: 0; padding: 14px 10px; }
.theme-feijin :is(.sound-preference,.salon-preferences) input[type=checkbox] { appearance: none; position: relative; width: 42px; min-width: 42px; height: 24px; border: 1px solid #9f895b; border-radius: 14px; background: #071710; box-shadow: inset 0 2px 5px #0006; }
.theme-feijin :is(.sound-preference,.salon-preferences) input[type=checkbox]::after { content: ""; position: absolute; inset: 3px auto 3px 3px; width: 16px; border-radius: 50%; background: linear-gradient(#f4dc9e,#ae8e4c); box-shadow: 0 1px 4px #0007; transition: translate 150ms; }
.theme-feijin :is(.sound-preference,.salon-preferences) input[type=checkbox]:checked { background: #6b2e40; }
.theme-feijin :is(.sound-preference,.salon-preferences) input[type=checkbox]:checked::after { translate: 18px 0; }
@media(max-width:700px) { .theme-feijin .guide-flow { grid-template-columns:repeat(2,minmax(0,1fr)); }.theme-feijin .guide-flow .flow-step:last-child { grid-column:1/-1; } }
@media(min-width:560px) and (max-width:999px) and (max-height:550px) and (orientation:landscape) {
  .theme-feijin.phase-one .battle-layout .battle-details { display: block; grid-area: 4 / 1; align-self: center; z-index: 16; max-height: 100%; overflow: auto; }
  .theme-feijin.phase-one .battle-layout .battle-details > summary { padding: 5px 8px; font-size: 10px; }
  .theme-feijin.phase-one .battle-layout .battle-details[open] { background: #10221df5; }
  .theme-feijin.phase-one .battle-layout .hand-row .card-name { font-size: 8px; }
  .theme-feijin.phase-one .battle-layout .hand-row .cost { width: 20px; height: 20px; font-size: 12px; }
  .theme-feijin.phase-one .battle-layout .board-row .card .stats > span { width: 25px; height: 25px; min-width:25px;min-height:25px;font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { .theme-feijin input::after { transition: none; } }
.theme-feijin.salon-reduced-motion input::after { transition: none; }

/* Phones use a single landscape experience. The native dialog also blocks background input. */
html.phone-portrait, html.phone-portrait body { overflow: hidden; }
#mobileLandscapeGate:not([open]) { display: none; }
#mobileLandscapeGate[open] {
  position: fixed; inset: 0; box-sizing: border-box; margin: 0;
  width: 100vw; max-width: none; height: 100dvh; max-height: none;
  border: 0; border-radius: 0; padding: max(28px,env(safe-area-inset-top)) 28px max(28px,env(safe-area-inset-bottom));
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  color: #f6e7c3; background: radial-gradient(ellipse at 50% 35%,#294a38,#0c211a 65%,#07140f);
  font-family: "Songti SC", "STSong", serif; outline: none;
}
#mobileLandscapeGate::backdrop { background: #07140f; }
#mobileLandscapeGate h2 { font-size: 28px; letter-spacing: .12em; margin: 12px 0; }
#mobileLandscapeGate p { line-height: 1.8; margin: 8px 0; }
#mobileLandscapeGate .orientation-kicker { color: #cbb27b; font-size: 13px; letter-spacing: .35em; margin-top: 30px; }
#mobileLandscapeGate small { max-width: 260px; color: #b5baa8; line-height: 1.8; margin-top: 18px; font-family: system-ui,sans-serif; }
.rotate-device { width: 94px; height: 52px; border: 2px solid #d9be81; border-radius: 10px; padding: 5px; box-shadow: 0 0 32px #d0b97915; }
.rotate-device span { display: block; height: 100%; border: 1px solid #cdb57b55; border-radius: 4px; background: linear-gradient(145deg,#d0ba8120,transparent); }
@media(min-width:560px) and (max-width:999px) and (max-height:380px) and (orientation:landscape) {
  .theme-feijin.phase-one .game-shell.battle-layout { min-height: 320px; grid-template-rows: 24px minmax(86px,1fr) minmax(86px,1fr) 88px; }
  .theme-feijin.phase-one .battle-layout .board-row .card { width: 56px; height: 84px; min-height: 84px; max-height: 84px; flex-basis: 56px; }
  .theme-feijin.phase-one .battle-layout .board-row .empty-slot { height: 82px; flex-basis: 56px; }
  .theme-feijin.phase-one .battle-layout .hand-row { --hand-card-height: 82px; height: 88px; flex-basis: 88px; padding-block: 2px; }
  .theme-feijin.phase-one .battle-layout .hand-row .card { width: 55px; height: 82px; max-height: 82px; flex-basis: 55px; }
  .theme-feijin.phase-one .battle-layout .hero.has-deck-leader .phase1-next { font-size: 8px; }
}
@media(min-width:560px) and (max-width:999px) and (max-height:550px) and (orientation:landscape) {
  .theme-feijin.phase-one .game-shell.battle-layout { padding-left: max(6px,env(safe-area-inset-left)); padding-right: max(6px,env(safe-area-inset-right)); }
}
.theme-feijin .result-panel:is(.win,.lose,.draw) { animation: crown-result-enter 240ms ease-out both; }
@keyframes crown-result-enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media(prefers-reduced-motion:reduce) { .theme-feijin .result-panel:is(.win,.lose,.draw) { animation: none; } }
.theme-feijin.salon-reduced-motion .result-panel:is(.win,.lose,.draw) { animation: none; }
