/* 色・字・箱の基本 */
:root{
  --bg:#0d0f14; --sur:#151922; --sur2:#1c2130; --line:#262d3d; --line2:#38415a;
  --tx:#eef1f7; --dim:#7f8ba3;
  --irm:#ffc247; --gem:#6ff0cf; --bad:#ff3d7f; --ok:#5fd0ff; --good:#7bec9c;
  --faint:#78849e;          /* うすい文字。罫線の --line2 とは別に持つ */
  --mine:#2a3145;           /* 自分の発言の背景 */
  /* 字（2026-09-12 に変えた）：本文は M PLUS 2、見出しは M PLUS Rounded 1c。どちらも自分の所から配る（css/00-fonts.css）。
     前は端末の字（Windows だと Yu Gothic）で、細く薄く「ダサい」と言われていた。届かない端末では下の順で代わりを使う */
  --jp:"M PLUS 2","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic Medium","Meiryo",sans-serif;
  --disp:"M PLUS Rounded 1c","M PLUS 2","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  --num:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
[hidden]{display:none!important}   /* 属性 hidden は必ず効く。id に display を書くと [hidden] に勝ってしまい、見えない蓋が残る（2026-09-23 に SANDBOX で発生） */
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--tx);font-family:var(--jp);font-size:15px;line-height:1.7;-webkit-text-size-adjust:100%;font-feature-settings:"palt"}
/* 見出し・大きな字は丸い字で。サイトの顔になる所だけ */
#logo,h2,#heroline,.tyctat b,.tl b,.fshd b,.bigcta,.tyk,.tgh,.mgh,.tbhd b,.cutbox b,.lvbadge,.ulhd b,.hfhd,.stlabel,.rbih,.askhd{font-family:var(--disp)}
.n{font-family:var(--num);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--ok);outline-offset:2px}
/* 文字の大きさ（マイページ）。zoom で画面ぜんたいを拡大。タイピングのベルトだけ打ち消して等倍 */
html.fs-l{zoom:1.12}html.fs-xl{zoom:1.25}
html.fs-l #v-type{zoom:.8929}html.fs-xl #v-type{zoom:.8}
/* 遊ぶ場所の高さの上限（2026-09-26、持ち主「倍率 100% で見切れずに」）。画面の高さから上下 8px ずつ引いた値。
   html の zoom（文字の大きさ）をかけると 100vh も一緒に大きくなるので、--z で割り戻す */
:root{--z:1;--fitH:calc(100vh / var(--z) - 16px)}
html.fs-l{--z:1.12}html.fs-xl{--z:1.25}
@supports (height:100dvh){:root{--fitH:calc(100dvh / var(--z) - 16px)}}
.fsb[aria-pressed="true"]{border-color:var(--irm);color:var(--tx);background:var(--sur)}

#top{position:sticky;top:0;z-index:40;background:rgba(13,15,20,.93);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
/* 背の低い画面では、下へ読み進めると帯を隠し、上へ戻すと出す（19e-ux.js の uxHdScroll） */
#top{transition:transform .22s ease}
#top.hdhide{transform:translateY(-100%)}
#topin{max-width:900px;margin:0 auto;padding:11px 18px;display:flex;align-items:baseline;gap:16px}
#logo{font-weight:800;font-size:16px;letter-spacing:-.03em;margin:0}
#logo b{color:var(--irm)}
#purse{margin-left:auto;display:flex;gap:18px;font-size:12px;color:var(--dim)}
#purse>div{white-space:nowrap}
#purse b{font-size:15px;font-weight:800;margin-left:5px}
#irmv{color:var(--irm)}
#gemv{color:var(--gem)}
nav{max-width:900px;margin:0 auto;display:flex;overflow-x:auto;scrollbar-width:none;padding:0 8px}
nav::-webkit-scrollbar{display:none}
nav button{flex:0 0 auto;background:none;border:0;color:var(--dim);font-size:13.5px;font-weight:700;padding:8px 12px 11px;cursor:pointer;white-space:nowrap;position:relative;transition:color .15s}
nav button:hover{color:var(--tx)}
nav button[aria-current="true"]{color:var(--tx)}
nav button[aria-current="true"]::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;background:var(--irm)}
main{max-width:900px;margin:0 auto;padding:28px 18px 90px}
section[hidden]{display:none}
h2{font-size:15px;font-weight:800;margin:0 0 3px;color:var(--dim)}
.lede{color:var(--dim);margin:0 0 26px;font-size:13.5px}
.card{background:var(--sur);border-radius:12px;padding:18px;margin-bottom:14px}
.hair{border-top:1px solid var(--line);margin:14px 0}
.btn{background:var(--sur2);color:var(--tx);border:1px solid var(--line2);border-radius:8px;font-size:13.5px;font-weight:700;padding:10px 17px;cursor:pointer;transition:border-color .15s,transform .06s}
.btn:hover:not(:disabled){border-color:var(--dim)}
.btn:active:not(:disabled){transform:translateY(1px)}
.btn:disabled{opacity:.3;cursor:default}
.btn.go{background:var(--irm);color:#181203;border-color:transparent}
.btn.sm{padding:6px 12px;font-size:12.5px;border-radius:7px}
.empty{color:var(--dim);text-align:center;padding:44px 12px;font-size:13.5px}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}

#hero{padding:46px 0 30px}
#heroline{font-size:clamp(24px,6.4vw,44px);font-weight:800;line-height:1.4;letter-spacing:-.035em;min-height:2.5em}
#heroline i{font-style:normal;display:inline-block}
#heroline i.bad{color:var(--bad)}
.gl{animation:gl .5s steps(2,end)}
@keyframes gl{0%{transform:translate(0)}18%{transform:translate(-4px,1px);text-shadow:4px 0 var(--bad),-4px 0 var(--ok)}
38%{transform:translate(4px,-2px);text-shadow:-4px 0 var(--bad),4px 0 var(--ok)}58%{transform:translate(-2px,0);text-shadow:2px 0 var(--bad)}100%{transform:translate(0);text-shadow:none}}
#herocap{color:var(--dim);font-size:13px;margin-top:20px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.tl{background:var(--sur);border-radius:12px;padding:16px;text-align:left;cursor:pointer;border:1px solid transparent;color:inherit;transition:border-color .15s}
.tl:hover{border-color:var(--line2)}
.tl b{display:block;font-size:15px;margin-bottom:2px}
.tl span{color:var(--dim);font-size:12.5px}

#mgrid{display:grid;gap:14px}
@media(min-width:660px){#mgrid{grid-template-columns:1fr 1fr}}
#orebig{font-size:46px;font-weight:800;color:var(--irm);line-height:1;letter-spacing:-.04em}
#dig{width:100%;padding:30px 0;font-size:19px;font-weight:800;background:var(--sur2);color:var(--tx);border:1px solid var(--line2);border-radius:10px;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:manipulation;margin-top:18px}
#dig:active{background:#2a3145;border-color:var(--irm)}
#bar{height:4px;background:var(--sur2);border-radius:2px;margin:14px 0 5px;overflow:hidden}
#barf{height:100%;background:var(--irm);width:0}
.up{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--line)}
.up:first-child{border-top:0}
.up .t{flex:1}
.up .t b{display:block;font-size:13.5px}
.up .t span{color:var(--dim);font-size:12px}
.spark{position:fixed;pointer-events:none;font-weight:800;color:var(--irm);font-size:15px;z-index:50}

