/* AI Museum: colours and font of setsuna-lab.com (home/src/styles/base.css) */
:root {
  --bg: #e8eae7; --card: #fff; --ink: #1d3236; --sub: #5b7476; --line: #dcdfdb;
  --main: #1e7789; --main-ink: #fff; --hot: #f0705f; --star: #ffe09f; --soft: #e3f1ef;
  --grey: #a9b8b9; --main2: #5fb3bd; --hot-ink: #1d3236;
  --shadow: 0 1px 2px rgba(29, 50, 54, 0.06), 0 6px 20px rgba(29, 50, 54, 0.08);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #12282c; --card: #1a3539; --ink: #eef5f3; --sub: #a3bdbd; --line: #2a4a4f;
    --main: #5fb3bd; --main-ink: #12282c; --hot: #f48a7c; --star: #e8c97a; --soft: #20434a;
    --grey: #6f8a8c; --main2: #2f8794; --hot-ink: #12282c;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 6px 20px rgba(0, 0, 0, 0.25);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #12282c; --card: #1a3539; --ink: #eef5f3; --sub: #a3bdbd; --line: #2a4a4f;
  --main: #5fb3bd; --main-ink: #12282c; --hot: #f48a7c; --star: #e8c97a; --soft: #20434a;
  --grey: #6f8a8c; --main2: #2f8794; --hot-ink: #12282c;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 6px 20px rgba(0, 0, 0, 0.25);
  color-scheme: dark;
}
/* the hall pages draw with these names */
:root { --panel: var(--bg); --fg: var(--ink); --quiet: var(--sub); --rule: var(--line); --w1: var(--main); --w2: var(--grey); --w3: var(--main2); --hit: var(--hot); --hitbg: color-mix(in srgb, var(--hot) 30%, var(--card)); }

@font-face { font-family: "Setsuna Noto"; font-weight: 400; src: local("Noto Sans CJK JP"), local("NotoSansCJKjp-Regular"), local("Noto Sans JP"); ascent-override: 88%; descent-override: 12%; line-gap-override: 0%; }
@font-face { font-family: "Setsuna Noto"; font-weight: 700; src: local("Noto Sans CJK JP Bold"), local("NotoSansCJKjp-Bold"), local("Noto Sans JP Bold"); ascent-override: 88%; descent-override: 12%; line-gap-override: 0%; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: "Hiragino Sans", "Setsuna Noto", "Noto Sans JP", "Yu Gothic UI", system-ui, sans-serif; font-size: 16px; line-height: 1.8; }
a { color: inherit; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3, p, li, dd { word-break: auto-phrase; text-wrap: pretty; }
[hidden] { display: none !important; }
.wrap { width: min(1080px, 100% - 32px); margin-inline: auto; }

.top { padding-top: 16px; }
.top-in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; min-height: 48px; }
.brand { font-weight: 700; font-size: 1.1rem; text-decoration: none; }
.nav { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--card); font-size: 0.9rem; }
.nav a { text-decoration: none; color: var(--sub); padding: 4px 16px; border-radius: 999px; }
.nav a:hover { color: var(--ink); }
.nav a[aria-current="page"] { background: var(--ink); color: var(--bg); }
.foot { margin-top: 48px; padding-block: 28px; color: var(--sub); font-size: 0.9rem; }
.foot-in { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; }
.foot a { text-decoration: none; }
.foot a:hover { color: var(--main); }

/* the card of a chosen point on a map of points (map-parts.js, mapTip) */
.map-tip{position:absolute;left:0;top:0;z-index:2;pointer-events:none;width:15rem;padding:8px 12px;border-radius:8px;background:rgba(13,35,39,.88);border:1px solid #2a4a4f;color:#eef5f3;font-size:.85rem;line-height:1.6;display:grid;gap:2px;text-align:left}
.map-tip[hidden]{display:none}
.map-tip b{color:#ffe09f;font-size:1rem}
.map-tip .sub{color:#a3bdbd;font-size:.78rem}
.map-tip ul{list-style:none;margin:0;padding:0}
.map-tip li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}
.map-tip .c{color:#a3bdbd;font-variant-numeric:tabular-nums}
.map-tip .nm{display:block;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.map-tip .nm>span{display:inline-block}
.map-tip .nm.run{text-overflow:clip}
.map-tip .nm.run>span{animation:maptip-run var(--t) ease-in-out infinite alternate}
@keyframes maptip-run{0%,15%{transform:none}85%,100%{transform:translateX(var(--d))}}
@media (prefers-reduced-motion:reduce){.map-tip .nm.run>span{animation:none}}
/* one page holds the entrance and the rooms (build.py); the one on show is the .view without hidden */
.view[hidden]{display:none}
