/* Site shell: banner, hero navbar, topic sidebar, content, right rail (docs/LAYOUT.md).
   Game-UI skin: Yo-kai Watch (Switch) main-menu art from img/ui/ (cut by build/site_ui.py). */
:root {
  --alt-size: 60%;  /* other names over a name, like furigana (Leafy 2026-10-16) */
  --vn-size: .7em; --vn-ink: var(--ink-red);  /* numbers over the game text's vague words (Leafy 2026-10-18) */
  --blue: #2a6fd6; --blue-d: #1d4f9c; --yellow: #ffe14a; --yellow-d: #f2b705;
  --mv-shade: rgba(0,0,0,.08); --find-well: rgba(70,30,130,.10);
  --lav: #cdb7ff; --blue-m: #3f72b3;
  /* the 2016 Wildwood stat strip colours (yokaiMedallium/style.css), same in both themes */
  --badge-h: 64px;
  --game-red: #e0342a; --game-green: #23963c;   /* coloured words in game text on light art ([CR2], [CG]) */
  --stack-yes: var(--game-green); --stack-no: var(--game-red);  /* stacks / doesn't stack pill (Leafy 2026-10-18) */
  --stat-hp: #ff9e80; --stat-str: #ff8a80; --stat-spr: #b388ff; --stat-def: #82b1ff; --stat-spd: #b9f6ca;
  /* colours: dark is the default (Leafy 2026-10-16), from the YW1 Medallium book: slate pages, dark spine, cream ink.
     The light set below is the old look, kept for viewers who pick it (data-theme="light" on <html>, site.js). */
  --ink: #f4f1dc; --mut: #fff; --ink-on: #1f2a3a; --mut-on: rgba(31,42,58,.62); --link: #9cc8ff; --link-red: #ff8a80; --ink-gold: #e8c766; --ink-red: #ff8a80; --ink-green: #8fd694; --ink-lav: #cdb7ff;
  --panel: #414251; --panel-a: rgba(65,66,81,.96); --panel-soft: rgba(65,66,81,.75); --panel-2: #4d4e5d;
  --panel-lav: #4f4a66; --hilite: #5d5940; --blue-l: #3a4f74; --line: #5b5c6d; --rule: #555566;
  --sans: Roboto, sans-serif;
  --head: "M PLUS Rounded 1c", Roboto, sans-serif;
  --title: "Kurokane Line", "Kurokane", "M PLUS Rounded 1c", Roboto, sans-serif;
  --yuruka: "Yuruka", "M PLUS Rounded 1c", Roboto, sans-serif;
  /* drop shadows from lettering.psd (Leafy 2026-10-17): distance 8 at 135deg, spread 10 (Yuruka) and 9 (Kurokane)
     under an 11px stroke; the offset is what shows past the stroke, in em (1px there = .01em) */
  --yur-fill: #fff; --yur-line: #1a0f00; --yur-drop: #1a0f00; --yur-off: .047em;
  --title-drop: #000; --title-off: .037em;
  /* beta notice over the banner (Leafy 2026-10-18): red Yuruka, white outline, banner in grayscale; the navbar covers the bottom 21% of the banner */
  --beta-fill: var(--game-red); --beta-line: #fff; --beta-w: 4px; --beta-size: var(--fs-4xl); --banner-filter: grayscale(1); --banner-tuck: 21%;
  --lb-bg: rgba(10,14,30,.94); --lb-thumb: 64px; --lb-arrow-size: 44px;  /* render lightbox */
  --render: 440px;  /* Yo-kai render and official art slot on entity pages, two to a row */
  --render-chip: 72px; --render-logo: 36px;
  --lb-prev: url("../img/ui/font/arrow/prev.png"); --lb-next: url("../img/ui/font/arrow/next.png");
  /* type scale: every font size in the site CSS is one of these (docs/LAYOUT.md "Style tokens") */
  --fs-2xs: 10px; --fs-xs: 11px; --fs-sm: 12px; --fs-md: 13px; --fs-base: 14px; --fs-lg: 15px; --fs-xl: 16px;
  --fs-2xl: 17px; --fs-3xl: 18px; --fs-4xl: 20px; --fs-5xl: 22px; --fs-6xl: 24px;
  --pill-logo: 38px;  /* game pill logo height, 20% under the old 48px so six fit a row (Leafy 2026-10-18); the name under it stays small */
  --r-xs: 6px; --r-sm: 8px; --r-md: 10px; --r-lg: 12px; --r-xl: 14px; --r-pill: 18px;
  /* box shadows are off by default (Leafy 2026-10-17); the .shadow class turns this one on */
  --shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
  /* outlined lettering: white fill, black outline, the game's title style (page headings, .t-outline) */
  --outline-fill: #fff; --outline-ink: #000; --outline-w: 5px; --outline-accent: var(--yellow);
  /* small secondary text (card subheaders, notes) on the dark panels: white with a black outline (Leafy 2026-10-17) */
  --mut-line: 2.5px #000;
  /* the result-screen digits' gold and outline (img/ui/xp), for the text point and % next to them */
  --digit-gold: #fdd000; --digit-line: #323232;
  --top-h: 64px;  /* sticky navbar height; assets/jump.js sets the measured one */
  /* game windows (Leafy 2026-10-17, the Kunitori pattern): YW1 menu sprites drawn with border-image, one token per sprite.
     Used in cards.css, docs/LAYOUT.md "Game windows". */
  --g-win: url("../img/ui/panel_lilac.png") 70 36 36 36 fill / 35px 18px 18px 18px;
  --g-card: url("../img/ui/win_whisper.png") 40 126 159 40 fill / 20px 63px 80px 20px;
  --g-tile: url("../img/ui/box_lilac.png") 26 fill / 12px;
  --g-plate: url("../img/ui/titlebar.png") 0 60 6 20 fill / 0 30px 3px 10px;
  /* Puni Puni's name box (all_box_name01_01), under the home page title (Leafy 2026-10-18) */
  --g-name: url("../img/ui/name_plate.png") 0 30 fill / 0 15px;
}
/* the light set, also inside the light game art: tone cards and the lilac game windows keep it in dark mode */
:root[data-theme="light"],
.ycard.t-yellow, .ycard.t-cyan, .ycard.t-green, .ycard.t-pink, .ycard.t-purple, .ycard.t-red,
.gwin, .gwin-card, .gwin-tile, .ycard:not(.gold), .gintro, .og-page .og-icons, .card, .hubcard, .seccard, .msite, table.dbt.cv tbody tr:not(.sel) {
  --ink: #1f2a3a; --mut: rgba(31,42,58,.62); --mut-line: 0 transparent; --link: #1d4f9c; --link-red: #F44336; --ink-gold: #6a5410; --ink-red: #b3261e; --ink-green: #1b6e2a; --ink-lav: #5b3fa8;
  --panel: #fff; --panel-a: rgba(255,255,255,.95); --panel-soft: rgba(255,255,255,.7); --panel-2: #eef3fa;
  --panel-lav: #ece6f7; --hilite: #fff3c4; --blue-l: #dcecff; --line: #d7e3f3; --rule: #e0e0e0;
}
/* FOT-Seurat Pro B, the games' title face (Leafy 2026-10-15). One weight; Latin subset made by build/tools/web_font.py. */
@font-face { font-family: "Seurat Pro"; src: url("fonts/seurat-b.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
/* FOT-Kurokane Std EB, the white lettering with the black outline (Leafy 2026-10-16). "Kurokane Line" has the outline
   baked in (a colour font); the CSS stroke on the same rules outlines glyphs that fall through to plain Kurokane. */
/* kuroline: build/tools/web_font.py */
@font-face { font-family: "Kurokane Line"; src: url("fonts/kuroline-latin.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0020-007E,U+00A0-017F,U+2010-2027,U+2030,U+2122,U+2190-2193,U+221E,U+2460-2473,U+266A; }
@font-face { font-family: "Kurokane Line"; src: url("fonts/kuroline-cyr.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0400-045F; }
@font-face { font-family: "Kurokane Line"; src: url("fonts/kuroline-kana.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+3000-30FF,U+FF01-FF5E; }
/* kuroline end */
/* kurokane: build/tools/web_font.py */
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-latin.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0020-007E,U+00A0-017F,U+2010-2027,U+2030,U+2122,U+2190-2193,U+221E,U+2460-2473,U+266A; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-cyr.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0400-045F; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-kana.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+3000-30FF,U+FF01-FF5E; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja0.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E00,U+4E09,U+4E0A,U+4E0D,U+4E0E,U+4E2D,U+4E3B,U+4EBA,U+4ECA,U+4F1A,U+4F53,U+4F55,U+4F5C,U+4F7F,U+5012,U+5149,U+5165,U+5168,U+51FA,U+5200,U+5206,U+524D,U+529B,U+52A0,U+52B9,U+52D5,U+5316,U+53F7,U+5408,U+540D,U+546A,U+5473,U+54C1,U+5546,U+56DE,U+5730,U+5834,U+5927,U+5929,U+5973,U+597D,U+5996,U+5B50,U+5BB6,U+5C0F,U+5C11,U+5C71,U+5E74,U+5EA6,U+5F37,U+5FA9,U+5FC3,U+601D,U+6027,U+602A,U+60AA,U+611F,U+6226,U+624B,U+6301,U+6483,U+653B,U+6575,U+65B9,U+65E5,U+6642,U+6700,U+672C,U+6765,U+679C,U+6975,U+697D,U+6C17,U+6C34,U+6E1B,U+7121,U+7269,U+7279,U+7344,U+7387,U+7389,U+738B,U+751F,U+7528,U+754C,U+767A,U+767D,U+76EE,U+771F,U+78BA,U+795E,U+7A7A,U+7D76,U+8005,U+81EA,U+8272,U+884C,U+8853,U+898B,U+899A,U+8A00,U+8D64,U+8D85,U+8EAB,U+8ECA,U+8ECD,U+8FFD,U+9053,U+9192,U+91D1,U+9577,U+9593,U+9762,U+98A8,U+98DF,U+9AD8,U+9B3C,U+9B42,U+9B54,U+9ED2; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja1.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E0B,U+4E16,U+4E38,U+4E71,U+4E8B,U+4EA4,U+4ED8,U+4EE3,U+4EF2,U+4F10,U+4F1D,U+5143,U+5207,U+5225,U+52DD,U+5339,U+53D6,U+53D7,U+53E3,U+53E4,U+5438,U+547C,U+547D,U+54E1,U+56E3,U+56FD,U+571F,U+58EB,U+5909,U+5916,U+591C,U+5922,U+592A,U+59EB,U+59FF,U+5B88,U+5B9D,U+5BA4,U+5BDD,U+5BFE,U+5C06,U+5C4B,U+5DE8,U+5E2B,U+5E78,U+5E97,U+5F15,U+5F53,U+5F8C,U+5FC5,U+60C5,U+610F,U+611B,U+6240,U+6307,U+63A2,U+63DB,U+653E,U+65B0,U+66F8,U+6756,U+6839,U+683C,U+69D8,U+6B66,U+6B6F,U+6B7B,U+6C37,U+6C7A,U+6CE2,U+6D41,U+6D77,U+706B,U+708E,U+7206,U+72AC,U+753A,U+756A,U+7684,U+76F8,U+7740,U+77E5,U+77F3,U+79C1,U+79D8,U+7ACB,U+7B2C,U+7D9A,U+7F8E,U+8089,U+826F,U+82B1,U+843D,U+86C7,U+88CF,U+8A0E,U+8A71,U+8AAC,U+8B70,U+8CA0,U+8EE2,U+8EFD,U+8FD1,U+901A,U+904B,U+90AA,U+90E8,U+914D,U+95C7,U+968E,U+96C6,U+96F7,U+96FB,U+9752,U+97F3,U+982D,U+983C,U+9854,U+9EC4,U+9F8D; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja2.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E8C,U+4FE1,U+5098,U+5148,U+521D,U+5263,U+53CB,U+53CE,U+540C,U+5442,U+544A,U+5728,U+5831,U+58F0,U+58F2,U+591A,U+592B,U+5B66,U+5B89,U+5B9A,U+5B9F,U+5C02,U+5E2F,U+5E7B,U+5E83,U+5F0F,U+5F62,U+5F71,U+5F85,U+5F97,U+5FCD,U+5FF5,U+6012,U+6210,U+6280,U+629C,U+6311,U+6559,U+6570,U+65AC,U+65CF,U+660E,U+661F,U+66B4,U+6708,U+671B,U+6728,U+672A,U+6821,U+6876,U+68D2,U+6B21,U+6B62,U+6B63,U+6B8B,U+6BBA,U+6BCE,U+6C60,U+6CE8,U+6D3B,U+6E6F,U+6E80,U+6FC0,U+713C,U+71B1,U+72B6,U+732B,U+73FE,U+7403,U+7530,U+7537,U+767E,U+76FE,U+7834,U+793E,U+7A81,U+7B11,U+7D1A,U+7D20,U+7D50,U+7FBD,U+8001,U+8056,U+805E,U+80FD,U+8179,U+821E,U+8349,U+866B,U+8840,U+89E3,U+8A18,U+8A9E,U+8ABF,U+8C6A,U+8D70,U+8DB3,U+8F2A,U+8FBC,U+8FD4,U+9014,U+9023,U+9032,U+9055,U+9078,U+91CD,U+91CF,U+91E3,U+9234,U+9244,U+958B,U+9650,U+968A,U+96E8,U+970A,U+98DB,U+9996,U+9AA8,U+9B5A,U+9F3B; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja3.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E08,U+4E57,U+4EA1,U+4EEE,U+4FDD,U+4FEE,U+4FFA,U+5024,U+50CF,U+516B,U+516C,U+5185,U+5199,U+51B7,U+5371,U+53CD,U+53F0,U+5439,U+5668,U+56F3,U+574A,U+578B,U+5802,U+58CA,U+590F,U+5947,U+59C9,U+5ACC,U+5B58,U+5B8C,U+5BBF,U+5BD2,U+5C04,U+5DDD,U+5DFB,U+5E30,U+5E38,U+5F3E,U+5FD8,U+6016,U+6050,U+614B,U+6211,U+623B,U+6253,U+62F3,U+6577,U+65E9,U+6614,U+6697,U+671F,U+679A,U+685C,U+6A5F,U+6BCD,U+6BD2,U+6C41,U+6CB3,U+6CC9,U+6D3E,U+6D88,U+6DF7,U+6EC5,U+71C3,U+723A,U+725B,U+72D7,U+73CD,U+7406,U+753B,U+76F4,U+7720,U+7802,U+7956,U+796D,U+798F,U+7A2E,U+7A76,U+7AE5,U+7DDA,U+8239,U+82E5,U+82E6,U+8352,U+86DB,U+8718,U+8846,U+8857,U+885B,U+8868,U+8981,U+89AA,U+8A08,U+8A8D,U+8AAD,U+8B1D,U+8B77,U+8CB4,U+8D77,U+8F1D,U+8FF7,U+9003,U+901F,U+904A,U+9054,U+90CE,U+91CE,U+91DD,U+9280,U+93E1,U+95A2,U+95D8,U+967A,U+96A0,U+96E3,U+96EA,U+9999,U+9A13,U+9CE5,U+9CF4; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja4.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E07,U+4E18,U+4ED6,U+4EE5,U+4EF6,U+4F11,U+4F4F,U+5075,U+5099,U+50E7,U+5144,U+51F6,U+5224,U+5229,U+5272,U+52A9,U+52C7,U+52E2,U+5317,U+5370,U+5384,U+53C2,U+53CC,U+5411,U+5468,U+548C,U+56F2,U+5897,U+59CB,U+5A46,U+5BC4,U+5BFF,U+5C01,U+5C5E,U+5CA9,U+5DE5,U+5F1F,U+5F31,U+5FA1,U+5FB4,U+5FEB,U+6025,U+606F,U+60F3,U+6295,U+6368,U+64CD,U+6587,U+6599,U+65AD,U+65C5,U+6674,U+66F2,U+6709,U+670D,U+672D,U+6912,U+696D,U+6A21,U+6A2A,U+6BDB,U+6C42,U+6C5A,U+6CD5,U+6CE5,U+6DF1,U+6E29,U+70B9,U+7236,U+7247,U+7345,U+7363,U+7570,U+75DB,U+7814,U+7815,U+793C,U+7AE0,U+7BB1,U+7BC4,U+7C73,U+7CBE,U+7CF8,U+7D05,U+7D2B,U+7D42,U+7DD1,U+808C,U+80A9,U+80B2,U+80CC,U+8131,U+8155,U+8170,U+8208,U+820C,U+8336,U+8449,U+8776,U+88C2,U+88C5,U+8996,U+89D2,U+8A2D,U+8A3C,U+8A66,U+8C61,U+8CB7,U+8D08,U+8DE1,U+9006,U+9060,U+90FD,U+91DC,U+92AD,U+95BB,U+9662,U+9664,U+985E,U+9928; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja5.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E01,U+4E5D,U+4E73,U+4E94,U+4ED5,U+4F38,U+4F4E,U+4FA1,U+4FC2,U+500B,U+500D,U+50B7,U+5171,U+5177,U+5178,U+518D,U+51A5,U+5203,U+5305,U+5343,U+534A,U+5354,U+535A,U+5375,U+539F,U+53E9,U+53EC,U+53F8,U+5410,U+56DB,U+56FA,U+57CE,U+57FA,U+5931,U+5965,U+5A01,U+5B6B,U+5B87,U+5B99,U+5BAE,U+5BC6,U+5C3E,U+5C64,U+5E03,U+5E73,U+5EA7,U+5F01,U+5F7C,U+5FD7,U+5FDC,U+6162,U+61B6,U+6238,U+6255,U+63CF,U+6539,U+6557,U+666E,U+66F9,U+6731,U+6750,U+6771,U+6797,U+6804,U+6843,U+6B20,U+6B32,U+6B4C,U+6B69,U+6C38,U+6CBB,U+6E21,U+6EDD,U+6F6E,U+70C8,U+7136,U+73E0,U+7531,U+767B,U+77AC,U+7832,U+795D,U+7ADC,U+7CFB,U+7D04,U+7D14,U+7D44,U+7D4C,U+7D71,U+7DE8,U+7DF4,U+7E04,U+7F6E,U+7F85,U+7FA9,U+8003,U+8010,U+8535,U+864E,U+8863,U+888B,U+88FD,U+8A31,U+8A70,U+8C46,U+8FBA,U+9020,U+9152,U+9580,U+964D,U+9663,U+967D,U+96F2,U+984C,U+98EF,U+98F2,U+990A,U+99AC,U+99C5,U+9A0E; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja6.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E21,U+4E59,U+4E86,U+4E88,U+4E95,U+4ECB,U+4ED9,U+4EE4,U+4EFB,U+4F0F,U+4F3C,U+4F4D,U+4F50,U+501F,U+5065,U+5080,U+50D5,U+5100,U+512A,U+5175,U+5186,U+5192,U+51CD,U+523A,U+523B,U+539A,U+53B3,U+53C8,U+53E5,U+53EF,U+5409,U+559A,U+5712,U+5BA2,U+5BFA,U+5C4A,U+5DF1,U+5E3D,U+5E45,U+5E95,U+5EFB,U+5F35,U+5F92,U+6075,U+609F,U+60A9,U+60B2,U+60D1,U+62BC,U+632F,U+6355,U+6388,U+652F,U+666F,U+6691,U+674E,U+6751,U+675F,U+6761,U+677F,U+68B0,U+69CB,U+6BB5,U+6BD4,U+6C0F,U+6C57,U+6C5F,U+6CB9,U+6D1E,U+6E05,U+6E96,U+6F01,U+6F06,U+707D,U+7167,U+7248,U+72C2,U+72D9,U+733F,U+7523,U+75C5,U+76D7,U+76DB,U+773C,U+7A74,U+7AF9,U+7B49,U+7BA1,U+7BC0,U+7D19,U+7DD2,U+7E01,U+7F6A,U+7FD2,U+7FFC,U+8077,U+8150,U+82B8,U+82F1,U+8358,U+84BC,U+85AC,U+897F,U+8AB0,U+8DEF,U+8F5F,U+9001,U+904E,U+9069,U+91CC,U+9285,U+92FC,U+93A7,U+9583,U+9632,U+96D1,U+9858,U+99C4,U+9A5A,U+9B45; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja7.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E26,U+4F8D,U+4F9D,U+5145,U+5236,U+5238,U+5287,U+529F,U+52F2,U+5320,U+533B,U+5341,U+5358,U+53F2,U+53F3,U+5404,U+5451,U+54B2,U+559C,U+5674,U+56F0,U+5727,U+584A,U+58C1,U+592E,U+596A,U+5974,U+5984,U+5999,U+5A66,U+5B63,U+5B85,U+5C1A,U+5C3D,U+5CF6,U+5DEE,U+5E02,U+5E1D,U+5EC3,U+5FB9,U+5FE0,U+6068,U+6271,U+64AE,U+6551,U+6563,U+65CB,U+663C,U+6676,U+66AE,U+66FF,U+671D,U+677E,U+67FB,U+6B74,U+6CE3,U+6D17,U+6D6E,U+6F22,U+6F54,U+7070,U+719F,U+72EC,U+731B,U+7384,U+7518,U+7533,U+7559,U+75B2,U+75BE,U+76BF,U+793A,U+79D1,U+79FB,U+7A32,U+7B4B,U+7B52,U+7B56,U+7D30,U+7D75,U+7F36,U+8033,U+811A,U+81D3,U+81E3,U+81ED,U+820E,U+83CC,U+83D3,U+83EF,U+8679,U+88DC,U+8972,U+8A13,U+8A55,U+8B58,U+8CA1,U+8CC0,U+8CCA,U+8CDE,U+8CEA,U+8DA3,U+8E8D,U+8F9B,U+8F9E,U+9000,U+900F,U+916C,U+9320,U+9332,U+9396,U+9589,U+96C0,U+96E2,U+9802,U+98FC,U+98FD,U+98FE,U+9AEA,U+9F13; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja8.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E03,U+4F01,U+5074,U+50CD,U+51AC,U+5275,U+5289,U+52B4,U+52C9,U+53BB,U+53C9,U+5426,U+554F,U+5742,U+57F7,U+5883,U+5915,U+5951,U+59B9,U+59BB,U+5A18,U+5B64,U+5BB3,U+5BB4,U+5BCC,U+5C0A,U+5C0E,U+5C3C,U+5C65,U+5D29,U+5D50,U+5E25,U+5E79,U+5E7C,U+5EAB,U+5EB7,U+604B,U+618E,U+624D,U+62DB,U+6383,U+6398,U+63EE,U+65E6,U+6620,U+6669,U+66F4,U+672B,U+676F,U+6795,U+67D3,U+6848,U+68EE,U+693F,U+6A29,U+6B8A,U+6BBF,U+6D6A,U+6DB2,U+6E7F,U+6EB6,U+6FC3,U+716E,U+718A,U+7259,U+74A7,U+7686,U+7687,U+76AE,U+770B,U+7825,U+7981,U+7984,U+798D,U+79CB,U+79F0,U+7BC9,U+7D5E,U+7D99,U+7DCF,U+7E1B,U+7E54,U+80C6,U+80F8,U+81F3,U+8266,U+85E4,U+885D,U+88C1,U+8987,U+89B3,U+8A2A,U+8A8C,U+8AA0,U+8B0E,U+8B66,U+8C37,U+8C9D,U+8CAB,U+8CC7,U+8D8A,U+8E74,U+8F29,U+9045,U+907F,U+92ED,U+963F,U+9640,U+9670,U+96F6,U+9732,U+9759,U+975E,U+97FF,U+9803,U+984D,U+9A12,U+9E92,U+9E97,U+9E9F; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja9.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E45,U+4E7E,U+4E9C,U+4EC7,U+4F2F,U+4FBF,U+5009,U+5049,U+5217,U+52AA,U+5302,U+5353,U+53EB,U+541B,U+552F,U+56DA,U+57A3,U+57DF,U+5805,U+5869,U+5948,U+596E,U+5B54,U+5B57,U+5B98,U+5BB9,U+5C45,U+5C4D,U+5C55,U+5DE3,U+5E33,U+5E72,U+5EFA,U+5F67,U+5F79,U+5FB3,U+6028,U+6065,U+6094,U+60E8,U+62B1,U+62CD,U+62D2,U+62E0,U+62FE,U+635C,U+63A5,U+63B2,U+63D0,U+64B2,U+656C,U+6607,U+679D,U+67AF,U+6885,U+69CD,U+6A4B,U+6BD8,U+6C11,U+6C96,U+6C99,U+6D0B,U+6D44,U+6E1A,U+6E90,U+6F14,U+706F,U+70CF,U+7159,U+722A,U+7235,U+72AF,U+732A,U+76E4,U+78E8,U+7948,U+79C0,U+79D2,U+7A4D,U+7B50,U+7B97,U+7C21,U+7D0B,U+7E2E,U+7F70,U+8074,U+8108,U+8340,U+8377,U+83DC,U+84CB,U+84EE,U+85FB,U+89A7,U+8A33,U+8A85,U+8A89,U+8A95,U+8A98,U+8ACB,U+8B5C,U+8CDB,U+8E0A,U+8ED2,U+8F09,U+8FC5,U+9031,U+906D,U+907A,U+9154,U+91D8,U+934B,U+935B,U+9418,U+9678,U+9707,U+99C6,U+9BAE,U+9E7F,U+9EBB; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja10.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E3C,U+4E43,U+4E4B,U+4ECF,U+4F0A,U+4F0E,U+4F59,U+514E,U+517C,U+51E6,U+5256,U+5264,U+52D9,U+533A,U+5352,U+5357,U+535E,U+5360,U+559D,U+55AC,U+56E0,U+572D,U+5DDE,U+5DE6,U+5DFE,U+5E0C,U+5EAD,U+5ECA,U+5EF4,U+5EF6,U+5F6B,U+5F93,U+6148,U+6163,U+61A4,U+620C,U+6249,U+6298,U+629E,U+62C5,U+62E1,U+63FA,U+6545,U+65D7,U+6606,U+6625,U+673A,U+67D4,U+67F1,U+67F3,U+691C,U+6BB4,U+6C88,U+6CA1,U+6CA2,U+6CC1,U+6CCA,U+6CF3,U+6D25,U+6D99,U+6E2C,U+6E9C,U+6F0F,U+708A,U+714C,U+72E9,U+7372,U+7396,U+745C,U+74B0,U+7565,U+757F,U+7591,U+7642,U+76E3,U+7701,U+7761,U+77E2,U+77ED,U+78C1,U+7960,U+7A0B,U+7AFF,U+7B1B,U+7B26,U+7C89,U+7C98,U+7CA7,U+7D17,U+7D22,U+7D33,U+7D46,U+7D66,U+7DB1,U+7E26,U+7E5A,U+7F60,U+7FA4,U+8096,U+8133,U+81F4,U+89E6,U+8C4A,U+8C5A,U+8CB8,U+8D99,U+8E0F,U+8EDF,U+8FEB,U+90A3,U+9178,U+9283,U+93AE,U+9451,U+96C4,U+96C5,U+96DB,U+9727,U+9806,U+9818; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja11.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E89,U+4EAC,U+4EC1,U+5104,U+5146,U+514B,U+51DD,U+5230,U+525B,U+52DF,U+54C0,U+54F2,U+5609,U+5618,U+5815,U+582A,U+5857,U+587E,U+5893,U+58EE,U+5A5A,U+5B09,U+5B97,U+5BB5,U+5BC2,U+5BE9,U+5C3B,U+5C48,U+5CE0,U+5E8A,U+5EB6,U+5F13,U+5F57,U+5F66,U+5FAE,U+6069,U+6070,U+60B6,U+6176,U+6191,U+6212,U+627F,U+62AB,U+6367,U+638C,U+63A1,U+63A8,U+63DA,U+643A,U+64A4,U+6696,U+6734,U+67A0,U+6842,U+68DF,U+690D,U+694A,U+69CC,U+6BBB,U+6C8C,U+6CB8,U+6D74,U+6E08,U+6E09,U+6E13,U+6E26,U+6F5C,U+7011,U+70AD,U+70B8,U+7114,U+74F6,U+7532,U+75D5,U+7652,U+76CA,U+770C,U+77B3,U+77DB,U+7887,U+7A63,U+7A9F,U+7C8B,U+7D39,U+7D61,U+7DCA,U+7DE0,U+7E70,U+7FFB,U+8235,U+82AF,U+8463,U+84B8,U+8521,U+862D,U+86EE,U+8907,U+8A93,U+8AB2,U+8AC7,U+8CA7,U+8CA8,U+8CA9,U+8CAC,U+8CAF,U+8CBB,U+8CE2,U+8DF3,U+9047,U+90ED,U+90F5,U+90F7,U+932C,U+9686,U+96F0,U+9769,U+9774,U+9811,U+9B44,U+9F62; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja12.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E92,U+4FB6,U+5019,U+50AC,U+50B2,U+514D,U+5150,U+515A,U+518A,U+5211,U+524A,U+536F,U+53DB,U+543D,U+55DA,U+58A8,U+5982,U+59AC,U+59B2,U+5AC9,U+5BA3,U+5BDF,U+5C31,U+5CE1,U+5DF4,U+5E06,U+5E55,U+5E9C,U+5F25,U+5F8A,U+5F90,U+5F98,U+6020,U+60DC,U+60F0,U+6109,U+6115,U+623F,U+62BD,U+639B,U+63F4,U+642D,U+6562,U+65A7,U+65E2,U+6628,U+662D,U+6749,U+676D,U+6790,U+67F4,U+68DA,U+697C,U+6A19,U+6BEC,U+6CE1,U+6D12,U+6D45,U+6ED1,U+6EF4,U+6F2B,U+6F2C,U+6F84,U+6FEF,U+707C,U+72DB,U+7460,U+7483,U+7504,U+7551,U+75AB,U+75FA,U+7634,U+7763,U+786C,U+7A3C,U+7AF6,U+7B46,U+7C4D,U+7C92,U+7C9B,U+7D00,U+7D02,U+7D0D,U+7DB2,U+7E3E,U+7E4B,U+7F8A,U+80F4,U+8102,U+822A,U+8607,U+86D9,U+8749,U+878D,U+88AB,U+88B4,U+8A3A,U+8A69,U+8B00,U+8B1B,U+8C82,U+8FE6,U+9063,U+906E,U+90A6,U+90E1,U+9177,U+91C7,U+932B,U+95A3,U+969C,U+984E,U+990C,U+9A19,U+9AB8,U+9B6F,U+9C57,U+9D28,U+9D8F; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja13.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E1E,U+4E39,U+4E5F,U+4E8E,U+4EF0,U+4F3D,U+4F8B,U+505C,U+5091,U+50DA,U+511F,U+515C,U+51DB,U+51E1,U+524B,U+52FE,U+534D,U+537F,U+54B3,U+5504,U+57A2,U+5875,U+58FA,U+594F,U+5954,U+59DC,U+5A9A,U+5AC1,U+5BEE,U+5C40,U+5CB8,U+614C,U+6190,U+61A9,U+61BE,U+622F,U+6234,U+6279,U+6297,U+62B5,U+6392,U+63A7,U+63C9,U+6442,U+653F,U+6627,U+6634,U+66DC,U+6703,U+68FA,U+69C3,U+6A59,U+6B53,U+6C50,U+6C7D,U+6CBC,U+6CF0,U+6D66,U+6D9B,U+6E2F,U+6F70,U+7089,U+7109,U+721B,U+723D,U+7262,U+7272,U+72A0,U+72FC,U+754F,U+773A,U+78A7,U+7940,U+795F,U+7965,U+7A3D,U+7A40,U+7A4F,U+7AFA,U+7DAD,U+7E41,U+80E1,U+822C,U+8318,U+837C,U+83F1,U+8457,U+846C,U+859C,U+8650,U+87BA,U+8881,U+88F8,U+8A23,U+8AF8,U+8B39,U+8CBC,U+8CC3,U+8CFC,U+8D05,U+8D66,U+8FB2,U+901D,U+902E,U+9041,U+91C8,U+921E,U+9271,U+9397,U+939A,U+95E5,U+963B,U+9699,U+96C9,U+96CD,U+9813,U+9867,U+9BAB,U+9CE9,U+9DB4; }
@font-face { font-family: "Kurokane"; src: url("fonts/kurokane-ja14.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4ED4,U+4FB5,U+516D,U+5247,U+542B,U+543E,U+5584,U+5606,U+5747,U+5750,U+589C,U+5B22,U+5BE7,U+5BF8,U+5C0B,U+5E2D,U+6052,U+614E,U+61A7,U+62D9,U+62ED,U+65BD,U+6B04,U+6DE1,U+6E67,U+704C,U+72D0,U+7985,U+7A6B,U+7AAE,U+7B54,U+7FCC,U+8105,U+81A9,U+829D,U+865A,U+8FBB,U+9162,U+938C,U+9685,U+97D3,U+99D0,U+9A30; }
/* kurokane end */
/* FOT-Yuruka Std UB, the lettering of the YW3 map captions and banners: panel titles, h1, h2 (Leafy 2026-10-16) */
/* yuruka: build/tools/web_font.py */
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-latin.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0020-007E,U+00A0-017F,U+2010-2027,U+2030,U+2122,U+2190-2193,U+221E,U+2460-2473,U+266A; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-cyr.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0400-045F; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-kana.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+3000-30FF,U+FF01-FF5E; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja0.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E00,U+4E09,U+4E0A,U+4E0D,U+4E0E,U+4E2D,U+4E3B,U+4EBA,U+4ECA,U+4F1A,U+4F53,U+4F55,U+4F5C,U+4F7F,U+5012,U+5149,U+5165,U+5168,U+51FA,U+5200,U+5206,U+524D,U+529B,U+52A0,U+52B9,U+52D5,U+5316,U+53F7,U+5408,U+540D,U+546A,U+5473,U+54C1,U+5546,U+56DE,U+5730,U+5834,U+5927,U+5929,U+5973,U+597D,U+5996,U+5B50,U+5BB6,U+5C0F,U+5C11,U+5C71,U+5E74,U+5EA6,U+5F37,U+5FA9,U+5FC3,U+601D,U+6027,U+602A,U+60AA,U+611F,U+6226,U+624B,U+6301,U+6483,U+653B,U+6575,U+65B9,U+65E5,U+6642,U+6700,U+672C,U+6765,U+679C,U+6975,U+697D,U+6C17,U+6C34,U+6E1B,U+7121,U+7269,U+7279,U+7344,U+7387,U+7389,U+738B,U+751F,U+7528,U+754C,U+767A,U+767D,U+76EE,U+771F,U+78BA,U+795E,U+7A7A,U+7D76,U+8005,U+81EA,U+8272,U+884C,U+8853,U+898B,U+899A,U+8A00,U+8D64,U+8D85,U+8EAB,U+8ECA,U+8ECD,U+8FFD,U+9053,U+9192,U+91D1,U+9577,U+9593,U+9762,U+98A8,U+98DF,U+9AD8,U+9B3C,U+9B42,U+9B54,U+9ED2; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja1.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E0B,U+4E16,U+4E38,U+4E71,U+4E8B,U+4EA4,U+4ED8,U+4EE3,U+4EF2,U+4F10,U+4F1D,U+5143,U+5207,U+5225,U+52DD,U+5339,U+53D6,U+53D7,U+53E3,U+53E4,U+5438,U+547C,U+547D,U+54E1,U+56E3,U+56FD,U+571F,U+58EB,U+5909,U+5916,U+591C,U+5922,U+592A,U+59EB,U+59FF,U+5B88,U+5B9D,U+5BA4,U+5BDD,U+5BFE,U+5C06,U+5C4B,U+5DE8,U+5E2B,U+5E78,U+5E97,U+5F15,U+5F53,U+5F8C,U+5FC5,U+60C5,U+610F,U+611B,U+6240,U+6307,U+63A2,U+63DB,U+653E,U+65B0,U+66F8,U+6756,U+6839,U+683C,U+69D8,U+6B66,U+6B6F,U+6B7B,U+6C37,U+6C7A,U+6CE2,U+6D41,U+6D77,U+706B,U+708E,U+7206,U+72AC,U+753A,U+756A,U+7684,U+76F8,U+7740,U+77E5,U+77F3,U+79C1,U+79D8,U+7ACB,U+7B2C,U+7D9A,U+7F8E,U+8089,U+826F,U+82B1,U+843D,U+86C7,U+88CF,U+8A0E,U+8A71,U+8AAC,U+8B70,U+8CA0,U+8EE2,U+8EFD,U+8FD1,U+901A,U+904B,U+90AA,U+90E8,U+914D,U+95C7,U+968E,U+96C6,U+96F7,U+96FB,U+9752,U+97F3,U+982D,U+983C,U+9854,U+9EC4,U+9F8D; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja2.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E8C,U+4FE1,U+5098,U+5148,U+521D,U+5263,U+53CB,U+53CE,U+540C,U+5442,U+544A,U+5728,U+5831,U+58F0,U+58F2,U+591A,U+592B,U+5B66,U+5B89,U+5B9A,U+5B9F,U+5C02,U+5E2F,U+5E7B,U+5E83,U+5F0F,U+5F62,U+5F71,U+5F85,U+5F97,U+5FCD,U+5FF5,U+6012,U+6210,U+6280,U+629C,U+6311,U+6559,U+6570,U+65AC,U+65CF,U+660E,U+661F,U+66B4,U+6708,U+671B,U+6728,U+672A,U+6821,U+6876,U+68D2,U+6B21,U+6B62,U+6B63,U+6B8B,U+6BBA,U+6BCE,U+6C60,U+6CE8,U+6D3B,U+6E6F,U+6E80,U+6FC0,U+713C,U+71B1,U+72B6,U+732B,U+73FE,U+7403,U+7530,U+7537,U+767E,U+76FE,U+7834,U+793E,U+7A81,U+7B11,U+7D1A,U+7D20,U+7D50,U+7FBD,U+8001,U+8056,U+805E,U+80FD,U+8179,U+821E,U+8349,U+866B,U+8840,U+89E3,U+8A18,U+8A9E,U+8ABF,U+8C6A,U+8D70,U+8DB3,U+8F2A,U+8FBC,U+8FD4,U+9014,U+9023,U+9032,U+9055,U+9078,U+91CD,U+91CF,U+91E3,U+9234,U+9244,U+958B,U+9650,U+968A,U+96E8,U+970A,U+98DB,U+9996,U+9AA8,U+9B5A,U+9F3B; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja3.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E08,U+4E57,U+4EA1,U+4EEE,U+4FDD,U+4FEE,U+4FFA,U+5024,U+50CF,U+516B,U+516C,U+5185,U+5199,U+51B7,U+5371,U+53CD,U+53F0,U+5439,U+5668,U+56F3,U+574A,U+578B,U+5802,U+58CA,U+590F,U+5947,U+59C9,U+5ACC,U+5B58,U+5B8C,U+5BBF,U+5BD2,U+5C04,U+5DDD,U+5DFB,U+5E30,U+5E38,U+5F3E,U+5FD8,U+6016,U+6050,U+614B,U+6211,U+623B,U+6253,U+62F3,U+6577,U+65E9,U+6614,U+6697,U+671F,U+679A,U+685C,U+6A5F,U+6BCD,U+6BD2,U+6C41,U+6CB3,U+6CC9,U+6D3E,U+6D88,U+6DF7,U+6EC5,U+71C3,U+723A,U+725B,U+72D7,U+73CD,U+7406,U+753B,U+76F4,U+7720,U+7802,U+7956,U+796D,U+798F,U+7A2E,U+7A76,U+7AE5,U+7DDA,U+8239,U+82E5,U+82E6,U+8352,U+86DB,U+8718,U+8846,U+8857,U+885B,U+8868,U+8981,U+89AA,U+8A08,U+8A8D,U+8AAD,U+8B1D,U+8B77,U+8CB4,U+8D77,U+8F1D,U+8FF7,U+9003,U+901F,U+904A,U+9054,U+90CE,U+91CE,U+91DD,U+9280,U+93E1,U+95A2,U+95D8,U+967A,U+96A0,U+96E3,U+96EA,U+9999,U+9A13,U+9CE5,U+9CF4; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja4.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E07,U+4E18,U+4ED6,U+4EE5,U+4EF6,U+4F11,U+4F4F,U+5075,U+5099,U+50E7,U+5144,U+51F6,U+5224,U+5229,U+5272,U+52A9,U+52C7,U+52E2,U+5317,U+5370,U+5384,U+53C2,U+53CC,U+5411,U+5468,U+548C,U+56F2,U+5897,U+59CB,U+5A46,U+5BC4,U+5BFF,U+5C01,U+5C5E,U+5CA9,U+5DE5,U+5F1F,U+5F31,U+5FA1,U+5FB4,U+5FEB,U+6025,U+606F,U+60F3,U+6295,U+6368,U+64CD,U+6587,U+6599,U+65AD,U+65C5,U+6674,U+66F2,U+6709,U+670D,U+672D,U+6912,U+696D,U+6A21,U+6A2A,U+6BDB,U+6C42,U+6C5A,U+6CD5,U+6CE5,U+6DF1,U+6E29,U+70B9,U+7236,U+7247,U+7345,U+7363,U+7570,U+75DB,U+7814,U+7815,U+793C,U+7AE0,U+7BB1,U+7BC4,U+7C73,U+7CBE,U+7CF8,U+7D05,U+7D2B,U+7D42,U+7DD1,U+808C,U+80A9,U+80B2,U+80CC,U+8131,U+8155,U+8170,U+8208,U+820C,U+8336,U+8449,U+8776,U+88C2,U+88C5,U+8996,U+89D2,U+8A2D,U+8A3C,U+8A66,U+8C61,U+8CB7,U+8D08,U+8DE1,U+9006,U+9060,U+90FD,U+91DC,U+92AD,U+95BB,U+9662,U+9664,U+985E,U+9928; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja5.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E01,U+4E5D,U+4E73,U+4E94,U+4ED5,U+4F38,U+4F4E,U+4FA1,U+4FC2,U+500B,U+500D,U+50B7,U+5171,U+5177,U+5178,U+518D,U+51A5,U+5203,U+5305,U+5343,U+534A,U+5354,U+535A,U+5375,U+539F,U+53E9,U+53EC,U+53F8,U+5410,U+56DB,U+56FA,U+57CE,U+57FA,U+5931,U+5965,U+5A01,U+5B6B,U+5B87,U+5B99,U+5BAE,U+5BC6,U+5C3E,U+5C64,U+5E03,U+5E73,U+5EA7,U+5F01,U+5F7C,U+5FD7,U+5FDC,U+6162,U+61B6,U+6238,U+6255,U+63CF,U+6539,U+6557,U+666E,U+66F9,U+6731,U+6750,U+6771,U+6797,U+6804,U+6843,U+6B20,U+6B32,U+6B4C,U+6B69,U+6C38,U+6CBB,U+6E21,U+6EDD,U+6F6E,U+70C8,U+7136,U+73E0,U+7531,U+767B,U+77AC,U+7832,U+795D,U+7ADC,U+7CFB,U+7D04,U+7D14,U+7D44,U+7D4C,U+7D71,U+7DE8,U+7DF4,U+7E04,U+7F6E,U+7F85,U+7FA9,U+8003,U+8010,U+8535,U+864E,U+8863,U+888B,U+88FD,U+8A31,U+8A70,U+8C46,U+8FBA,U+9020,U+9152,U+9580,U+964D,U+9663,U+967D,U+96F2,U+984C,U+98EF,U+98F2,U+990A,U+99AC,U+99C5,U+9A0E; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja6.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E21,U+4E59,U+4E86,U+4E88,U+4E95,U+4ECB,U+4ED9,U+4EE4,U+4EFB,U+4F0F,U+4F3C,U+4F4D,U+4F50,U+501F,U+5065,U+5080,U+50D5,U+5100,U+512A,U+5175,U+5186,U+5192,U+51CD,U+523A,U+523B,U+539A,U+53B3,U+53C8,U+53E5,U+53EF,U+5409,U+559A,U+5712,U+5BA2,U+5BFA,U+5C4A,U+5DF1,U+5E3D,U+5E45,U+5E95,U+5EFB,U+5F35,U+5F92,U+6075,U+609F,U+60A9,U+60B2,U+60D1,U+62BC,U+632F,U+6355,U+6388,U+652F,U+666F,U+6691,U+674E,U+6751,U+675F,U+6761,U+677F,U+68B0,U+69CB,U+6BB5,U+6BD4,U+6C0F,U+6C57,U+6C5F,U+6CB9,U+6D1E,U+6E05,U+6E96,U+6F01,U+6F06,U+707D,U+7167,U+7248,U+72C2,U+72D9,U+733F,U+7523,U+75C5,U+76D7,U+76DB,U+773C,U+7A74,U+7AF9,U+7B49,U+7BA1,U+7BC0,U+7D19,U+7DD2,U+7E01,U+7F6A,U+7FD2,U+7FFC,U+8077,U+8150,U+82B8,U+82F1,U+8358,U+84BC,U+85AC,U+897F,U+8AB0,U+8DEF,U+8F5F,U+9001,U+904E,U+9069,U+91CC,U+9285,U+92FC,U+93A7,U+9583,U+9632,U+96D1,U+9858,U+99C4,U+9A5A,U+9B45; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja7.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E26,U+4F8D,U+4F9D,U+5145,U+5236,U+5238,U+5287,U+529F,U+52F2,U+5320,U+533B,U+5341,U+5358,U+53F2,U+53F3,U+5404,U+5451,U+54B2,U+559C,U+5674,U+56F0,U+5727,U+584A,U+58C1,U+592E,U+596A,U+5974,U+5984,U+5999,U+5A66,U+5B63,U+5B85,U+5C1A,U+5C3D,U+5CF6,U+5DEE,U+5E02,U+5E1D,U+5EC3,U+5FB9,U+5FE0,U+6068,U+6271,U+64AE,U+6551,U+6563,U+65CB,U+663C,U+6676,U+66AE,U+66FF,U+671D,U+677E,U+67FB,U+6B74,U+6CE3,U+6D17,U+6D6E,U+6F22,U+6F54,U+7070,U+719F,U+72EC,U+731B,U+7384,U+7518,U+7533,U+7559,U+75B2,U+75BE,U+76BF,U+793A,U+79D1,U+79FB,U+7A32,U+7B4B,U+7B52,U+7B56,U+7D30,U+7D75,U+7F36,U+8033,U+811A,U+81D3,U+81E3,U+81ED,U+820E,U+83CC,U+83D3,U+83EF,U+8679,U+88DC,U+8972,U+8A13,U+8A55,U+8B58,U+8CA1,U+8CC0,U+8CCA,U+8CDE,U+8CEA,U+8DA3,U+8E8D,U+8F9B,U+8F9E,U+9000,U+900F,U+916C,U+9320,U+9332,U+9396,U+9589,U+96C0,U+96E2,U+9802,U+98FC,U+98FD,U+98FE,U+9AEA,U+9F13; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja8.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E03,U+4F01,U+5074,U+50CD,U+51AC,U+5275,U+5289,U+52B4,U+52C9,U+53BB,U+53C9,U+5426,U+554F,U+5742,U+57F7,U+5883,U+5915,U+5951,U+59B9,U+59BB,U+5A18,U+5B64,U+5BB3,U+5BB4,U+5BCC,U+5C0A,U+5C0E,U+5C3C,U+5C65,U+5D29,U+5D50,U+5E25,U+5E79,U+5E7C,U+5EAB,U+5EB7,U+604B,U+618E,U+624D,U+62DB,U+6383,U+6398,U+63EE,U+65E6,U+6620,U+6669,U+66F4,U+672B,U+676F,U+6795,U+67D3,U+6848,U+68EE,U+693F,U+6A29,U+6B8A,U+6BBF,U+6D6A,U+6DB2,U+6E7F,U+6EB6,U+6FC3,U+716E,U+718A,U+7259,U+74A7,U+7686,U+7687,U+76AE,U+770B,U+7825,U+7981,U+7984,U+798D,U+79CB,U+79F0,U+7BC9,U+7D5E,U+7D99,U+7DCF,U+7E1B,U+7E54,U+80C6,U+80F8,U+81F3,U+8266,U+85E4,U+885D,U+88C1,U+8987,U+89B3,U+8A2A,U+8A8C,U+8AA0,U+8B0E,U+8B66,U+8C37,U+8C9D,U+8CAB,U+8CC7,U+8D8A,U+8E74,U+8F29,U+9045,U+907F,U+92ED,U+963F,U+9640,U+9670,U+96F6,U+9732,U+9759,U+975E,U+97FF,U+9803,U+984D,U+9A12,U+9E92,U+9E97,U+9E9F; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja9.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E45,U+4E7E,U+4E9C,U+4EC7,U+4F2F,U+4FBF,U+5009,U+5049,U+5217,U+52AA,U+5302,U+5353,U+53EB,U+541B,U+552F,U+56DA,U+57A3,U+57DF,U+5805,U+5869,U+5948,U+596E,U+5B54,U+5B57,U+5B98,U+5BB9,U+5C45,U+5C4D,U+5C55,U+5DE3,U+5E33,U+5E72,U+5EFA,U+5F67,U+5F79,U+5FB3,U+6028,U+6065,U+6094,U+60E8,U+62B1,U+62CD,U+62D2,U+62E0,U+62FE,U+635C,U+63A5,U+63B2,U+63D0,U+64B2,U+656C,U+6607,U+679D,U+67AF,U+6885,U+69CD,U+6A4B,U+6BD8,U+6C11,U+6C96,U+6C99,U+6D0B,U+6D44,U+6E1A,U+6E90,U+6F14,U+706F,U+70CF,U+7159,U+722A,U+7235,U+72AF,U+732A,U+76E4,U+78E8,U+7948,U+79C0,U+79D2,U+7A4D,U+7B50,U+7B97,U+7C21,U+7D0B,U+7E2E,U+7F70,U+8074,U+8108,U+8340,U+8377,U+83DC,U+84CB,U+84EE,U+85FB,U+89A7,U+8A33,U+8A85,U+8A89,U+8A95,U+8A98,U+8ACB,U+8B5C,U+8CDB,U+8E0A,U+8ED2,U+8F09,U+8FC5,U+9031,U+906D,U+907A,U+9154,U+91D8,U+934B,U+935B,U+9418,U+9678,U+9707,U+99C6,U+9BAE,U+9E7F,U+9EBB; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja10.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E3C,U+4E43,U+4E4B,U+4ECF,U+4F0A,U+4F0E,U+4F59,U+514E,U+517C,U+51E6,U+5256,U+5264,U+52D9,U+533A,U+5352,U+5357,U+535E,U+5360,U+559D,U+55AC,U+56E0,U+572D,U+5DDE,U+5DE6,U+5DFE,U+5E0C,U+5EAD,U+5ECA,U+5EF4,U+5EF6,U+5F6B,U+5F93,U+6148,U+6163,U+61A4,U+620C,U+6249,U+6298,U+629E,U+62C5,U+62E1,U+63FA,U+6545,U+65D7,U+6606,U+6625,U+673A,U+67D4,U+67F1,U+67F3,U+691C,U+6BB4,U+6C88,U+6CA1,U+6CA2,U+6CC1,U+6CCA,U+6CF3,U+6D25,U+6D99,U+6E2C,U+6E9C,U+6F0F,U+708A,U+714C,U+72E9,U+7372,U+7396,U+745C,U+74B0,U+7565,U+757F,U+7591,U+7642,U+76E3,U+7701,U+7761,U+77E2,U+77ED,U+78C1,U+7960,U+7A0B,U+7AFF,U+7B1B,U+7B26,U+7C89,U+7C98,U+7CA7,U+7D17,U+7D22,U+7D33,U+7D46,U+7D66,U+7DB1,U+7E26,U+7E5A,U+7F60,U+7FA4,U+8096,U+8133,U+81F4,U+89E6,U+8C4A,U+8C5A,U+8CB8,U+8D99,U+8E0F,U+8EDF,U+8FEB,U+90A3,U+9178,U+9283,U+93AE,U+9451,U+96C4,U+96C5,U+96DB,U+9727,U+9806,U+9818; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja11.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E89,U+4EAC,U+4EC1,U+5104,U+5146,U+514B,U+51DD,U+5230,U+525B,U+52DF,U+54C0,U+54F2,U+5609,U+5618,U+5815,U+582A,U+5857,U+587E,U+5893,U+58EE,U+5A5A,U+5B09,U+5B97,U+5BB5,U+5BC2,U+5BE9,U+5C3B,U+5C48,U+5CE0,U+5E8A,U+5EB6,U+5F13,U+5F57,U+5F66,U+5FAE,U+6069,U+6070,U+60B6,U+6176,U+6191,U+6212,U+627F,U+62AB,U+6367,U+638C,U+63A1,U+63A8,U+63DA,U+643A,U+64A4,U+6696,U+6734,U+67A0,U+6842,U+68DF,U+690D,U+694A,U+69CC,U+6BBB,U+6C8C,U+6CB8,U+6D74,U+6E08,U+6E09,U+6E13,U+6E26,U+6F5C,U+7011,U+70AD,U+70B8,U+7114,U+74F6,U+7532,U+75D5,U+7652,U+76CA,U+770C,U+77B3,U+77DB,U+7887,U+7A63,U+7A9F,U+7C8B,U+7D39,U+7D61,U+7DCA,U+7DE0,U+7E70,U+7FFB,U+8235,U+82AF,U+8463,U+84B8,U+8521,U+862D,U+86EE,U+8907,U+8A93,U+8AB2,U+8AC7,U+8CA7,U+8CA8,U+8CA9,U+8CAC,U+8CAF,U+8CBB,U+8CE2,U+8DF3,U+9047,U+90ED,U+90F5,U+90F7,U+932C,U+9686,U+96F0,U+9769,U+9774,U+9811,U+9B44,U+9F62; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja12.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E92,U+4FB6,U+5019,U+50AC,U+50B2,U+514D,U+5150,U+515A,U+518A,U+5211,U+524A,U+536F,U+53DB,U+543D,U+55DA,U+58A8,U+5982,U+59AC,U+59B2,U+5AC9,U+5BA3,U+5BDF,U+5C31,U+5CE1,U+5DF4,U+5E06,U+5E55,U+5E9C,U+5F25,U+5F8A,U+5F90,U+5F98,U+6020,U+60DC,U+60F0,U+6109,U+6115,U+623F,U+62BD,U+639B,U+63F4,U+642D,U+6562,U+65A7,U+65E2,U+6628,U+662D,U+6749,U+676D,U+6790,U+67F4,U+68DA,U+697C,U+6A19,U+6BEC,U+6CE1,U+6D12,U+6D45,U+6ED1,U+6EF4,U+6F2B,U+6F2C,U+6F84,U+6FEF,U+707C,U+72DB,U+7460,U+7483,U+7504,U+7551,U+75AB,U+75FA,U+7634,U+7763,U+786C,U+7A3C,U+7AF6,U+7B46,U+7C4D,U+7C92,U+7C9B,U+7D00,U+7D02,U+7D0D,U+7DB2,U+7E3E,U+7E4B,U+7F8A,U+80F4,U+8102,U+822A,U+8607,U+86D9,U+8749,U+878D,U+88AB,U+88B4,U+8A3A,U+8A69,U+8B00,U+8B1B,U+8C82,U+8FE6,U+9063,U+906E,U+90A6,U+90E1,U+9177,U+91C7,U+932B,U+95A3,U+969C,U+984E,U+990C,U+9A19,U+9AB8,U+9B6F,U+9C57,U+9D28,U+9D8F; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja13.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4E1E,U+4E39,U+4E5F,U+4E8E,U+4EF0,U+4F3D,U+4F8B,U+505C,U+5091,U+50DA,U+511F,U+515C,U+51DB,U+51E1,U+524B,U+52FE,U+534D,U+537F,U+54B3,U+5504,U+57A2,U+5875,U+58FA,U+594F,U+5954,U+59DC,U+5A9A,U+5AC1,U+5BEE,U+5C40,U+5CB8,U+614C,U+6190,U+61A9,U+61BE,U+622F,U+6234,U+6279,U+6297,U+62B5,U+6392,U+63A7,U+63C9,U+6442,U+653F,U+6627,U+6634,U+66DC,U+6703,U+68FA,U+69C3,U+6A59,U+6B53,U+6C50,U+6C7D,U+6CBC,U+6CF0,U+6D66,U+6D9B,U+6E2F,U+6F70,U+7089,U+7109,U+721B,U+723D,U+7262,U+7272,U+72A0,U+72FC,U+754F,U+773A,U+78A7,U+7940,U+795F,U+7965,U+7A3D,U+7A40,U+7A4F,U+7AFA,U+7DAD,U+7E41,U+80E1,U+822C,U+8318,U+837C,U+83F1,U+8457,U+846C,U+859C,U+8650,U+87BA,U+8881,U+88F8,U+8A23,U+8AF8,U+8B39,U+8CBC,U+8CC3,U+8CFC,U+8D05,U+8D66,U+8FB2,U+901D,U+902E,U+9041,U+91C8,U+921E,U+9271,U+9397,U+939A,U+95E5,U+963B,U+9699,U+96C9,U+96CD,U+9813,U+9867,U+9BAB,U+9CE9,U+9DB4; }
@font-face { font-family: "Yuruka"; src: url("fonts/yuruka-ja14.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+4ED4,U+4FB5,U+516D,U+5247,U+542B,U+543E,U+5584,U+5606,U+5747,U+5750,U+589C,U+5B22,U+5BE7,U+5BF8,U+5C0B,U+5E2D,U+6052,U+614E,U+61A7,U+62D9,U+62ED,U+65BD,U+6B04,U+6DE1,U+6E67,U+704C,U+72D0,U+7985,U+7A6B,U+7AAE,U+7B54,U+7FCC,U+8105,U+81A9,U+829D,U+865A,U+8FBB,U+9162,U+938C,U+9685,U+97D3,U+99D0,U+9A30; }
/* yuruka end */
/* bg_page.webp is the 960x1080 art of the game texture bg_gradient.png (1024x2048), cut by build/shell_images.py */
body.shell { margin: 0; background: #7fc2ff url("../img/ui/bg_page.webp") 0 0 / 100% 100vh no-repeat fixed; color: var(--ink);
  font-family: var(--sans); font-weight: 400; min-height: 100vh; }
body.shell::before { content: ""; position: fixed; inset: 0; background: url("../img/ui/bg_bubbles.png") 0 0 / 256px; opacity: .35; pointer-events: none; z-index: -1; }
.skip { position: absolute; left: -999px; top: 0; z-index: 400; background: var(--panel); padding: 6px 10px; }
.skip:focus { left: 8px; }

/* banner */
.site-top { text-align: center; padding: 6px 12px 0; }
/* the link is as wide as the banner (760 px, or the window less the padding on phones); inline-block shrank it to 234 px there */
.site-top .banner { display: block; max-width: 760px; margin: 0 auto; }
/* strip above the banner (inc/layout.php top_strip): main game, language, theme, account */
.top-strip-in { max-width: 1800px; margin: 0 auto 6px; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 6px; }
.main-game select { width: auto; }
.main-game { display: flex; white-space: nowrap; align-items: center; gap: 6px; font: 700 var(--fs-base) var(--head); color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.45); }
body.shell #banner { width: 100%; height: auto; display: block; filter: var(--banner-filter); }
.banner-box { position: relative; max-width: 760px; margin: 0 auto; }
.beta-note { position: absolute; inset: 0 0 var(--banner-tuck); margin: 0; display: flex; flex-direction: column; justify-content: center; align-items: center;
  pointer-events: none; font: 400 var(--beta-size)/1.05 var(--yuruka); color: var(--beta-fill); -webkit-text-fill-color: var(--beta-fill);
  -webkit-text-stroke: var(--beta-w) var(--beta-line); paint-order: stroke fill; letter-spacing: .02em; }
.beta-note span { display: block; }
@media (max-width: 640px) { :root { --beta-size: var(--fs-md); --beta-w: 3px; } }

/* hero navbar */
.hero { position: sticky; top: 0; z-index: 200; background: linear-gradient(#3b86ea, var(--blue)); border-top: 3px solid #fff;
  border-bottom: 4px solid var(--yellow); }
.hero::before { content: ""; position: absolute; inset: 0; background: url("../img/ui/stripe.png") 0 50% / auto 100% repeat-x; opacity: .18; pointer-events: none; }
.hero-in { position: relative; max-width: 1800px; margin: 0 auto; display: flex; align-items: center; gap: 6px; padding: 4px 12px; }
.hero-menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; flex: 1; justify-content: center; }
.hero .dd { position: relative; display: block; width: auto; padding: 0; font-size: inherit; }
.dd-btn { display: flex; align-items: center; gap: 6px; border: 0; background: none; color: #fff; cursor: pointer;
  font: 800 var(--fs-2xl)/1 var(--head); padding: 4px 12px 4px 4px; border-radius: 22px; text-shadow: 0 1px 2px rgba(0,0,0,.35); white-space: nowrap; }
.dd-btn img { width: 34px; height: 34px; border-radius: 9px; }
a.dd-btn { text-decoration: none; }
.dd-btn:hover, .dd.open > .dd-btn, .dd:focus-within > .dd-btn, .dd.on > .dd-btn { background: rgba(255,255,255,.2); }
.dd.on > .dd-btn { box-shadow: inset 0 -3px 0 var(--yellow); }
.dd-menu { display: none; position: absolute; left: 0; top: 100%; min-width: 210px; list-style: none; margin: 4px 0 0; padding: 6px;
  background: var(--panel); border-radius: var(--r-xl); border: 3px solid var(--yellow); box-shadow: 0 6px 16px rgba(0,0,0,.25); z-index: 210; }
.dd.open > .dd-menu { display: block; }
@media (hover: hover) and (min-width: 901px) { .dd:hover > .dd-menu { display: block; } .dd-menu .dd-home { display: none; } .dd-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; } }
.dd-menu li { display: block; width: auto; padding: 0; font-size: var(--fs-lg); }
.dd-menu a { display: block; padding: 7px 12px; border-radius: 9px; color: var(--ink); text-decoration: none; font: 700 var(--fs-lg) var(--head); }
.dd-menu a:hover, .dd-menu a:focus { background: var(--blue-l); }
.dd-menu a[aria-current] { background: var(--yellow); color: var(--ink-on); }
.hero-search input { width: 170px; border: 2px solid #fff; border-radius: var(--r-pill); padding: 6px 12px; font: 500 var(--fs-base) var(--head); background: var(--panel-a); }
/* language menu (inc/i18n.php lang_select) */
html.i18n-wait body { visibility: hidden; }
p.dev-warn, #wrapper p.dev-warn { background: #c62828; color: #fff; padding: 10px 14px; border-radius: var(--r-sm); font-weight: 700; }
.top-strip .lang, .main-game select { flex: none; max-width: 9em; margin: 0; box-shadow: none; border: 2px solid #fff; border-radius: var(--r-pill); padding: 5px 8px; font: 700 var(--fs-base) var(--head); background: var(--blue-d); color: #fff; cursor: pointer; }
.top-strip .lang option, .main-game option { background: var(--panel); color: var(--ink); }
/* account chip (assets/account.js fills in the name) */
.top-strip .acct-chip, .top-strip .theme-btn { flex: none; max-width: 10em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 2px solid #fff; border-radius: var(--r-pill); padding: 5px 12px; font: 700 var(--fs-base) var(--head); background: var(--blue-d); color: #fff; text-decoration: none; }
.top-strip .theme-btn { height: auto; box-sizing: content-box; cursor: pointer; }
.top-strip .acct-chip:hover, .top-strip .acct-chip:focus { background: var(--yellow); color: var(--ink-on); }
.top-strip .sd-link { flex: none; font: 700 var(--fs-sm) var(--head); letter-spacing: .08em; color: #fff; opacity: .45; text-decoration: none; }
.top-strip .sd-link:hover, .top-strip .sd-link:focus { opacity: 1; }
.top-strip .theme-btn:focus-visible { outline: 2px solid var(--yellow); outline-offset: 2px; }  /* same colour in both themes and after a click */
#acct-page .btn, .side-edit .btn { display: inline-block; line-height: 1.3; border: 2px solid var(--blue-d); border-radius: var(--r-pill); padding: 6px 14px; margin: 0 4px 6px 0; font: 700 var(--fs-base) var(--head); background: var(--panel); color: var(--link); text-decoration: none; cursor: pointer; }
#acct-page .btn:hover, #acct-page .btn:focus, .side-edit .btn:hover { background: var(--yellow); color: var(--ink-on); }
/* YWP map star, filled once favorited; label under it */
.fav-btn { display: inline-flex; flex-direction: column; align-items: center; gap: 1px; margin: 0 0 6px; padding: 0 4px; border: 0; background: none; color: var(--link); font: 700 var(--fs-sm)/1.2 var(--head); cursor: pointer; }
#wrapper .fav-btn img { display: block; width: 38px; height: 36px; margin: 0; }
.fav-btn:hover span, .fav-btn:focus-visible span { text-decoration: underline; }
.crumbs .fav-btn { align-items: flex-end; margin: 0 0 0 auto; text-align: right; white-space: nowrap; }
/* wide screens: the star in the middle of the bar, clear of the right ad rail (Leafy 2026-10-18) */
@media (min-width: 901px) {
  body.shell .crumbs::after { content: ""; flex: 1 1 0; }
  body.shell .crumbs ol { flex-basis: 0; }
  .crumbs .fav-btn { align-items: center; margin: 0; text-align: center; }
}
.side-edit { margin: 0; padding: 0 8px 8px; }
.side-edit .btn { padding: 3px 12px; font-size: var(--fs-md); }
.side-menu li.off { opacity: .45; }
.side-menu .edit-bar { display: flex; gap: 4px; padding: 2px 10px 6px 40px; }
.side-menu.editing summary { flex-wrap: wrap; }
.side-menu summary .edit-bar { order: 1; flex-basis: 100%; padding: 2px 0 2px 30px; }
.side-menu .edit-bar button { font: 700 var(--fs-sm) var(--head); padding: 1px 8px; border: 1px solid var(--blue-d); border-radius: var(--r-md); background: var(--panel); color: var(--link); cursor: pointer; }
.side-menu .edit-bar button:disabled { opacity: .35; cursor: default; }
.me-sec { margin: 0 0 18px; }
.me-favs { list-style: none; margin: 0 0 8px; padding: 0; }
.me-favs li { margin: 0 0 4px; }
.me-prog { margin: 0 0 14px; }
.me-prog h3 { margin: 0 0 6px; font: 700 var(--fs-xl) var(--head); }
.me-prog .row { display: flex; align-items: center; gap: 10px; margin: 0 0 4px; font-size: var(--fs-base); }
.me-prog .row .lab { width: 76px; }
.me-prog .row .num { width: 96px; text-align: right; color: var(--mut); }
.bar { flex: 1; max-width: 260px; height: 10px; background: rgba(0,0,0,.12); border: 1px solid rgba(0,0,0,.25); }
.bar i { display: block; height: 100%; background: #f2b81c; }
.me-prog input[type=text] { width: 100%; max-width: 360px; font: inherit; padding: 4px 6px; }
#acct-page select { font: 600 var(--fs-base) var(--head); padding: 4px 8px; max-width: 100%; }
.burger { display: none; align-items: center; gap: 8px; border: 2px solid #fff; background: var(--blue-d); color: #fff; border-radius: var(--r-pill);
  padding: 6px 12px; font: 800 var(--fs-lg) var(--head); cursor: pointer; }
.burger .bars, .burger .bars::before, .burger .bars::after { display: block; width: 18px; height: 3px; background: var(--panel); border-radius: 2px; position: relative; }
.burger .bars::before, .burger .bars::after { content: ""; position: absolute; left: 0; }
.burger .bars::before { top: -6px; } .burger .bars::after { top: 6px; }

/* three columns */
.layout { max-width: 1800px; margin: 10px auto 24px; padding: 0 12px; display: grid; gap: 14px; align-items: start;
  grid-template-columns: 230px minmax(0, 1fr); grid-template-areas: "side main"; }
.layout.has-rail { grid-template-columns: 230px minmax(0, 1fr) 230px; grid-template-areas: "side main rail"; }
.side { grid-area: side; position: sticky; top: 72px; max-height: calc(100vh - 84px); overflow: hidden auto; padding: 0 4px 8px 0; }
.rail { grid-area: rail; position: sticky; top: 72px; max-height: calc(100vh - 84px); overflow: hidden auto; padding: 0 4px 8px 0; }
body.shell #wrapper.dbpage { grid-area: main; width: auto; max-width: none; margin: 0; padding: 10px 16px 18px; box-sizing: border-box;
  background: var(--panel-a); background-image: none; border-radius: var(--r-pill); border-bottom: 4px solid var(--blue); min-width: 0; z-index: auto; }

.shadow, #wrapper .shadow { box-shadow: var(--shadow); }

/* panels (sidebar, rail): white card with blue under-line, header = the game's yellow title strip */
.panel { background: var(--panel); border-radius: 16px; border-bottom: 4px solid var(--blue); overflow: hidden; }
.side .panel, .rail .panel { min-width: 0; max-height: none; }  /* undo db.css .panel (260px min width, 78vh cap that cut off the list; pushed the rail past the window) */
.ph { display: block; margin: 0; padding: 9px 14px 10px; font: 800 var(--fs-2xl) var(--head); color: var(--ink);
  background: url("../img/ui/titletab.png") left top / auto 100% no-repeat, var(--panel); border-bottom: 3px solid var(--blue); cursor: default; list-style: none; }
summary.ph { cursor: pointer; }
summary.ph::-webkit-details-marker { display: none; }
.pb { padding: 8px 12px 12px; }
.side-menu, .side-menu ul { list-style: none; margin: 0; padding: 0; }
.side-menu { padding: 8px; }
.side-menu a, .side-menu summary { display: flex; align-items: center; gap: 8px; padding: 4px 10px; border-radius: var(--r-md); color: var(--ink); text-decoration: none; font: 700 var(--fs-lg) var(--head); }
.side-menu a:hover, .side-menu summary:hover { background: var(--blue-l); }
.side-menu a[aria-current] { background: var(--yellow); color: var(--ink-on); }
.side-menu li.hl > a, .side-menu li.hl > details > summary { box-shadow: inset 0 0 0 2px var(--yellow); background: var(--blue-l); }
/* Topic Pages groups fold (details); the triangle points down when open */
.side-menu summary { margin: 0; cursor: pointer; list-style: none; user-select: none; }
.side-menu summary::-webkit-details-marker { display: none; }
.side-menu summary::after { content: ""; margin-left: auto; border: 5px solid transparent; border-left-color: var(--blue-d); border-right: 0; }
.side-menu details[open] > summary::after { transform: rotate(90deg); }
.side-menu summary:focus-visible { outline: 2px solid var(--blue-d); outline-offset: -2px; }
.side-menu details[open] { margin-bottom: 6px; }
.side-menu .grp ul a { padding-left: 20px; font-weight: 500; font-size: var(--fs-base); }
.side-menu img { flex: none; width: 22px; height: 22px; object-fit: contain; }
.side-menu .grp ul img { width: 20px; height: 20px; }
.side-menu .sg { font: 700 var(--fs-xs) var(--head); color: var(--link); white-space: nowrap; }  /* other game of a shared sidebar */
/* Busters / Busters 2 switch at the top of their sidebars ($SIDE_SWITCH) */
.side-switch { display: flex; gap: 6px; padding: 8px 8px 0; }
.side-switch a { flex: 1; display: flex; justify-content: center; align-items: center; padding: 4px; border: 2px solid var(--blue-l); border-radius: var(--r-md); background: var(--panel); opacity: .6; }
.side-switch a:hover { opacity: 1; background: var(--blue-l); }
.side-switch a[aria-current] { opacity: 1; border-color: var(--blue-d); background: var(--yellow); color: var(--ink-on); }
.side-switch img { display: block; max-width: 100%; height: 30px; object-fit: contain; }

/* breadcrumbs: full trail, wraps; game-UI pill */
body.shell .crumbs { display: flex; align-items: center; gap: 4px 10px; flex-wrap: wrap; width: auto; background: var(--blue-l); box-shadow: none; position: static; margin: 0 0 8px; height: auto;
  border-radius: var(--r-xl); padding: 4px 12px; font: 600 var(--fs-md) var(--head); }
.crumbs ol { flex: 1 1 auto; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2px 0; }
.crumbs li { display: inline; width: auto; padding: 0; font: inherit; color: var(--mut); text-align: left; }
.crumbs li + li::before { content: "\203A"; margin: 0 7px; color: var(--link); font-weight: 800; }
body.shell #wrapper .crumbs a { color: var(--link); text-decoration: none; }
body.shell #wrapper .crumbs a:hover { text-decoration: underline; }
.crumbs [aria-current] { color: var(--ink); font-weight: 800; }

/* headings and tabs in the game style */
body.shell #wrapper.dbpage h1 { font: 800 28px var(--head); color: var(--ink); margin: 2px 0 6px; }
body.shell #wrapper.dbpage h2 { font: 800 21px var(--head); color: var(--link); margin: 16px 0 6px; }
body.shell #wrapper.dbpage h3 { font: 800 var(--fs-2xl) var(--head); }
/* page headings: white fill, black outline (the game's title lettering, Leafy 2026-10-14); links and spans in them yellow. Card titles keep their own style.
   .t-outline gives any other text the same lettering. */
body.shell #wrapper.dbpage :is(h1, h2, h3):not(:is(.ycards, .yc-h, .card, .yko-card, .yko-mv, .yko-half, .eqhead) *), .t-outline {
  font-family: var(--title); color: var(--outline-fill); -webkit-text-fill-color: var(--outline-fill); -webkit-text-stroke: var(--outline-w) var(--outline-ink);
  paint-order: stroke fill; letter-spacing: .05em; text-shadow: var(--title-off) var(--title-off) 0 var(--title-drop); }
body.shell #wrapper.dbpage h1:not(:is(.ycards, .yc-h, .card, .yko-card) *) { -webkit-text-stroke-width: 6px; }
/* game lettering only on names and big headings (Leafy 2026-10-17): section h3s and small labels use the site font, outlined */
body.shell #wrapper.dbpage h3:not(:is(.ycards, .yc-h, .card, .yko-card, .yko-mv, .yko-half, .eqhead) *) { font-family: var(--head); font-weight: 800; letter-spacing: 0; -webkit-text-stroke-width: 4px; }
body.shell #wrapper.dbpage :is(h1, h2, h3):not(:is(.ycards, .yc-h, .card, .yko-card, .yko-mv, .yko-half, .eqhead) *) :is(a, span, b), .t-outline :is(a, span, b) { -webkit-text-fill-color: var(--outline-accent); }
/* card titles, panel headings, move names and game pill names: the same white lettering with a black outline (Leafy 2026-10-16) */
body.shell #wrapper :is(.yc-h :is(h2, h3), .ph, .yko-mv h3, .game-tabs a > span, .hubcard.mcard b), body.shell .side .ph,
body.shell .rail .ph,
body.shell #wrapper :is(.yc-h, .yko-mv) :is(h2, h3) a, body.shell #wrapper :is(.yc-h, .yko-mv) :is(h2, h3) a:hover {
  font-family: var(--title); color: var(--outline-fill); -webkit-text-fill-color: var(--outline-fill); -webkit-text-stroke: 4px var(--outline-ink); paint-order: stroke fill; letter-spacing: .04em;
  text-shadow: var(--title-off) var(--title-off) 0 var(--title-drop); }
/* panel titles, page h1 and h2: Yuruka with a solid drop shadow down-right, as on the YW3 map captions */
body.shell #wrapper.dbpage :is(h1, h2):not(:is(.ycards, .yc-h, .card, .yko-card, .yko-mv, .yko-half, .eqhead) *), body.shell #wrapper.dbpage h1.yko-h1,
body.shell :is(#wrapper, .side) .ph {
  font-family: var(--yuruka); font-weight: 400; color: var(--yur-fill); -webkit-text-fill-color: var(--yur-fill); -webkit-text-stroke-color: var(--yur-line);
  letter-spacing: .02em; text-shadow: var(--yur-off) var(--yur-off) 0 var(--yur-drop); }
body.shell #wrapper .game-tabs a > span { font-size: var(--fs-lg); -webkit-text-stroke-width: 3.5px; }
body.shell #wrapper .game-tabs.logos a > span { font: 800 var(--fs-xs) var(--head); letter-spacing: 0; -webkit-text-stroke-width: 2.5px; }
body.shell #wrapper .game-tabs .alt-name { font-family: var(--head); -webkit-text-fill-color: var(--outline-fill); -webkit-text-stroke-width: 2.5px; opacity: .8; font-style: italic; }
#wrapper .game-tabs.logos img.gdig { display: inline; height: 1.25em; vertical-align: -.22em; margin: 0 0 0 1px; }
.titlebar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 12px; padding: 8px 16px; border-radius: var(--r-xl);
  background: url("../img/ui/titletab.png") left top / auto 100% no-repeat, var(--panel); border-bottom: 4px solid var(--blue); }
body.shell #wrapper.dbpage .titlebar h1 { margin: 0; }
/* list pages: game tabs centered on their own row under the title (Leafy 2026-10-18: a floated title pushed them off centre) */
#wrapper.dbpage h1 + .game-tabs.logos { justify-content: center; margin: 0 0 10px; }
/* blank menu pills from the game (comm_button): round ends 47 px of 94, rim 30 px, scaled to the label height */
.pill, .tabs button, .game-tabs a { border: 0; border-radius: 0; background: none; color: var(--ink-on); font: 700 var(--fs-base) var(--head); padding: 7px 16px 8px;
  border-image: url("../img/ui/pill_lilac.png") 30 47 fill / .7em 1.1em stretch; cursor: pointer; text-decoration: none; }
.pill.on, .pill[aria-pressed="true"], .pill[aria-selected="true"], .tabs button.on, .game-tabs a.on { border-image-source: url("../img/ui/pill_yellow.png"); background: none; color: var(--ink-on); }
.pill[aria-pressed="false"] { opacity: .7; color: var(--mut-on); }
/* map pin name on hover (site.js), placed next to the pin */
.pill.map-tip { position: absolute; z-index: 50; transform: translateY(-50%); padding: 4px 12px 5px; font-size: 13px; white-space: nowrap; pointer-events: none; cursor: default; }
/* inspirit lines in the battle speech bubble (battle_u00): body 9-sliced at half size, tail laid over its bottom edge */
.ibub { position: relative; box-sizing: border-box; width: fit-content; max-width: 100%; margin: 6px 0 22px; padding: 10px 20px 12px; color: var(--ink-on); font: 700 var(--fs-base)/1.4 var(--head);
  border-image: url("../img/ui/bubble_white_body.png") 30 46 fill / 15px 23px stretch; }
.ibub::after { content: ""; position: absolute; left: 34px; bottom: -17px; width: 20px; height: 23px; background: url("../img/ui/bubble_white_tail.png") 0 0 / 100% 100%; }
/* the legacy style.css "#wrapper a" (red, underline on hover) outranks the rules above for links */
#wrapper .game-tabs a, #wrapper a.pill, #wrapper .ibub { color: var(--ink-on); }
#wrapper .game-tabs a:hover, #wrapper a.pill:hover { text-decoration: none; }
.game-tabs.logos a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 14px 7px; line-height: 1.1; text-align: center; }
.sim-row .game-tabs { justify-content: center; }
#wrapper .game-tabs.logos img { display: block; height: var(--pill-logo); width: auto; max-width: none; margin: 0; padding: 0; border: 0; box-shadow: none; background: none; }
.tabs { border-bottom: 3px solid var(--blue); }
body.shell .tabs button.on .mut { color: var(--mut); }
/* a game's other English name over its site name (Blasters over Busters): --ink at .75, 4.6:1 on the lavender pills, 6.4:1 on white */
ruby { ruby-position: over; }
rt.alt-name { font-size: var(--alt-size); line-height: 1.1; text-align: center; }
.vn rt { font-size: var(--vn-size); color: var(--vn-ink); font-weight: 700; line-height: 1.1; text-align: center; }
.ibub { --vn-ink: var(--game-red); }
.alt-name { color: var(--mut); font-weight: 500; font-style: italic; }
p .alt-name { font-weight: inherit; }
rt.alt-name:lang(ja) { font-style: normal; }

.scrim { display: none; }
footer.network { max-width: 1800px; margin: 0 auto; padding: 6px 12px 22px; }
footer.network nav { margin: 0; background: none; box-shadow: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; font: 700 var(--fs-base) var(--head); }
footer.network span { color: var(--mut); }
footer.network a { color: var(--link); text-decoration: none; }
footer.network a:hover { text-decoration: underline; }
footer.network .foot-copy { margin: 6px 0 0; text-align: center; font-size: var(--fs-md); color: var(--mut); }
footer.network .foot-copy a { margin-left: 10px; font-weight: 700; }

/* tablets / phones / portrait: one column; sidebar = drawer, rail below the content */
@media (max-width: 1200px) {
  .layout.has-rail { grid-template-columns: 210px minmax(0, 1fr); grid-template-areas: "side main" "side rail"; }
  .rail { position: static; max-height: none; }
}
/* laptops: eight hero menus fit from about 1180px */
@media (max-width: 1440px) {
  .dd-btn { font-size: var(--fs-lg); padding: 3px 8px 3px 3px; }
  .dd-btn img { width: 28px; height: 28px; }
  .hero-search input { width: 110px; }
  .hero-menu { gap: 2px; }
}
@media (max-width: 1360px) {
  .dd-btn { font-size: var(--fs-base); padding: 3px 6px 3px 3px; gap: 4px; }
  .dd-btn img { width: 26px; height: 26px; }
}
@media (max-width: 900px), (orientation: portrait) and (max-width: 1100px) {
  .burger { display: inline-flex; }
  .hero-in { flex-wrap: wrap; justify-content: center; gap: 4px; padding: 4px 8px; }
  .hero { position: static; }  /* the menus wrap to several rows, too tall to keep on screen */
  :root { --top-h: 0px; }
  .hero-menu { display: contents; }
  .hero-search { order: 1; }
  .hero .dd { order: 2; }
  .dd, .hero .dd { position: static; }
  .dd-btn { font-size: var(--fs-base); padding: 3px 9px 3px 3px; white-space: nowrap; }
  .dd-btn img { width: 28px; height: 28px; }
  .dd-menu { left: 8px; right: 8px; top: auto; margin-top: 2px; }
  .hero-search input { width: 140px; }
  .top-strip-in { justify-content: center; gap: 4px; }
  .main-game, .top-strip .lang, .main-game select, .top-strip .acct-chip, .top-strip .theme-btn { font-size: var(--fs-sm); }
  .top-strip .lang, .main-game select { padding: 3px 4px; max-width: 7em; }
  .top-strip .acct-chip, .top-strip .theme-btn { padding: 3px 8px; }
  .layout, .layout.has-rail { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main" "rail"; padding: 0 8px; margin-top: 10px; }
  .side { position: fixed; z-index: 300; top: 0; bottom: 0; left: 0; width: min(300px, 84vw); max-height: none; transform: translateX(-105%);
    transition: transform .2s; padding: 10px; box-sizing: border-box; background: rgba(127,194,255,.97); }
  body.side-open .side { transform: none; }
  body.side-open .scrim { display: block; position: fixed; inset: 0; z-index: 290; background: rgba(0,0,0,.35); }
  .rail { position: static; max-height: none; }
  body.shell #wrapper.dbpage { padding: 10px 12px 16px; border-radius: var(--r-xl); }
  body.shell #wrapper.dbpage h1 { font-size: 23px; }
  footer.network nav a { padding: 6px 0; }
}
/* style.css gives every <button> height: 25px and a shadow; shell buttons size to their content */
body.shell .dd-btn, body.shell .burger, body.shell .pill, body.shell .fav-btn, body.shell .mtab, body.shell .mini-thumb, body.shell button.lnk { height: auto; }
body.shell .dd-btn, body.shell button.lnk { box-shadow: none; }
.site-credit { margin: 0 0 6px; padding: 3px 10px; background: var(--panel-a); border: 2px solid var(--line); border-radius: var(--r-lg); font: 500 var(--fs-sm)/1.4 var(--head); color: var(--mut); }
.site-credit p { margin: 2px 0; }
.site-credit .sc-1, .dbpage .site-credit .sc-1 { color: var(--ink); font-weight: 800; cursor: pointer; }

/* Pages for long card grids (assets/pager.js) */
.pg-off { display: none !important; }
.pager { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin: 8px 0; }
.pager[hidden] { display: none; }
.pager .pg-at { font: 700 var(--fs-base) var(--head); min-width: 92px; text-align: center; }
.pager .pill:disabled { opacity: .45; cursor: default; }
#wrapper .pager .pill img { display: inline; height: 1.25em; width: auto; max-width: none; vertical-align: -.25em; margin: 0 6px; }  /* page-turn arrows (mm_medal_d00) */
.pager .pg-per { margin-left: auto; font: 700 var(--fs-base) var(--head); white-space: nowrap; }
.pager select { font: var(--fs-base) var(--body, inherit); padding: 4px 6px; width: auto; min-width: 64px; margin: 0 0 0 4px; border: 1px solid var(--line); border-radius: var(--r-xs); background: var(--panel); }

/* Server pages for long lists (inc/paging.php, assets/paging.js): on phones the next page loads on its own ("auto") */
body.shell #wrapper nav.pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; width: auto; height: auto; margin: 12px 0; padding: 0; background: none; box-shadow: none; position: static; font: 700 var(--fs-base) var(--head); }
#wrapper .pages .pill img { display: inline; height: 1.25em; width: auto; max-width: none; vertical-align: -.25em; margin: 0 6px; }
.pages .pg-dis { opacity: .45; }
.pages .pg-nums { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
.pages .pg-nums > * { min-width: 2em; padding: 2px 6px; border-radius: var(--r-xs); }
.pages .pg-nums b { background: var(--panel-a); border: 2px solid var(--line); }
.pages .pg-gap { min-width: 0; color: var(--mut); }
body.shell #wrapper nav.pages .pg-load, body.shell #wrapper nav.pages.auto > * { display: none; }
body.shell #wrapper nav.pages.auto > .pg-load { display: block; color: var(--mut); }
[data-paged] > .adslot { grid-column: 1 / -1; }

/* Type: headings wrap tight, prose and plain lists at 1.5 with a readable measure, numbers in columns use tabular figures.
   style.css sets li to line-height 20px and leaves headings and cells at "normal". */
body.shell #wrapper.dbpage :is(h1, h2) { line-height: 1.25; }
body.shell #wrapper.dbpage h3 { line-height: 1.3; }
body.shell #wrapper.dbpage :is(ul, ol):not([class]) > li { line-height: 1.5; }
body.shell #wrapper.dbpage > p, body.shell #wrapper.dbpage > section > p { max-width: 75ch; margin-left: auto; margin-right: auto; }
body.shell #wrapper.dbpage .note { font-weight: 400; }
body.shell #wrapper table.dbt td { line-height: 1.4; }
body.shell #wrapper :is(table.dbt, table.mon, .yko-stats, .ys-v, .yt-q, .pg-at) { font-variant-numeric: tabular-nums; }
/* centred page top: heading, game tabs, intro (bosses.php) */
.pghead { text-align: center; }
.pghead .game-tabs { justify-content: center; }
.pghead > p { max-width: 760px; margin-left: auto; margin-right: auto; }

/* Render lightbox (docs/LAYOUT.md "Render lightbox"); same classes as the DSTS site. Arrows: page-turn art (mm_medal_d00). */
.lb-open { cursor: zoom-in; }
body.lb-on { overflow: hidden; }
.lb { position: fixed; inset: 0; z-index: 400; display: grid; grid-template-rows: minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr); background: var(--lb-bg); }
.lb[hidden] { display: none; }
.lb-x { position: absolute; top: calc(10px + env(safe-area-inset-top)); right: 10px; z-index: 1; padding: 3px 14px 4px; font: 800 var(--fs-md) var(--head);
  color: #fff; -webkit-text-stroke: 2.5px #000; paint-order: stroke fill; background: none; cursor: pointer; border-style: solid; border-width: 0;
  border-image: url("../img/ui/btn_purple.png") 48 46 52 fill / 10px 11px 12px stretch; }
.lb-stage { container-type: size; display: grid; min-height: 0; padding: 52px 8px 4px; touch-action: pan-y pinch-zoom; }
.lb-big { display: grid; place-items: center; min-height: 0; }
.lb-bar { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 6px 6px calc(10px + env(safe-area-inset-bottom)); }
.lb-thumbs { display: flex; gap: 6px; min-width: 0; overflow-x: auto; padding: 2px; }
.lb-thumb { flex: none; height: var(--lb-thumb); padding: 0; background: var(--panel-2); border: 2px solid transparent; border-radius: var(--r-sm); cursor: pointer; overflow: hidden; }
.lb-thumb.on { border-color: var(--yellow); }
.lb-prev, .lb-next { flex: none; width: var(--lb-arrow-size); height: var(--lb-arrow-size); padding: 0; background: var(--lb-prev) center / contain no-repeat; border: 0; cursor: pointer; }
.lb-next { background-image: var(--lb-next); }
.lb-one .lb-bar { display: none; }
/* how render tiles fit: bare images */
.lb-big > img { width: 100cqw; height: 100cqh; object-fit: contain; }
.lb-thumb > img { display: block; width: auto; height: 100%; }
@media (max-width: 480px) { :root { --lb-thumb: 52px; --lb-arrow-size: 36px; } }
/* Yo-kai renders under the facts card (inc/renders.php): every model's turnaround and the official art in one line, each in
   a square slot of the same size, the games that use the model under it (Leafy 2026-10-17, the Kunitori layout). One strip
   image per model, a 600 square slot per view (front, side, back, top, bottom); .rv-v0-4 picks the slot */
#wrapper .rv-gallery { display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: flex-start; gap: 16px; margin: 14px 0; text-align: center; }
#wrapper .rv-gallery > figure { flex: 0 1 calc(50% - 8px); max-width: var(--render); min-width: 0; margin: 0; }
#wrapper .rv-zoom { display: block; }
#wrapper .rv-gallery :focus { outline: none; }
#wrapper .rv-gallery :focus-visible { outline: 2px solid var(--yellow); outline-offset: 2px; }  /* keyboard only, no ring after a click (Leafy 2026-10-17) */
#wrapper .rv-view, #wrapper .rv-art img { display: block; width: 100%; max-width: var(--render); height: auto; aspect-ratio: 1 / 1; margin: 0 auto; box-shadow: none; }
#wrapper .rv-view { object-fit: cover; }
#wrapper .rv-art img { object-fit: contain; }
#wrapper .rv-vbtns { display: flex; gap: 6px; justify-content: center; margin-top: 8px; }
#wrapper .rv-vbtns button { flex: 0 1 var(--render-chip); min-width: 0; height: auto; padding: 2px; background: var(--panel-2); border: 2px solid transparent; border-radius: var(--r-sm); cursor: pointer; }
#wrapper .rv-vbtns button.on { border-color: var(--yellow); }
#wrapper .rv-vbtns img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; margin: 0; box-shadow: none; }
#wrapper .rv-gallery figcaption { margin-top: 6px; font-size: var(--fs-md); color: var(--mut); }
#wrapper .rv-games { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 10px; font-weight: 700; }
#wrapper .rv-games span { flex: none; }
#wrapper .rv-games img { width: auto; max-width: none; aspect-ratio: auto; height: var(--render-logo); margin: 0; vertical-align: middle; box-shadow: none; }
#wrapper .rv-v0, .lb .rv-v0 { object-position: 0 0; }
#wrapper .rv-v1, .lb .rv-v1 { object-position: 25% 0; }
#wrapper .rv-v2, .lb .rv-v2 { object-position: 50% 0; }
#wrapper .rv-v3, .lb .rv-v3 { object-position: 75% 0; }
#wrapper .rv-v4, .lb .rv-v4 { object-position: 100% 0; }
#wrapper .rv-chip img { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; margin: 0; box-shadow: none; }
#wrapper .rv-more { display: none; }  /* boss chips: the other views, for the lightbox only */
.lb .rv-strip { aspect-ratio: 1 / 1; object-fit: cover; }
.lb-big .rv-strip { width: min(100cqw, 100cqh); height: auto; }
.lb-big > .rv-zoom, .lb-thumb > .rv-zoom { display: contents; }
.lb-big .rv-zoom > img { width: 100cqw; height: 100cqh; object-fit: contain; }
.lb-thumb > div { height: 100%; }
.lb-thumb img { display: block; width: auto; height: 100%; }
/* "On this page" jump links (page_sections() in inc/layout.php) and the bar that follows the reader (assets/jump.js) */
#wrapper .jump { max-width: 900px; margin: 10px auto 18px; text-align: center; }
.jump .pb, .jumplist { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.jump-g { display: flex; width: 100%; flex-wrap: wrap; justify-content: center; gap: 4px 6px; }
.jump-g[hidden], #wrapper .jump a[hidden], .jumplist a[hidden] { display: none; }
.jump-gt { flex-basis: 100%; white-space: nowrap; font: 800 var(--fs-xl) var(--head); color: var(--ink); }
#wrapper .jump-gt img, .jumplist .jump-gt img { width: auto; height: 28px; margin: 0; vertical-align: middle; box-shadow: none; }
.jump .pill, .jumpbar .pill { padding: 4px 12px 5px; font-size: var(--fs-sm); }
.jumpbar { position: fixed; z-index: 150; top: calc(var(--top-h) + 6px); left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 8px;
  max-width: calc(100% - 24px); box-sizing: border-box; padding: 4px 6px; background: var(--panel); box-shadow: 0 0 0 2px var(--card-line); border-bottom: 3px solid var(--blue); border-radius: var(--r-pill); }
.jumpbar[hidden] { display: none; }
.jumpbar .jb-cur { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 700 var(--fs-md) var(--head); color: var(--ink); }
.jumplist { position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); width: min(560px, calc(100vw - 24px)); max-height: 70vh; overflow: auto;
  box-sizing: border-box; padding: 10px; background: var(--panel); border-bottom: 4px solid var(--blue); border-radius: 16px; }
.jumplist[hidden] { display: none; }
#wrapper :is(h2, section, [data-jump])[id] { scroll-margin-top: calc(var(--top-h) + var(--secbar-h, 52px)); }
/* Yo-kai pages: the section pills stay under the navbar while the page scrolls, no panel behind them (Leafy 2026-10-17) */
body.shell #wrapper nav.secbar { position: sticky; z-index: 150; top: calc(var(--top-h) + 6px); display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 5px;
  width: auto; height: auto; margin: 10px 0 18px; padding: 0; background: none; box-shadow: none; }
.secbar .pill { display: flex; align-items: center; padding: 4px 12px 5px; font-size: var(--fs-sm); line-height: 1.15; white-space: nowrap; }
.secbar .pill[hidden] { display: none; }
#wrapper .secbar .pill img { display: inline; flex: none; width: auto; height: 20px; max-width: none; margin: 0 5px 0 -2px; }
@media (max-width: 640px) {
  body.shell #wrapper nav.secbar { gap: 3px; }
  .secbar .pill { padding: 2px 8px 3px; font-size: var(--fs-xs); }
  #wrapper .secbar .pill img { height: 15px; margin: 0 3px 0 -3px; }
}
.secbar .pill[hidden] { display: none; }
.secbar .pill:focus { outline: none; }
.secbar .pill:focus-visible { outline: 2px solid var(--yellow); outline-offset: 2px; }
.jumplist .jump-gt { color: var(--link); text-decoration: none; }

/* Stacks / doesn't stack (docs/systems/stacking.md): green or red pill under a skill or soul effect, the facts on a line under it */
.stack { margin: 8px auto; text-align: center; }
.stack-pill { display: inline-block; padding: 3px 14px 4px; border-radius: var(--r-pill); font: 800 var(--fs-base) var(--title);
  color: var(--outline-fill); -webkit-text-stroke: var(--mut-line); paint-order: stroke fill; }
.stack-yes { background: var(--stack-yes); }
.stack-no { background: var(--stack-no); }
.stack-why { display: block; margin-top: 4px; font-size: var(--fs-md); }