:root { color-scheme: dark; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
body { background: #100b12; color: #fff6e8; font-family: ui-rounded, "Hiragino Maru Gothic ProN", "Yu Gothic", sans-serif; }
.game-root { position: relative; width: 100%; height: 100%; overflow: hidden; }
canvas { display: block; width: 100%; height: 100%; image-rendering: pixelated; image-rendering: crisp-edges; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.action-hint { position: absolute; left: 50%; bottom: 26px; z-index: 5; display: flex; align-items: center; gap: 9px; padding: 7px 13px 7px 8px; border: 1px solid #d7ae7477; border-radius: 20px; background: #171019e8; color: #e9d4ba; font-size: 11px; opacity: 0; transform: translate(-50%, 10px); transition: opacity 120ms ease, transform 120ms ease; pointer-events: none; }
.action-hint.is-visible { opacity: 1; transform: translate(-50%, 0); }
.action-hint kbd { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid #e0b87899; border-radius: 50%; background: #653848; color: #fff1d9; font: 800 11px/1 inherit; box-shadow: inset 0 -2px 0 #1b0f16aa; }
.field-dialogue { position: absolute; left: 50%; bottom: clamp(18px, 4vh, 42px); z-index: 8; display: grid; grid-template-columns: clamp(125px, 18vw, 210px) minmax(0, 650px); align-items: end; width: min(900px, calc(100% - 40px)); opacity: 0; visibility: hidden; transform: translate(-50%, 18px); transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease; pointer-events: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.field-dialogue.is-visible { opacity: 1; visibility: visible; transform: translate(-50%, 0); pointer-events: auto; }
.field-dialogue.is-switching { transition: none; }
.dialogue-portrait { position: relative; z-index: 2; aspect-ratio: .88; align-self: end; overflow: hidden; border: 1px solid #d8ad7190; border-radius: 11px 11px 4px 28px; background: #531f30; box-shadow: 0 15px 30px #0008; }
.dialogue-portrait::after { content: ""; position: absolute; inset: 0; border: 5px solid #1a1018aa; border-radius: inherit; pointer-events: none; }
.dialogue-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; pointer-events: none; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; }
.dialogue-window { position: relative; min-height: 138px; margin-left: -5px; padding: 23px 54px 24px 35px; border: 1px solid #d3a86f99; border-radius: 5px 15px 15px 5px; background: linear-gradient(135deg, #311b27f5, #140f17fa 74%); box-shadow: 0 15px 45px #000a, inset 0 0 36px #9c583119; }
.dialogue-window::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 2px; background: linear-gradient(transparent, #e2b87b, transparent); }
.dialogue-window header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 13px; }
.dialogue-window header span { color: #d4a66a; font: 800 9px/1 monospace; letter-spacing: .2em; }
.dialogue-window header strong { color: #f2dec7; font: 600 15px/1 "Yu Mincho", serif; letter-spacing: .1em; }
.dialogue-window p { min-height: 2.9em; margin: 0; color: #eadfd5; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: clamp(13px, 1.7vw, 16px); line-height: 1.9; letter-spacing: .035em; }
.dialogue-dismiss { position: absolute; right: 13px; top: 12px; width: 27px; height: 27px; border: 1px solid #c79d6850; border-radius: 50%; background: #100b11a6; color: #ad939d; cursor: pointer; }
.dialogue-dismiss:hover, .dialogue-dismiss:focus-visible { border-color: #e0b778; color: #f3ddc1; outline: none; }
.dialogue-advance { position: absolute; right: 19px; bottom: 15px; color: #e5bc7a; font-size: 9px; font-style: normal; animation: dialogue-pulse 900ms ease-in-out infinite alternate; }
@keyframes dialogue-pulse { to { opacity: .35; transform: translateY(3px); } }
.player-peek { position: absolute; top: 18px; right: 18px; z-index: 7; display: grid; justify-items: center; width: 186px; padding: 5px 5px 7px; border: 1px solid #d5ad7470; border-radius: 10px 10px 22px 10px; background: linear-gradient(145deg, #321b28ee, #120d14ee); box-shadow: 0 10px 28px #0009; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity 130ms ease, transform 130ms ease, visibility 130ms ease; pointer-events: none; }
.player-peek.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.player-peek canvas { display: block; width: 176px; height: 124px; border-radius: 6px 6px 12px 6px; image-rendering: pixelated; }
.player-peek span { width: 100%; padding-top: 5px; border-top: 1px solid #d2a46b38; color: #dfc9b1; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-align: center; }
.object-discovery { display: none; position: absolute; top: max(58px, calc(env(safe-area-inset-top) + 50px)); right: max(10px, env(safe-area-inset-right)); z-index: 7; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 8px; width: min(158px, calc(100% - 20px)); min-height: 52px; padding: 5px 9px 5px 5px; border: 1px solid #d4aa6d80; border-radius: 10px; background: linear-gradient(135deg, #261721f2, #100c12f5); box-shadow: 0 8px 22px #0008; opacity: 0; visibility: hidden; pointer-events: none; }
.object-discovery.is-visible { opacity: 1; visibility: visible; }
.object-discovery.is-dialogue-offset { top: max(106px, calc(env(safe-area-inset-top) + 98px)); }
.object-discovery-thumb { display: grid; place-items: center; width: 42px; height: 42px; overflow: hidden; border: 1px solid #c6965c55; border-radius: 7px; background: #0b080ccc; }
.object-discovery-thumb img { width: 38px; height: 38px; object-fit: contain; image-rendering: pixelated; }
.object-discovery > div:last-child { min-width: 0; }
.object-discovery small, .object-discovery strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.object-discovery small { display: flex; align-items: center; gap: 4px; margin-bottom: 4px; color: #b79b88; font-size: 8px; }
.object-discovery-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.object-discovery-direction { flex: 0 0 auto; color: #e7bb76; font-size: 9px; font-style: normal; transform: rotate(var(--direction-angle, 0deg)); }
.object-discovery strong { display: block; }
.object-discovery strong { color: #f0dfca; font-size: 10px; font-weight: 600; }
.game-menu { position: absolute; inset: 0; z-index: 10; display: grid; place-items: center; padding: clamp(14px, 4vw, 48px); background: #09070cbb; backdrop-filter: blur(4px); opacity: 0; visibility: hidden; transition: opacity 140ms ease, visibility 140ms ease; }
.game-menu.is-open { opacity: 1; visibility: visible; }
.menu-window { width: min(920px, 100%); border: 1px solid #d4a86699; border-radius: 16px; overflow: hidden; background: linear-gradient(145deg, #2d1a24f5, #130f18f8 68%); box-shadow: 0 24px 90px #000c, inset 0 0 40px #a85d2812; }
.menu-header { display: flex; align-items: center; gap: 14px; min-height: 88px; padding: 18px 24px; border-bottom: 1px solid #d2a46b55; background: linear-gradient(90deg, #4a2933bb, transparent 70%); }
.menu-header p, .profile-role { margin: 0 0 3px; color: #daa96d; font-size: 11px; font-weight: 800; letter-spacing: .22em; }
.menu-header h1 { margin: 0; font-family: Georgia, "Yu Mincho", serif; font-size: clamp(22px, 3vw, 31px); font-weight: 500; letter-spacing: .12em; }
.menu-crest { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #d4a86699; border-radius: 50%; color: #efc27d; font-size: 24px; box-shadow: inset 0 0 18px #d18b4533; }
.menu-close { margin-left: auto; width: 44px; height: 44px; border: 1px solid #d4a86688; border-radius: 50%; background: #160f17aa; color: #f2dbc0; font: 700 14px/1 inherit; cursor: pointer; }
.menu-close:hover, .menu-close:focus-visible { background: #75404f; outline: 2px solid #efc27d; outline-offset: 2px; }
.menu-body { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(260px, .8fr); gap: clamp(18px, 4vw, 40px); padding: clamp(20px, 4vw, 38px); }
.profile-card { display: grid; grid-template-columns: minmax(150px, 240px) 1fr; gap: clamp(18px, 3vw, 30px); align-items: center; }
.portrait-frame { position: relative; aspect-ratio: 1; padding: 7px; border: 1px solid #e0b67399; border-radius: 10px 10px 34px 10px; background: #dcb06e1a; box-shadow: 0 13px 30px #0008; }
.portrait-frame::after { content: "✦"; position: absolute; right: -12px; bottom: -13px; display: grid; place-items: center; width: 39px; height: 39px; border: 1px solid #d8ad6f; border-radius: 50%; background: #24151e; color: #efc27d; }
.portrait-frame img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 6px 6px 26px 6px; }
.profile-copy h2 { margin: 4px 0; font-family: Georgia, "Yu Mincho", serif; font-size: clamp(28px, 4vw, 43px); font-weight: 500; letter-spacing: .1em; }
.menu-nav { display: grid; align-content: center; gap: 9px; }
.menu-nav button { position: relative; display: grid; grid-template-columns: 42px 1fr; grid-template-rows: auto auto; min-height: 72px; padding: 13px 15px; border: 1px solid #c79d6850; border-radius: 7px; background: #130e15a3; color: #ead8c4; text-align: left; font: 600 16px/1.35 inherit; cursor: pointer; transition: transform 100ms ease, background 100ms ease, border-color 100ms ease; }
.menu-nav button span { grid-row: 1 / 3; align-self: center; color: #c7965c; font: italic 18px/1 Georgia, serif; }
.menu-nav button small { color: #907c85; font-size: 10px; font-weight: 500; letter-spacing: .04em; }
.menu-nav button:hover:not(.is-active) { border-color: #d4ad7a88; background: #261720c4; }
.menu-nav button:focus-visible { outline: 2px solid #efc27d; outline-offset: 2px; }
.menu-nav button.is-active { transform: translateX(-5px); border-color: #e0b36fa6; background: linear-gradient(90deg, #6e3b49b8, #281722cc); outline: none; }
.menu-nav button.is-active::after { content: "◆"; position: absolute; right: 14px; top: 24px; color: #ecc37f; font-size: 10px; }
.menu-footer { display: flex; justify-content: space-between; gap: 24px; padding: 14px 24px; border-top: 1px solid #d2a46b44; color: #a9979e; font-size: 11px; letter-spacing: .03em; }
.menu-footer p { margin: 0; }
.menu-footer span { flex: 0 0 auto; color: #d1aa7b; }
.desktop-screen { position: absolute; inset: 0; z-index: 20; padding: clamp(10px, 2.5vw, 30px); background: #030708ee; opacity: 0; visibility: hidden; transition: opacity 130ms ease, visibility 130ms ease; }
.desktop-screen.is-open { opacity: 1; visibility: visible; }
.desktop-shell { display: grid; grid-template-rows: 44px 1fr 34px; width: 100%; height: 100%; overflow: hidden; border: 1px solid #7d9c8e88; border-radius: 7px; background: #0b1718; box-shadow: 0 0 0 3px #020506, 0 25px 80px #000; }
.desktop-bar { display: flex; align-items: center; gap: 16px; padding: 0 12px 0 16px; border-bottom: 1px solid #779b8b55; background: #101d1e; color: #b8d4c7; font: 700 10px/1 monospace; letter-spacing: .12em; }
.desktop-brand { display: flex; align-items: center; gap: 10px; }
.desktop-brand i { width: 9px; height: 9px; border-radius: 50%; background: #72d39a; box-shadow: 0 0 10px #72d39a; }
.desktop-bar time { margin-left: auto; color: #89aa9b; }
.desktop-close { width: 28px; height: 28px; border: 1px solid #9db8aa55; border-radius: 3px; background: #192829; color: #cfe2d9; cursor: pointer; }
.desktop-close:hover, .desktop-close:focus-visible { border-color: #d99986; background: #7b3e3a; outline: none; }
.desktop-workspace { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 0; padding: clamp(10px, 2vw, 24px); background-color: #102426; background-image: linear-gradient(#85aa9820 1px, transparent 1px), linear-gradient(90deg, #85aa9820 1px, transparent 1px), radial-gradient(circle at 65% 45%, #31504b 0, #102426 55%); background-size: 32px 32px, 32px 32px, auto; }
.desktop-icons { display: grid; align-content: start; gap: 20px; }
.desktop-icons button { display: grid; justify-items: center; gap: 7px; padding: 7px 4px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #d3e2da; font: 600 11px/1.2 inherit; cursor: pointer; }
.desktop-icons button span { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #8db2a077; border-radius: 7px; background: linear-gradient(145deg, #38554e, #172827); color: #c4e4d4; font-size: 25px; box-shadow: 0 7px 12px #0005; }
.desktop-icons button:hover, .desktop-icons button:focus-visible, .desktop-icons button.is-active { border-color: #91b6a488; background: #b5d3c21a; outline: none; }
.terminal-window { align-self: center; justify-self: center; width: min(1080px, 100%); max-height: 100%; overflow: auto; border: 1px solid #8dae9e88; border-radius: 5px; background: #d7ddd5; color: #172321; box-shadow: 14px 18px 0 #06101166, 0 20px 50px #0008; }
.terminal-window > header { display: flex; justify-content: space-between; padding: 8px 12px; background: #253b38; color: #d9e5dc; font: 700 10px/1 monospace; letter-spacing: .06em; }
.terminal-window > header i { color: #839a8e; font-style: normal; letter-spacing: .4em; }
.terminal-content { padding: clamp(16px, 2.2vw, 25px); }
.terminal-intro { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; align-items: end; column-gap: 20px; }
.terminal-intro > p { margin: 0; color: #65736d; font-size: 10px; line-height: 1.45; }
.terminal-intro > h2 { grid-row: 2; margin: 2px 0 0; font-family: Georgia, "Yu Mincho", serif; font-size: clamp(22px, 2.8vw, 29px); line-height: 1.2; font-weight: 500; letter-spacing: .07em; }
.terminal-intro > #terminal-copy { grid-column: 2; grid-row: 1 / 3; align-self: end; padding-bottom: 3px; }
#terminal-kicker { margin: 0; color: #8c4e4b; font: 700 8px/1 monospace; letter-spacing: .18em; }
.terminal-search { display: grid; grid-template-columns: auto 1fr auto; gap: 7px; align-items: center; margin: 9px 0; padding: 4px 4px 4px 9px; border: 1px solid #83958c; background: #f0f2ed; }
.terminal-search[hidden] { display: none; }
.terminal-search span { color: #6b7b73; font: 700 9px/1 monospace; letter-spacing: .12em; }
.terminal-search input { min-width: 0; border: 0; outline: 0; background: transparent; color: #1d2b28; font: 500 11px/1.4 inherit; }
.terminal-search button { padding: 6px 13px; border: 0; background: #314b46; color: #e8eee8; font-size: 11px; cursor: pointer; }
.terminal-blog-filters { display: grid; grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); gap: 14px; align-items: center; margin-bottom: 10px; }
.terminal-blog-filters[hidden] { display: none; }
.terminal-blog-filters > label, .terminal-blog-filters > div { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 7px; }
.terminal-blog-filters > label > span, .terminal-blog-filters > div > span { color: #6b7b73; font: 700 8px/1 monospace; letter-spacing: .12em; }
.terminal-blog-filters select { width: 100%; height: 29px; padding: 0 8px; border: 1px solid #94a39a; background: #eef1ec; color: #263b36; font-size: 11px; }
.terminal-tag-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.terminal-tag-filters button { min-height: 26px; padding: 0 9px; border: 1px solid #9caaa2; border-radius: 999px; background: #e8ebe6; color: #5f6f68; font-size: 9px; cursor: pointer; }
.terminal-tag-filters button:hover, .terminal-tag-filters button.is-active { border-color: #35524b; background: #35524b; color: #f1f5f1; }
.terminal-results { display: grid; gap: 22px; }
.terminal-results[hidden] { display: none; }
.terminal-category-section { display: grid; gap: 10px; min-width: 0; }
.terminal-category-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 0 2px 7px; border-bottom: 1px solid #aab7af; }
.terminal-category-heading > div { min-width: 0; }
.terminal-category-heading span { color: #8c4e4b; font: 700 8px/1 monospace; letter-spacing: .18em; }
.terminal-category-heading h3 { margin: 3px 0 1px; font: 600 16px/1.3 Georgia, "Yu Mincho", serif; letter-spacing: .05em; }
.terminal-category-heading p { display: none; }
.terminal-category-heading > strong { flex: 0 0 auto; padding-bottom: 2px; color: #75827b; font: 600 8px/1 monospace; letter-spacing: .08em; }
.terminal-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 14px; }
.terminal-category-more { justify-self: end; min-width: 170px; padding: 10px 16px; border: 1px solid #81958b; border-radius: 3px; background: #eef1ec; color: #2d5048; font-size: 11px; cursor: pointer; }
.terminal-category-more:hover, .terminal-category-more:focus-visible { border-color: #31554b; background: #31554b; color: #eef4ef; outline: none; }
.terminal-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; padding-top: 5px; }
.terminal-pagination button { min-width: 34px; height: 32px; padding: 0 10px; border: 1px solid #9aa9a1; border-radius: 3px; background: #eef1ec; color: #50645c; cursor: pointer; }
.terminal-pagination button:hover, .terminal-pagination button:focus-visible { border-color: #31554b; outline: none; }
.terminal-pagination button.is-active { border-color: #31554b; background: #31554b; color: #f0f5f1; cursor: default; }
.terminal-article-card { display: grid; grid-template-rows: auto minmax(0, 1fr); min-width: 0; overflow: hidden; padding: 0; border: 1px solid #aeb9b2; border-radius: 4px; background: #eef1ec; color: #1d2c28; text-align: left; cursor: pointer; box-shadow: 0 6px 15px #233b3414; transition: transform 130ms ease, border-color 130ms ease, box-shadow 130ms ease; }
.terminal-article-card:hover, .terminal-article-card:focus-visible { transform: translateY(-3px); border-color: #46665c; outline: none; box-shadow: 0 10px 22px #1f352d2c; }
.terminal-card-thumbnail { display: grid; place-items: center; width: 100%; aspect-ratio: 2.2 / 1; overflow: hidden; background: linear-gradient(145deg, #1f3835, #241a22); color: #b9d9ca; font: 700 12px/1 monospace; letter-spacing: .18em; }
.terminal-card-thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: transform 180ms ease; }
.terminal-article-card:hover .terminal-card-thumbnail img { transform: scale(1.025); }
.terminal-card-content { display: grid; align-content: start; gap: 4px; padding: 8px 10px 9px; }
.terminal-card-meta { display: flex; justify-content: space-between; gap: 8px; color: #66766f; font: 500 8px/1.4 monospace; }
.terminal-card-meta em { font-style: normal; }
.terminal-card-content > strong { min-height: 2.6em; font-size: 13px; line-height: 1.3; }
.terminal-card-content > span:not(.terminal-card-meta):not(.terminal-card-tags) { display: -webkit-box; overflow: hidden; color: #69756f; font-size: 9px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.terminal-card-tags { display: flex; flex-wrap: wrap; gap: 5px; padding-top: 2px; }
.terminal-card-tags i { padding: 3px 6px; border: 1px solid #c2cbc5; border-radius: 999px; color: #687871; font: 8px/1 monospace; font-style: normal; }
.terminal-empty { grid-column: 1 / -1; padding: 30px 5px; border-top: 1px solid #abb6af; color: #65736d; }
.terminal-view-toolbar { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.terminal-view-toolbar button { padding: 7px 10px; border: 1px solid #83958c; background: #eef0eb; color: #314b46; cursor: pointer; }
.terminal-view-toolbar button:hover, .terminal-view-toolbar button:focus-visible { border-color: #31554b; background: #31554b; color: #eef4ef; outline: none; }
#terminal-article-back[hidden], #terminal-link-view[hidden] { display: none; }
#terminal-link-view { margin-left: auto; }
.terminal-article { margin-top: 22px; border-top: 1px solid #abb6af; }
.terminal-article-tags { display: flex; flex-wrap: wrap; gap: 6px; padding: 15px 0 3px; }
.terminal-article-tags span { padding: 4px 7px; border: 1px solid #aab5ae; border-radius: 999px; color: #5f7068; font: 700 8px/1 monospace; }
.terminal-article-body { padding: 6px 0 20px; line-height: 1.85; }
.terminal-article-body h1 { margin: 18px 0 12px; font: 500 23px/1.5 Georgia, "Yu Mincho", serif; }
.terminal-article-body h2 { margin: 27px 0 10px; padding-bottom: 5px; border-bottom: 1px solid #b7c0ba; font-size: 17px; }
.terminal-article-body h3 { margin: 22px 0 8px; font-size: 14px; }
.terminal-article-body p, .terminal-article-body li { font-size: 13px; }
.terminal-article-body code { padding: 2px 5px; border-radius: 3px; background: #c7cec8; font-family: Consolas, monospace; }
.terminal-article-body pre { overflow: auto; padding: 14px; background: #182522; color: #dce7df; }
.terminal-article-body pre code { padding: 0; background: transparent; }
.terminal-article-body a { color: #315f58; }
.terminal-article-body .internal-link { padding: 0 2px; border-bottom: 1px solid #5f7f75; text-decoration: none; background: #6f9d8d17; }
.terminal-article-body .internal-link::before { content: "↗"; margin-right: 3px; font-size: .72em; }
.terminal-article-body .internal-link.is-unresolved { border-bottom-style: dashed; color: #8f747a; cursor: help; }
.terminal-article-body .internal-link.is-unresolved::before { content: "?"; }
.terminal-article-body .internal-link-card { display: inline-grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 8px; align-items: center; width: min(230px, 100%); min-height: 56px; margin: 4px 5px; padding: 5px; border: 1px solid #a8b7af; border-radius: 6px; background: #eef2ed; box-shadow: 0 6px 15px #263c3418; vertical-align: middle; transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease; }
.terminal-article-body .internal-link-card::before { display: none; }
.terminal-article-body .internal-link-card:hover, .terminal-article-body .internal-link-card:focus-visible { border-color: #46675d; background: #f8faf7; box-shadow: 0 9px 21px #263c3428; outline: none; transform: translateY(-2px); }
.terminal-article-body .internal-link-card-media { display: grid; place-items: center; width: 46px; height: 44px; overflow: hidden; border-radius: 4px; background: #283f3a; }
.terminal-article-body .internal-link-card-media img { width: 100%; height: 100%; object-fit: cover; }
.terminal-article-body .internal-link-card-placeholder { color: #c8ded3; font: 700 7px/1 monospace; letter-spacing: .1em; }
.terminal-article-body .internal-link-card-copy { display: grid; gap: 3px; min-width: 0; }
.terminal-article-body .internal-link-card-copy small { overflow: hidden; color: #71847b; font: 700 7px/1 monospace; letter-spacing: .07em; text-overflow: ellipsis; white-space: nowrap; }
.terminal-article-body .internal-link-card-copy strong { overflow: hidden; color: #21332e; font-size: 11px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.terminal-article-body .internal-link-card-arrow { padding-right: 5px; color: #875057; font-size: 12px; }
.terminal-link-graph { overflow: hidden; margin-top: 14px; border: 1px solid #789087; border-radius: 5px; background: #dfe6e0; box-shadow: 0 18px 38px #1a332a22; }
.terminal-link-graph[hidden] { display: none; }
.terminal-link-graph-header { display: flex; align-items: end; justify-content: space-between; gap: 22px; padding: 17px 20px; border-bottom: 1px solid #8ca097; background: linear-gradient(135deg, #263d39, #1d302d); color: #e6eee9; }
.terminal-link-graph-header > div:first-child { display: grid; gap: 4px; }
.terminal-link-graph-header span { color: #9eb8ac; font: 700 8px/1 monospace; letter-spacing: .14em; }
.terminal-link-graph-header strong { font: 600 18px/1.25 Georgia, "Yu Mincho", serif; letter-spacing: .06em; }
.terminal-link-graph-header p { margin: 0; color: #aebfb7; font-size: 9px; }
.terminal-link-graph-header > div:last-child { display: flex; align-items: baseline; gap: 5px; padding-bottom: 2px; }
.terminal-link-graph-header > div:last-child b { color: #f0d09f; font: 500 22px/1 Georgia, serif; }
.terminal-link-graph-header > div:last-child span { color: #8fa49a; letter-spacing: .08em; }
.terminal-link-graph-header > div:last-child i { width: 1px; height: 25px; margin: 0 7px; background: #ffffff25; }
.terminal-link-graph-canvas { overflow: auto; background-color: #d8e0da; background-image: linear-gradient(#76908713 1px, transparent 1px), linear-gradient(90deg, #76908713 1px, transparent 1px), radial-gradient(circle at 50% 46%, #eef2ee, #cbd6cf 78%); background-size: 28px 28px, 28px 28px, auto; }
.terminal-link-graph svg { display: block; width: 100%; min-width: 720px; height: auto; }
.terminal-link-graph line { stroke: #69877d; stroke-width: 1.8; opacity: .68; }
.terminal-link-graph marker path { fill: #7d4a4f; }
.terminal-graph-node { cursor: pointer; }
.terminal-graph-card-shadow { fill: #17332a25; }
.terminal-graph-card { fill: #f4f6f2; stroke: #708b80; stroke-width: 1.3; transition: fill 120ms ease, stroke 120ms ease, transform 120ms ease; transform-box: fill-box; transform-origin: center; }
.terminal-graph-node:hover .terminal-graph-card { fill: #fff; stroke: #7d4a4f; stroke-width: 2.4; transform: translateY(-3px); }
.terminal-graph-thumbnail { fill: #263d39; }
.terminal-graph-category { fill: #73877e; font: 700 8px/1 monospace; letter-spacing: .08em; }
.terminal-graph-title { fill: #1d302b; font: 600 14px/1.35 "Yu Gothic UI", sans-serif; }
.terminal-graph-meta { fill: #829189; font: 700 8px/1 monospace; letter-spacing: .05em; }
.terminal-graph-open { fill: #8c4e4b; font: 700 13px/1 sans-serif; }
.terminal-graph-node text { pointer-events: none; }
.terminal-link-graph .terminal-empty { display: block; margin: 0; border: 0; text-align: center; }
.desktop-taskbar { display: flex; align-items: center; gap: 15px; padding: 0 14px; border-top: 1px solid #76978944; background: #0d191a; color: #79978a; font: 500 9px/1 monospace; }
.desktop-taskbar span { color: #b5d4c5; }
.desktop-taskbar p { margin: 0; }
.desktop-taskbar b { margin-left: auto; color: #b9d2c5; font-weight: 500; }
.dialogue-log { position: absolute; inset: 0; z-index: 24; display: grid; place-items: center; padding: clamp(12px, 4vw, 38px); background: #09070ccc; backdrop-filter: blur(5px); opacity: 0; visibility: hidden; transition: opacity 140ms ease, visibility 140ms ease; }
.dialogue-log.is-open { opacity: 1; visibility: visible; }
.dialogue-log-window { display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(720px, 100%); height: min(620px, 100%); overflow: hidden; border: 1px solid #d2a46b77; border-radius: 12px; background: linear-gradient(145deg, #2d1925f7, #100b12fa); box-shadow: 0 20px 60px #000b; }
.dialogue-log-window > header { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; border-bottom: 1px solid #d2a46b44; }
.dialogue-log-window h2 { margin: 2px 0 0; color: #f0deca; font: 500 20px/1.2 "Yu Mincho", serif; letter-spacing: .08em; }
.dialogue-log-window small { color: #d2a36b; font: 800 8px/1 monospace; letter-spacing: .2em; }
.dialogue-log-close { width: 34px; height: 34px; border: 1px solid #d4a86677; border-radius: 50%; background: #160f17; color: #e9d7c2; font-size: 15px; }
#dialogue-log-list { min-height: 0; margin: 0; padding: 10px 18px 20px; overflow: auto; list-style: none; }
#dialogue-log-list li { padding: 14px 4px; border-bottom: 1px solid #d2a46b24; }
#dialogue-log-list strong { display: block; margin-bottom: 7px; color: #d6a86d; font-size: 10px; letter-spacing: .12em; }
#dialogue-log-list p { margin: 0; color: #e7dcd2; font: 500 13px/1.8 "Yu Mincho", serif; }
#dialogue-log-list .is-empty { color: #9d8d96; font-size: 12px; text-align: center; }
.update-history-screen { position: absolute; inset: 0; z-index: 22; display: grid; place-items: center; padding: clamp(12px, 4vw, 42px); background: #09070ccc; backdrop-filter: blur(5px); opacity: 0; visibility: hidden; transition: opacity 140ms ease, visibility 140ms ease; }
.update-history-screen.is-open { opacity: 1; visibility: visible; }
.update-history-window { display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(760px, 100%); height: min(650px, 100%); overflow: hidden; border: 1px solid #d3a96d88; border-radius: 13px; background: linear-gradient(145deg, #331c27f8, #110c13fb); box-shadow: 0 24px 80px #000c, inset 0 0 45px #a7672812; }
.update-history-window > header { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid #d2a46b44; background: linear-gradient(90deg, #5b313d55, transparent 70%); }
.update-history-window h2 { margin: 4px 0 0; color: #f0dfca; font: 500 23px/1.2 "Yu Mincho", serif; letter-spacing: .1em; }
.update-history-window small { color: #d5a86d; font: 800 8px/1 monospace; letter-spacing: .2em; }
.update-history-close { width: 36px; height: 36px; border: 1px solid #d4a86677; border-radius: 50%; background: #160f17; color: #ead8c4; font-size: 16px; }
#update-history-list { min-height: 0; margin: 0; padding: 8px 22px 25px; overflow: auto; list-style: none; }
#update-history-list li { display: grid; grid-template-columns: 88px 1fr; gap: 5px 18px; padding: 19px 3px; border-bottom: 1px solid #d2a46b2e; }
#update-history-list li > span { grid-row: 1 / 3; color: #b98a55; font: 700 9px/1.5 monospace; letter-spacing: .08em; }
#update-history-list strong { color: #f0dcca; font: 600 15px/1.5 "Yu Mincho", serif; }
#update-history-list p { margin: 0; color: #bbaeb2; font-size: 12px; line-height: 1.8; white-space: pre-wrap; }
#update-history-list .is-empty { display: block; color: #9d8d96; font-size: 12px; text-align: center; }
.mailbox-screen { position: absolute; inset: 0; z-index: 23; display: grid; place-items: center; padding: clamp(12px, 4vw, 42px); background: #09070ccc; backdrop-filter: blur(5px); opacity: 0; visibility: hidden; transition: opacity 140ms ease, visibility 140ms ease; }
.mailbox-screen.is-open { opacity: 1; visibility: visible; }
.mailbox-window { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: min(660px, 100%); max-height: min(680px, 100%); overflow: hidden; border: 1px solid #d3a96d88; border-radius: 13px; background: linear-gradient(145deg, #331c27f8, #110c13fb); box-shadow: 0 24px 80px #000c, inset 0 0 45px #a7672812; }
.mailbox-window > header { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid #d2a46b44; background: linear-gradient(90deg, #6b293955, transparent 70%); }
.mailbox-window h2 { margin: 4px 0 0; color: #f0dfca; font: 500 23px/1.2 "Yu Mincho", serif; letter-spacing: .1em; }
.mailbox-window small { color: #d5a86d; font: 800 8px/1 monospace; letter-spacing: .2em; }
.mailbox-close { width: 36px; height: 36px; border: 1px solid #d4a86677; border-radius: 50%; background: #160f17; color: #ead8c4; font-size: 16px; cursor: pointer; }
.mailbox-form-body { min-height: 0; overflow: auto; padding: 21px 24px 18px; }
.mailbox-lead { margin: 0 0 19px; color: #bcaeb2; font: 500 13px/1.8 "Yu Mincho", serif; }
.mailbox-recipient { display: flex; align-items: center; gap: 12px; margin: -5px 0 18px; padding: 10px 12px; border: 1px solid #a8784d3d; border-radius: 5px; background: #0d0910a8; }
.mailbox-recipient span { flex: 0 0 auto; color: #d9b47f; font-size: 9px; letter-spacing: .13em; }
.mailbox-recipient strong { min-width: 0; overflow-wrap: anywhere; color: #eadfd3; font: 500 12px/1.5 monospace; }
.mailbox-form-body label { display: grid; gap: 8px; margin-top: 14px; }
.mailbox-form-body label > span { color: #d9b47f; font-size: 10px; letter-spacing: .12em; }
.mailbox-form-body input, .mailbox-form-body textarea { width: 100%; border: 1px solid #a8784d66; border-radius: 5px; outline: none; background: #0e0a10cc; color: #eee1d4; font: 500 14px/1.8 "Yu Mincho", serif; }
.mailbox-form-body input { height: 42px; padding: 0 13px; }
.mailbox-form-body textarea { min-height: 180px; padding: 11px 13px; resize: vertical; }
.mailbox-form-body input:focus, .mailbox-form-body textarea:focus { border-color: #e0b777; box-shadow: 0 0 0 2px #d4a4651f; }
.mailbox-status { min-height: 1.5em; margin: -8px 2px 14px; color: #d99991; font-size: 11px; }
.mailbox-window > footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; border-top: 1px solid #d2a46b33; background: #0d090fcc; }
.mailbox-window > footer span { color: #8e8088; font-size: 10px; }
.mailbox-send { min-height: 38px; padding: 0 18px; border: 1px solid #d5a76399; border-radius: 5px; background: linear-gradient(#754052, #4b2936); color: #f1dfca; font: 600 12px/1 "Yu Mincho", serif; cursor: pointer; }
.mailbox-send:hover, .mailbox-send:focus-visible, .mailbox-close:hover, .mailbox-close:focus-visible { border-color: #efc685; color: #fff2df; outline: none; }
.controls { display: none; position: absolute; inset: 0; z-index: 6; pointer-events: none; touch-action: none; user-select: none; -webkit-user-select: none; }
.joystick { position: absolute; left: max(16px, env(safe-area-inset-left)); bottom: max(16px, env(safe-area-inset-bottom)); width: 116px; height: 116px; padding: 9px; border-radius: 50%; background: #100c1380; box-shadow: inset 0 0 0 1px #efd19b24, 0 7px 20px #0005; pointer-events: auto; }
.joystick-ring { position: relative; width: 100%; height: 100%; border: 1px solid #ead0a84d; border-radius: 50%; background: radial-gradient(circle, #8d65713b 0 17%, #281a25a8 18% 63%, #100c13b8 64%); backdrop-filter: blur(4px); }
.joystick-ring::before, .joystick-ring::after { content: ""; position: absolute; inset: 50% 15px auto; height: 1px; background: #efd2a11f; }
.joystick-ring::after { inset: 15px auto; left: 50%; width: 1px; height: calc(100% - 30px); }
.joystick-knob { position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; margin: -22px; border: 1px solid #edc88c8c; border-radius: 50%; background: radial-gradient(circle at 38% 30%, #916676, #422936 67%); box-shadow: 0 4px 13px #0008, inset 0 1px 2px #fff3; will-change: transform; }
.touch-actions { position: absolute; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: flex-end; gap: 9px; pointer-events: auto; }
.touch-primary-row { display: flex; align-items: flex-end; gap: 10px; }
.touch-action, .touch-dash, .touch-log, .touch-menu { border: 1px solid #e3bf836b; color: #f8ead5; font-family: inherit; -webkit-tap-highlight-color: transparent; touch-action: none; }
.touch-action { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: linear-gradient(145deg, #4c303bd9, #1b121ae8); box-shadow: inset 0 0 0 5px #130d1352, inset 0 1px 0 #fff2, 0 8px 22px #0007; opacity: .7; transform: translateZ(0); transition: opacity 120ms ease, transform 90ms ease, border-color 120ms ease, box-shadow 120ms ease; }
.touch-action-label { max-width: 64px; overflow: hidden; color: #ead8c7; font-size: 10px; font-weight: 700; letter-spacing: .04em; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.touch-action.is-ready { border-color: #f1c77fbd; opacity: 1; box-shadow: inset 0 0 0 5px #2b182255, inset 0 1px 0 #fff3, 0 0 19px #d69b5340, 0 8px 22px #0008; }
.touch-action.is-pressed { transform: scale(.92); background: linear-gradient(145deg, #754454, #291720); }
.touch-dash { display: grid; place-items: center; width: 55px; height: 55px; margin-bottom: 4px; border-radius: 50%; background: linear-gradient(145deg, #25343bd1, #11191ddd); box-shadow: inset 0 0 0 4px #0b10134d, 0 6px 18px #0006; opacity: .78; transition: transform 90ms ease, opacity 90ms ease, border-color 90ms ease; }
.touch-dash span { color: #c7d9d5; font-size: 9px; font-weight: 700; letter-spacing: .03em; }
.touch-dash.is-pressed { border-color: #b9e2d8b8; background: linear-gradient(145deg, #3f6662, #182a2a); box-shadow: inset 0 0 0 4px #15252480, 0 0 17px #76b8a64a; opacity: 1; transform: scale(.92); }
.touch-log { display: grid; place-items: center; width: 45px; height: 34px; margin: 0 2px 9px 0; border-radius: 17px; background: #171017c7; color: #d9c8bb; font-size: 9px; font-weight: 700; }
.touch-log:active { transform: scale(.94); background: #5e3847e8; }
.controls .touch-menu { position: fixed; top: max(12px, env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); display: flex; align-items: center; gap: 7px; min-width: 76px; height: 34px; padding: 0 12px; border-radius: 17px; background: #171017db; box-shadow: 0 5px 15px #0006; color: #d9c8bb; font-size: 9px; font-weight: 700; letter-spacing: .05em; }
.touch-menu-icon { display: grid; gap: 2px; width: 12px; }
.touch-menu-icon i { display: block; height: 1px; border-radius: 1px; background: #e9bf7d; }
.controls .touch-menu:active { transform: scale(.95); background: #5e3847e8; }
@media (max-width: 1100px) {
  .terminal-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 800px), (pointer: coarse) {
  .controls { display: block; }
  .object-discovery { display: grid; }
  .action-hint { display: none; }
  .player-peek { display: none; }
  .keyboard-help { display: none; }
}
@media (max-width: 700px) {
  .dialogue-log { padding: 10px; }
  .dialogue-log-window { height: min(520px, 100%); }
  .update-history-screen { padding: 10px; }
  .update-history-window { height: min(540px, 100%); }
  #update-history-list { padding: 6px 15px 20px; }
  #update-history-list li { grid-template-columns: 1fr; gap: 6px; padding: 15px 2px; }
  #update-history-list li > span { grid-row: auto; }
  .mailbox-screen { padding: 10px; }
  .mailbox-window { max-height: min(620px, 100%); }
  .mailbox-window > header { padding: 13px 15px; }
  .mailbox-form-body { padding: 14px 15px 10px; }
  .mailbox-form-body textarea { min-height: 130px; }
  .mailbox-window > footer { align-items: stretch; flex-direction: column; gap: 8px; padding: 10px 15px max(10px, env(safe-area-inset-bottom)); }
  .mailbox-send { width: 100%; }
  .game-menu { padding: 10px; }
  .menu-header { min-height: 65px; padding: 11px 14px; }
  .menu-crest { width: 36px; height: 36px; }
  .menu-body { grid-template-columns: 1fr; padding: 15px; gap: 14px; }
  .profile-card { grid-template-columns: 115px 1fr; }
  .menu-nav { grid-template-columns: repeat(3, 1fr); }
  .menu-nav button { display: block; min-height: 54px; padding: 10px 7px; text-align: center; font-size: 12px; }
  .menu-nav button span { display: none; }
  .menu-nav button small { display: none; }
  .menu-nav button.is-active { transform: translateY(-3px); }
  .menu-footer p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .desktop-workspace { grid-template-columns: 1fr; padding: 14px; }
  .desktop-icons { grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .desktop-icons button span { width: 40px; height: 40px; }
  .terminal-content { padding: 18px; }
  .terminal-intro { display: block; }
  .terminal-intro > h2 { margin: 3px 0 4px; }
  .terminal-intro > #terminal-copy { padding: 0; }
  .terminal-blog-filters { grid-template-columns: 1fr; gap: 10px; }
  .terminal-blog-filters > label, .terminal-blog-filters > div { grid-template-columns: auto minmax(0, 1fr); }
  .terminal-category-grid { grid-template-columns: 1fr; }
  .terminal-category-heading p { display: none; }
  .terminal-link-graph-header { align-items: flex-start; flex-direction: column; gap: 12px; padding: 15px; }
  .terminal-link-graph-canvas { touch-action: pan-x pan-y; }
  .terminal-link-graph svg { min-width: 680px; }
  .desktop-taskbar p { display: none; }
  .field-dialogue { grid-template-columns: 82px 1fr; width: calc(100% - 20px); bottom: max(116px, calc(env(safe-area-inset-bottom) + 100px)); }
  .dialogue-portrait { aspect-ratio: .78; }
  .dialogue-window { min-height: 104px; padding: 14px 34px 14px 18px; }
  .dialogue-window header { margin-bottom: 8px; }
  .dialogue-window p { font-size: 12px; line-height: 1.65; }
  .field-dialogue:not(.is-modal) { top: max(10px, env(safe-area-inset-top)); right: max(96px, calc(env(safe-area-inset-right) + 86px)); bottom: auto; left: max(10px, env(safe-area-inset-left)); grid-template-columns: 62px minmax(0, 1fr); align-items: start; width: auto; transform: translateY(-10px); }
  .field-dialogue:not(.is-modal).is-visible { transform: translateY(0); }
  .field-dialogue:not(.is-modal) .dialogue-portrait { align-self: start; width: 62px; min-width: 0; height: 76px; min-height: 0; aspect-ratio: auto; border-radius: 10px 4px 4px 10px; }
  .field-dialogue:not(.is-modal) .dialogue-window { min-width: 0; min-height: 76px; max-height: 36vh; overflow: auto; margin-left: -1px; padding: 11px 40px 11px 14px; border-radius: 4px 11px 11px 4px; }
  .field-dialogue:not(.is-modal) .dialogue-window header { margin-bottom: 4px; }
  .field-dialogue:not(.is-modal) .dialogue-window header span { display: none; }
  .field-dialogue:not(.is-modal) .dialogue-window header strong { font-size: 11px; }
  .field-dialogue:not(.is-modal) .dialogue-window p { display: block; min-height: 0; overflow: visible; font-size: 11px; line-height: 1.55; }
  .field-dialogue:not(.is-modal) .dialogue-dismiss { right: 8px; top: 7px; width: 23px; height: 23px; }
  .field-dialogue:not(.is-modal) .dialogue-advance { display: none; }
}
@media (max-height: 520px) and (pointer: coarse) {
  .joystick { width: 98px; height: 98px; }
  .joystick-knob { width: 40px; height: 40px; margin: -20px; }
  .touch-action { width: 66px; height: 66px; }
  .touch-dash { width: 48px; height: 48px; }
  .touch-actions { gap: 7px; }
  .field-dialogue { bottom: max(88px, calc(env(safe-area-inset-bottom) + 78px)); }
}
@media (max-width: 380px) and (pointer: coarse) {
  .touch-primary-row { gap: 6px; }
  .touch-log { width: 38px; }
  .touch-dash { width: 48px; height: 48px; }
  .touch-action { width: 66px; height: 66px; }
}