/* 共通の土台。色は sea.css（暗い）と board.css（明るい）が持つ。 */
:root{
  --dp:"Zen Kaku Gothic New","Hiragino Sans",sans-serif;
  --la:"Jost","Zen Kaku Gothic New",sans-serif;
  --nu:"JetBrains Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{min-height:100%}
body{margin:0;font-family:var(--dp);line-height:1.7;overflow-x:hidden;-webkit-tap-highlight-color:transparent}
h1,h2,h3{margin:0;text-wrap:balance}
p{margin:0}
a{color:inherit}
img{max-width:100%}
[hidden]{display:none!important}
.nu{font-family:var(--nu);font-variant-numeric:tabular-nums}
.inline{display:inline;margin:0}
.wrap{position:relative;z-index:1;max-width:1140px;margin:0 auto;width:100%;
  padding-left:max(18px,env(safe-area-inset-left,0px));
  padding-right:max(18px,env(safe-area-inset-right,0px))}
.roombody{padding-bottom:72px}

/* ───── 帯 ───── */
.bar{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;padding-block:13px 9px}
.home{display:flex;align-items:center;gap:13px;text-decoration:none;min-width:0}
.crest{display:block;width:46px;height:46px;flex:0 0 auto;background:url(/static/img/emblem.png) center/contain no-repeat;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.28));animation:turn 26s linear infinite}
.crest.big{width:62px;height:62px}
.crest.mid{width:70px;height:70px;margin:0 auto 14px}
@keyframes turn{to{transform:rotate(360deg)}}
.bn{display:flex;flex-direction:column;line-height:1.1}
.bn .w{position:relative;display:inline-block;overflow:hidden;font-weight:900;font-size:22px;letter-spacing:.28em;
  -webkit-background-clip:text;background-clip:text;color:transparent}
.bn .w::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-40%;width:26%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.95),transparent);
  transform:skewX(-18deg);animation:issen 7.5s ease-in-out infinite}
@keyframes issen{0%,74%{left:-40%}90%,100%{left:132%}}
.bn .s{font-family:var(--la);font-weight:300;font-size:10px;letter-spacing:.44em;margin-top:5px}
.right{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-left:auto}
.btnchip{cursor:pointer;font-family:inherit;text-decoration:none;transition:transform .2s,box-shadow .2s}
.btnchip:hover{transform:translateY(-1px)}

/* ───── 六つの門の案内 ───── */
.roomnav{display:flex;gap:4px;overflow-x:auto;padding-bottom:9px;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;mask-image:linear-gradient(90deg,#000 94%,transparent)}
.roomnav::-webkit-scrollbar{display:none}
.roomnav a{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:6px 13px 6px 8px;border-radius:999px;
  text-decoration:none;font-size:12.5px;font-weight:500;white-space:nowrap;border:1px solid transparent;
  transition:background .2s,border-color .2s,color .2s}
.roomnav i{font-style:normal;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:10.5px}
.roomnav a.on{font-weight:900}

/* ───── 見出し ───── */
.sec{margin-top:36px;animation:fup .6s cubic-bezier(.2,.9,.3,1) both}
.sec:nth-of-type(2){animation-delay:.06s}.sec:nth-of-type(3){animation-delay:.12s}
.sec:nth-of-type(4){animation-delay:.18s}.sec:nth-of-type(5){animation-delay:.24s}
@keyframes fup{from{opacity:0;transform:translateY(14px)}}

/* ───── ボタン ───── */
.primary,.secondary{display:inline-block;border-radius:13px;padding:12px 24px;font-family:inherit;font-size:13.5px;font-weight:700;
  cursor:pointer;text-align:center;text-decoration:none;line-height:1.4;transition:transform .2s,box-shadow .2s,filter .2s}
.primary{border:0;color:#06223f;background:linear-gradient(110deg,#c9a227,#fff3cf 55%,#e8c86a);
  box-shadow:0 8px 22px rgba(201,162,39,.32);background-size:160% 100%;animation:sheen 7s ease-in-out infinite}
@keyframes sheen{50%{background-position:100% 0}}
.primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(201,162,39,.42)}
.primary:disabled{opacity:.55;cursor:default;transform:none}
.secondary{background:transparent}
.secondary:hover{transform:translateY(-1px)}
.secondary.small{padding:7px 14px;font-size:12px;border-radius:10px}
.aslink{display:inline-block}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px;justify-content:center}
:focus-visible{outline:2px solid #e3bd52;outline-offset:2px}

/* ───── 札 ───── */
.pill{display:inline-block;padding:2px 11px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.04em;white-space:nowrap}
.emptyic{display:block;width:92px;height:92px;margin:6px auto 12px;background:url(/static/img/emblem.png) center/contain no-repeat;
  opacity:.5;animation:floaty 6.5s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-7px)}}
.emptycard{padding:34px 22px 30px;text-align:center;font-size:13.5px}
.emptycard h3{font-size:18px;font-weight:900;letter-spacing:.06em;margin-bottom:8px}
.emptycard .pill{margin-bottom:6px}
.dimp{font-size:12px}
.below{margin-top:12px;text-align:center}
.pre{white-space:pre-wrap;word-break:break-word}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
