.er-plan {
    --er-ink: #243c32;
    --er-muted: #66736a;
    --er-green: #19362e;
    --er-paper: #f6f2e9;
    --er-line: #dcded3;
    margin: 0;
    background: var(--er-paper);
    color: var(--er-ink);
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    line-height: 1.8;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.er-plan *, .er-plan *::before, .er-plan *::after { box-sizing: border-box; }
.er-plan [hidden] { display: none !important; }
.er-plan a { color: inherit; text-underline-offset: 4px; }
.er-plan button { font: inherit; }
.er-plan :focus-visible { outline: 3px solid #bc6b22; outline-offset: 5px; }
.er-plan h1, .er-plan h2, .er-plan h3, .er-plan h4, .er-plan p, .er-plan figure { margin: 0; }
.er-plan p + p { margin-top: 16px; }
.er-skip { position: fixed; z-index: 10; top: -100px; left: 16px; padding: 12px 20px; background: #fff; }
.er-skip:focus { top: 12px; }
.er-topbar { min-height: 80px; padding: 16px max(24px, calc((100% - 1240px) / 2)); display: flex; justify-content: space-between; align-items: center; gap: 20px; border-bottom: 1px solid var(--er-line); }
.er-brand { text-decoration: none; font-size: 18px; font-weight: 850; letter-spacing: -.4px; }
.er-brand span { padding-left: 10px; font-size: 11px; color: var(--er-muted); font-weight: 600; letter-spacing: 1.5px; }
.er-top-actions { display: flex; align-items: center; gap: 20px; }
.er-top-actions > span { font-size: 10px; letter-spacing: 1.8px; color: var(--er-muted); }
.er-top-actions button { min-height: 44px; padding: 7px 16px; color: var(--er-ink); border: 1px solid #c5ccbf; border-radius: 5px; background: transparent; cursor: pointer; font-size: 12px; font-weight: 650; }
.er-top-actions button:hover { background: #e8ecdf; }
.er-page { max-width: 1288px; padding: 32px 24px 0; margin: 0 auto; }
.er-plan .er-current-title { margin: 14px 0 24px; font-size: clamp(32px, 4vw, 48px); line-height: 1.3; letter-spacing: -1.4px; }
.er-plan .er-current-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0; }
.er-plan .er-current-nav a { padding: 6px 12px; border: 1px solid var(--er-line); border-radius: 4px; font-size: 13px; }
.er-hero { position: relative; display: grid; grid-template-columns: 1.3fr 1fr; padding: 56px 56px 0; overflow: hidden; color: #f5f1dc; background: radial-gradient(ellipse at 84% 45%, #345346 0, transparent 48%), #19362e; border-radius: 10px; }
.er-eyebrow { font-size: 11px; font-weight: 650; letter-spacing: 2.6px; color: #c7cdb5; }
.er-hero h2 { margin-top: 22px; font-size: clamp(44px, 5.5vw, 70px); letter-spacing: -3px; line-height: 1.1; font-weight: 800; }
.er-hero h2 span { display: block; margin-top: 14px; font-size: 15px; font-weight: 450; letter-spacing: 6px; }
.er-hero .er-tagline { margin-top: 36px; font-size: 25px; line-height: 1.5; font-weight: 550; letter-spacing: -.7px; }
.er-hero .er-hero-description { margin-top: 18px; font-size: 14px; line-height: 1.9; color: #ced6c7; }
.er-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 25px; }
.er-badges span { border: 1px solid #678170; padding: 3px 10px; border-radius: 3px; font-size: 11px; color: #d9dfcb; }
.er-play-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 22px; padding: 0 18px; border: 1px solid #efc57c; border-radius: 4px; background: #eab971; color: #243526; font-size: 13px; font-weight: 800; text-decoration: none; }
.er-play-link:hover, .er-play-link:focus-visible { background: #f9d49b; color: #1b2e20; }
.er-hero-art { min-height: 345px; position: relative; display: grid; place-items: center; }
.er-orbit { position: absolute; left: 50%; top: 46%; aspect-ratio: 1; border: 1px solid #76907c40; transform: translate(-50%, -50%) rotate(45deg); }
.er-orbit-one { width: 240px; }
.er-orbit-two { width: 302px; border-style: dashed; }
.er-hero-art::before { content: ""; position: absolute; top: 46%; left: 50%; width: 250px; height: 250px; transform: translate(-50%, -50%); background: radial-gradient(ellipse, #e9a45a30, transparent 68%); }
.er-lantern { position: relative; width: 128px; margin-top: -16px; filter: drop-shadow(0 14px 22px #0b231b); }
.er-lantern-handle { width: 60px; height: 48px; margin: 0 auto; border: 7px solid #96a785; border-bottom: 0; border-radius: 24px 24px 0 0; }
.er-lantern-cap { height: 24px; border-top: 8px solid #bdc4a0; background: #6b8066; box-shadow: 0 7px 0 #152e25; }
.er-lantern-glass { position: relative; height: 145px; margin: 7px 9px 0; border-left: 11px solid #90a182; border-right: 11px solid #6b8066; background: linear-gradient(90deg, #bd7b32a6, #f8c676ba, #bd7b3270); box-shadow: inset 0 0 26px #fcca7470; }
.er-lantern-glass::before { content: ""; position: absolute; inset: 12px 10px auto; height: 22px; border-top: 3px solid #ffda90a6; border-left: 3px solid #ffda90a6; }
.er-flame { position: absolute; left: calc(50% - 17px); bottom: 20px; width: 34px; height: 51px; background: #ffe9a1; border-radius: 70% 20% 55% 45%; transform: rotate(-6deg); box-shadow: 0 0 30px #ffd47b, inset 3px -12px 0 #ed9d4e; }
.er-lantern-foot { height: 24px; border-top: 8px solid #a9b595; background: #596f57; }
.er-art-caption { position: absolute; bottom: 20px; color: #b8c6ac; font-size: 10px; letter-spacing: 2.6px; }
.er-document-line { grid-column: 1 / -1; margin-top: 36px; padding: 18px 0; display: flex; justify-content: space-between; gap: 8px 18px; border-top: 1px solid #67817060; font-size: 11px; color: #bcc9b6; }
.er-facts { display: grid; grid-template-columns: repeat(4, 1fr); padding: 25px 0; margin-bottom: 36px; border-bottom: 1px solid var(--er-line); }
.er-facts > div { padding: 0 24px; border-right: 1px solid var(--er-line); }
.er-facts > div:first-child { padding-left: 0; }
.er-facts > div:last-child { border: 0; }
.er-facts span, .er-facts strong, .er-facts small { display: block; }
.er-facts span { color: var(--er-muted); font-size: 12px; }
.er-facts strong { font-size: 23px; line-height: 1.4; margin: 8px 0 4px; letter-spacing: -.8px; }
.er-facts small { font-size: 11px; color: var(--er-muted); }
.er-document { display: grid; grid-template-columns: 188px minmax(0, 1fr); gap: 60px; }
.er-sidebar { position: sticky; top: 28px; align-self: start; padding-top: 28px; }
.er-sidebar nav > p { font-size: 10px; font-weight: 700; letter-spacing: 2px; color: var(--er-muted); margin-bottom: 12px; }
.er-sidebar nav a { display: flex; align-items: center; gap: 10px; min-height: 40px; text-decoration: none; color: #526157; font-size: 13px; border-bottom: 1px solid transparent; }
.er-sidebar nav a:hover { color: #955a22; border-bottom-color: #d4bc99; }
.er-sidebar nav a span { font-size: 10px; color: #738174; }
.er-sidebar-note { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--er-line); color: var(--er-muted); font-size: 11px; }
.er-sidebar-note strong { display: block; margin: 7px 0; color: var(--er-ink); font-size: 12px; }
.er-sidebar-note span { display: block; line-height: 1.75; }
.er-sections { min-width: 0; }
.er-section { padding: 48px 0 55px; border-bottom: 1px solid var(--er-line); scroll-margin-top: 25px; }
.er-section:first-child { padding-top: 24px; }
.er-section:last-child { border: 0; }
.er-section-index { font-size: 11px; font-weight: 650; letter-spacing: 2px; color: #8b632e; }
.er-section h2 { margin: 14px 0 24px; font-size: clamp(29px, 3vw, 39px); line-height: 1.35; letter-spacing: -1.4px; }
.er-section h3 { font-size: 20px; line-height: 1.5; margin: 30px 0 12px; letter-spacing: -.5px; }
.er-section h4 { font-size: 16px; line-height: 1.5; }
.er-section > p { color: #4c5b51; }
.er-section > .er-section-index { color: #8b632e; }
.er-section .er-lead { font-size: 18px; line-height: 1.9; color: #344d3f; }
.er-section .er-note { font-size: 13px; color: #667263; border-left: 2px solid #afbaa4; padding-left: 15px; margin-top: 22px; }
.er-callout { margin: 26px 0; padding: 24px 28px; background: #e6eadc; border-left: 3px solid #697e56; border-radius: 0 6px 6px 0; }
.er-callout > strong { display: block; font-size: 12px; color: #546946; margin-bottom: 7px; }
.er-callout > p { line-height: 1.8; font-size: 17px; color: #2f4736; }
.er-two, .er-three { display: grid; gap: 16px; margin: 22px 0; }
.er-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.er-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.er-card { padding: 22px; border: 1px solid #d5dacd; background: #faf8f2; border-radius: 6px; }
.er-card-number { display: inline-block; color: #897246; font-size: 12px; font-weight: 650; margin-bottom: 18px; }
.er-card h3 { font-size: 17px; margin: 0 0 12px; }
.er-card h4 { margin-bottom: 10px; }
.er-card p { color: #5a675a; font-size: 14px; line-height: 1.85; }
.er-card .er-mini-label { font-size: 10px; color: #887345; letter-spacing: 2px; margin-bottom: 15px; }
.er-list { margin: 20px 0; padding-left: 22px; color: #4c5b51; }
.er-list li { padding-left: 3px; margin: 9px 0; }
.er-list li::marker { color: #7a865f; font-weight: 650; }
.er-example { margin: 24px 0; padding: 20px 24px; background: #eee6d5; border-radius: 5px; }
.er-example > strong { display: block; font-size: 12px; color: #855b23; margin-bottom: 6px; }
.er-example p { color: #65543b; font-size: 14px; line-height: 1.85; }
.er-table-wrap { overflow-x: auto; margin: 24px 0; border: 1px solid #d5dacd; border-radius: 6px; background: #fbfaf5; }
.er-table-wrap table { width: 100%; min-width: 590px; border-collapse: collapse; text-align: left; font-size: 13px; line-height: 1.75; }
.er-table-wrap th, .er-table-wrap td { padding: 14px 17px; border-bottom: 1px solid #e1e3d9; vertical-align: top; }
.er-table-wrap thead th { background: #e8ece0; color: #526147; font-size: 12px; font-weight: 700; }
.er-table-wrap tbody th { min-width: 100px; font-weight: 650; color: #334b3c; }
.er-table-wrap td { color: #576353; }
.er-table-wrap tr:last-child > * { border-bottom: 0; }
.er-run-flow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 0; margin: 26px 0; list-style: none; counter-reset: run; border: 1px solid #cbd4c3; border-radius: 6px; overflow: hidden; }
.er-run-flow li { position: relative; padding: 18px 14px; border-right: 1px solid #cbd4c3; background: #edf0e5; counter-increment: run; }
.er-run-flow li:last-child { border: 0; }
.er-run-flow li::before { content: "0" counter(run); color: #718066; font-size: 10px; letter-spacing: 1px; display: block; margin-bottom: 10px; }
.er-run-flow strong { font-size: 15px; }
.er-run-flow span { display: block; margin-top: 7px; font-size: 12px; line-height: 1.6; color: #627157; }
.er-combat-example { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.15fr); gap: 28px; align-items: start; margin: 28px 0; }
.er-combat-example h3 { margin-top: 0; }
.er-combat-example p { font-size: 14px; }
.er-board-figure { padding: 20px; background: #e9eddf; border: 1px solid #ced8c2; border-radius: 6px; }
.er-board { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; }
.er-board > span { display: flex; justify-content: center; align-items: center; aspect-ratio: 1; background: #d2dac5; border: 1px solid #c2cfb4; border-radius: 3px; font-size: 17px; font-weight: 800; }
.er-board .er-wall { background: #6f7e66; color: #fafaf2; border-color: #617657; font-size: 10px; }
.er-board .er-danger { background: repeating-linear-gradient(135deg, #edd0ba 0 4px, #f5ddc7 4px 8px); color: #8c362c; border-color: #cc9180; }
.er-board .er-player { color: #fff8d8; background: #315541; border-color: #234930; box-shadow: inset 0 0 0 2px #e9bb6b; }
.er-board .er-enemy { background: #a94037; color: #fff6e7; border-color: #8d3930; }
.er-board .er-safe { background: #f8f4d9; color: #315541; border: 2px dashed #819363; }
.er-board-figure figcaption { margin-top: 14px; color: #5b6e4c; font-size: 10px; line-height: 1.8; }
.er-build-grid { display: grid; gap: 14px; margin: 26px 0; }
.er-build { border: 1px solid #cdd5c5; border-left: 4px solid #9d7040; border-radius: 0 6px 6px 0; padding: 22px 26px; background: #faf8f1; }
.er-build:nth-child(2) { border-left-color: #6e8b70; }
.er-build:nth-child(3) { border-left-color: #738c93; }
.er-build > span { color: #8b632e; font-size: 10px; font-weight: 700; letter-spacing: 1.6px; }
.er-build h3 { margin: 6px 0 10px; font-size: 22px; }
.er-build .er-build-kit { font-size: 12px; font-weight: 650; color: #758060; margin-bottom: 12px; }
.er-build p { color: #52614f; font-size: 14px; }
.er-build small { display: block; margin-top: 12px; font-size: 12px; color: #7b6344; }
.er-wireframe { margin: 28px 0; padding: 16px; border: 1px solid #bbc8b0; background: #e6ecdf; border-radius: 6px; font-size: 12px; text-align: center; }
.er-wire-hud, .er-wire-actions { display: flex; justify-content: space-between; gap: 7px; flex-wrap: wrap; }
.er-wire-hud span { padding: 9px 10px; background: #f5f6ec; flex-grow: 1; border: 1px solid #ccd5c3; }
.er-wire-middle { display: grid; grid-template-columns: 2fr 1fr; gap: 10px; margin: 10px 0; }
.er-wire-middle > div, .er-wire-middle > aside { min-height: 160px; padding: 24px 12px; display: flex; flex-direction: column; justify-content: center; background: #cdd9c4; border: 1px dashed #8ea080; font-size: 18px; font-weight: 650; }
.er-wire-middle > aside { background: #f1f2e8; font-size: 12px; text-align: left; }
.er-wire-middle small { display: block; margin-top: 12px; font-size: 11px; font-weight: 400; color: #59704f; }
.er-wire-actions > span, .er-wire-actions > strong { flex-grow: 1; padding: 10px 12px; border: 1px solid #c5d0ba; background: #f3f4eb; }
.er-wire-actions > strong { color: #f7f4e6; background: #345640; border-color: #345640; }
.er-palette { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 24px 0; }
.er-palette > span { display: flex; min-height: 98px; align-items: flex-end; padding: 12px; font-size: 10px; border-radius: 5px; }
.er-color-forest { background: #19362e; color: #f6f2e9; }
.er-color-ember { background: #e9a45a; color: #442e19; }
.er-color-paper { background: #f6f2e9; color: #415241; border: 1px solid #cbd1c1; }
.er-color-danger { background: #a94037; color: #fff4e6; }
.er-asset-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); gap: 12px; margin: 24px 0; }
.er-asset-gallery figure { overflow: hidden; border: 1px solid #cdd5c5; border-radius: 6px; background: #faf8f1; break-inside: avoid; }
.er-asset-stage { min-height: 120px; display: flex; align-items: center; justify-content: center; background: radial-gradient(ellipse at bottom, #3c5040, #1c2924); }
.er-asset-gallery figcaption { padding: 12px; font-size: 13px; font-weight: 650; }
.er-asset-gallery small { display: block; margin-top: 4px; color: #63715e; font-size: 10px; font-weight: 400; }
.er-asset-sprite { display: block; flex-shrink: 0; width: 32px; height: 32px; image-rendering: pixelated; background-image: url("assets/0x72/0x72_DungeonTilesetII_v1.7.png"); background-size: 1024px 1024px; background-position: var(--er-sprite-x) var(--er-sprite-y); animation: er-asset-idle .8s steps(4, end) infinite; }
.er-asset-knight { height: 56px; --er-sprite-x: -256px; --er-sprite-end: -384px; --er-sprite-y: -200px; }
.er-asset-slug { --er-sprite-x: -864px; --er-sprite-end: -992px; --er-sprite-y: -752px; }
.er-asset-skeleton { --er-sprite-x: -736px; --er-sprite-end: -864px; --er-sprite-y: -176px; }
.er-asset-orc { height: 46px; --er-sprite-x: -736px; --er-sprite-end: -864px; --er-sprite-y: -354px; }
.er-asset-boss { width: 64px; height: 72px; --er-sprite-x: -32px; --er-sprite-end: -288px; --er-sprite-y: -664px; }
.er-asset-floor { --er-sprite-x: -32px; --er-sprite-y: -128px; animation: none; }
@keyframes er-asset-idle { to { background-position: var(--er-sprite-end) var(--er-sprite-y); } }
@media (prefers-reduced-motion: reduce) { .er-asset-sprite { animation: none; } }
.er-roadmap { padding: 0; margin: 30px 0; list-style: none; }
.er-roadmap > li { display: flex; gap: 20px; padding: 23px 0; border-bottom: 1px solid var(--er-line); }
.er-roadmap > li:first-child { padding-top: 0; }
.er-roadmap > li:last-child { border-bottom: 0; }
.er-roadmap > li > span { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid #bdc9b2; border-radius: 50%; color: #6a7c5d; font-size: 12px; }
.er-roadmap .er-roadmap-done > span { color: #f7f5e7; background: #345640; border-color: #345640; }
.er-roadmap small { display: inline-block; font-size: 10px; color: #856336; background: #ebe3d0; border-radius: 3px; padding: 2px 7px; }
.er-roadmap .er-roadmap-done small { background: #e0e9d8; color: #3e633a; }
.er-roadmap h3 { margin: 8px 0; font-size: 19px; }
.er-roadmap p { color: #5c6a55; font-size: 14px; }
.er-next { margin-top: 35px; padding: 28px; color: #f5f3e2; background: #284638; border-radius: 6px; }
.er-next > span { display: block; font-size: 10px; letter-spacing: 2px; color: #d9be85; }
.er-next > strong { display: block; margin-top: 9px; font-size: 22px; line-height: 1.5; }
.er-next p { color: #ccd7c4; font-size: 14px; margin-top: 10px; }
.er-next a { display: inline-flex; min-height: 44px; align-items: center; margin-top: 15px; font-size: 12px; color: #f1d49b; }
.er-footer { display: flex; justify-content: space-between; gap: 15px; padding: 25px 0 35px; border-top: 1px solid var(--er-line); color: #718067; font-size: 10px; letter-spacing: 1px; }
.er-footer a { font-size: 12px; letter-spacing: 0; }

@media (max-width: 1050px) {
    .er-document { grid-template-columns: 166px minmax(0, 1fr); gap: 34px; }
    .er-hero { padding: 42px 38px 0; }
    .er-three { grid-template-columns: 1fr; }
    .er-card-number { margin-bottom: 7px; }
    .er-card .er-mini-label { margin-bottom: 7px; }
    .er-facts strong { font-size: 21px; }
}

@media (max-width: 800px) {
    .er-top-actions > span { display: none; }
    .er-hero { grid-template-columns: 1.4fr 1fr; padding: 36px 30px 0; }
    .er-hero-art { min-height: 300px; }
    .er-lantern { transform: scale(.8); }
    .er-orbit-one { width: 180px; }
    .er-orbit-two { width: 226px; }
    .er-art-caption { font-size: 8px; letter-spacing: 1.5px; }
    .er-document { display: block; }
    .er-sidebar { position: static; padding: 0 0 24px; border-bottom: 1px solid var(--er-line); }
    .er-sidebar nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 16px; }
    .er-sidebar nav > p { grid-column: 1 / -1; }
    .er-sidebar-note { display: none; }
    .er-section:first-child { padding-top: 38px; }
    .er-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .er-facts { margin-bottom: 25px; }
    .er-facts > div { padding: 0 14px; }
    .er-facts strong { font-size: 19px; }
    .er-facts small { font-size: 10px; }
}

@media (max-width: 580px) {
    .er-plan { font-size: 15px; }
    .er-topbar { padding: 12px 18px; min-height: 68px; gap: 10px; }
    .er-brand { font-size: 16px; }
    .er-brand span { display: none; }
    .er-page { padding: 18px 16px 0; }
    .er-hero { display: block; padding: 30px 24px 0; }
    .er-eyebrow { font-size: 9px; }
    .er-hero h2 { font-size: 49px; letter-spacing: -2px; }
    .er-hero h2 span { font-size: 11px; letter-spacing: 5px; }
    .er-hero .er-tagline { font-size: 22px; margin-top: 27px; }
    .er-hero .er-hero-description { font-size: 13px; }
    .er-desktop-break { display: none; }
    .er-badges { gap: 5px; margin-top: 22px; }
    .er-badges span { padding: 3px 8px; font-size: 10px; }
    .er-hero-art { height: 230px; min-height: 0; margin-top: 8px; }
    .er-lantern { transform: scale(.64); margin-top: -20px; }
    .er-orbit-one { width: 154px; }
    .er-orbit-two { width: 192px; }
    .er-art-caption { bottom: 8px; }
    .er-document-line { margin-top: 12px; padding: 16px 0; flex-direction: column; font-size: 10px; }
    .er-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 0; padding: 22px 0; }
    .er-facts > div:nth-child(odd) { padding-left: 0; }
    .er-facts > div:nth-child(even) { border: 0; }
    .er-facts strong { font-size: 21px; }
    .er-sidebar nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
    .er-sidebar nav a { font-size: 12px; min-height: 44px; gap: 7px; }
    .er-section { padding: 38px 0 42px; }
    .er-section h2 { font-size: 28px; letter-spacing: -1px; }
    .er-section-index { font-size: 10px; }
    .er-section .er-lead { font-size: 16px; }
    .er-callout { padding: 20px; }
    .er-callout > p { font-size: 15px; }
    .er-two, .er-three { grid-template-columns: 1fr; gap: 12px; }
    .er-card { padding: 20px; }
    .er-table-wrap table { font-size: 12px; }
    .er-table-wrap th, .er-table-wrap td { padding: 12px; }
    .er-run-flow { grid-template-columns: 1fr; }
    .er-run-flow li { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 12px; padding: 13px 16px; border: 0; border-bottom: 1px solid #cbd4c3; }
    .er-run-flow li::before { margin: 0; }
    .er-run-flow span { margin: 0; font-size: 11px; }
    .er-combat-example { grid-template-columns: 1fr; gap: 24px; }
    .er-board-figure { max-width: 360px; width: 100%; margin: 0 auto; }
    .er-build { padding: 20px; }
    .er-build h3 { font-size: 20px; }
    .er-wireframe { padding: 10px; }
    .er-wire-middle { grid-template-columns: 1fr; }
    .er-wire-middle > aside { min-height: 0; padding: 12px; }
    .er-wire-middle > aside small { margin-top: 6px; }
    .er-wire-hud span { padding: 8px; font-size: 11px; }
    .er-wire-actions > span, .er-wire-actions > strong { padding: 8px 10px; font-size: 11px; }
    .er-palette { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .er-palette > span { min-height: 86px; }
    .er-roadmap > li { gap: 14px; }
    .er-roadmap > li > span { width: 33px; height: 33px; font-size: 11px; }
    .er-roadmap h3 { font-size: 18px; }
    .er-next { padding: 24px; }
    .er-next > strong { font-size: 19px; }
    .er-footer { flex-direction: column; gap: 6px; }
}

@media print {
    .er-asset-sprite { animation: none; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    @page { size: A4; margin: 15mm; }
    .er-plan { background: #fff; color: #172c21; font-size: 10pt; line-height: 1.6; }
    .er-topbar, .er-sidebar, .er-hero-art, .er-skip, .er-next a, .er-footer a { display: none; }
    .er-page { padding: 0; max-width: none; }
    .er-hero { display: block; background: #fff; color: #172c21; border: 1px solid #aab5a1; border-radius: 0; padding: 18pt; }
    .er-hero h2 { font-size: 32pt; }
    .er-hero .er-tagline { font-size: 16pt; margin-top: 18pt; }
    .er-hero .er-hero-description, .er-eyebrow, .er-badges span, .er-document-line { color: #344d3c; }
    .er-badges span { border-color: #b7c2ad; }
    .er-document-line { margin-top: 16pt; padding-bottom: 0; border-top-color: #aab5a1; }
    .er-facts { grid-template-columns: repeat(4, 1fr); margin-bottom: 12pt; }
    .er-facts > div { padding: 0 10pt; }
    .er-facts strong { font-size: 13pt; }
    .er-facts small { font-size: 7pt; }
    .er-document { display: block; }
    .er-section { padding: 20pt 0; scroll-margin: 0; }
    .er-section h2 { font-size: 23pt; break-after: avoid; }
    .er-section h3, .er-section h4, .er-section-index { break-after: avoid; }
    .er-section .er-lead { font-size: 12pt; }
    .er-section p, .er-section li { orphans: 3; widows: 3; }
    .er-table-wrap { overflow: visible; }
    .er-table-wrap table { min-width: 0; font-size: 9pt; }
    .er-table-wrap th, .er-table-wrap td { padding: 8pt; }
    .er-table-wrap thead { display: table-header-group; }
    .er-table-wrap tr, .er-card, .er-build, .er-example, .er-callout, .er-board-figure, .er-wireframe, .er-roadmap > li, .er-next { break-inside: avoid; }
    .er-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .er-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .er-card { padding: 12pt; }
    .er-card p, .er-build p, .er-example p, .er-roadmap p { font-size: 9pt; }
    .er-card h3 { font-size: 12pt; }
    .er-combat-example { grid-template-columns: 1fr 1.2fr; }
    .er-wire-middle { grid-template-columns: 2fr 1fr; }
    .er-palette { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .er-board, .er-palette, .er-next { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    .er-next { background: #edf1e7; color: #243c32; }
    .er-next > span, .er-next p { color: #48613e; }
}
