/* tube8jp.com 専用スタイル
   ホテルのキーボード: くるみ材、真鍮、生成りの紙。他サイトと共有しない。 */

:root{
  --paper:#f4ebda;
  --paper-2:#fbf5e8;
  --paper-3:#efe3cd;
  --wood:#38251a;
  --wood-2:#4a3323;
  --wood-3:#2a1b12;
  --brass:#b08644;
  --brass-hi:#d9b87c;
  --brass-dim:#8d6a35;
  --ink:#2b2118;
  --ink-2:#4a3a2a;
  --mute:#77634c;
  --line:#d8c6a7;
  --line-2:#c3a97f;
  --wine:#7c3030;
  --serif:"Shippori Mincho B1","Noto Serif JP",serif;
  --sans:"Zen Kaku Gothic New","Noto Sans JP",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --wrap:1180px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:15.5px;line-height:1.92;
  background-image:
    repeating-linear-gradient(90deg,rgba(120,90,50,.028) 0 1px,transparent 1px 7px),
    radial-gradient(1000px 500px at 88% -10%,rgba(176,134,68,.10),transparent 70%);
}
img{max-width:100%;display:block}
figure{margin:0}
a{color:inherit;text-decoration:none}
p{margin:0 0 15px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.5;letter-spacing:.02em}
.mono{font-family:var(--mono)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}

/* 上部の細帯 */
.desk-strip{background:var(--wood-3);color:#e8d7bb;border-bottom:1px solid var(--brass-dim)}
.desk-strip .wrap{display:flex;justify-content:space-between;gap:14px;padding-top:8px;padding-bottom:8px;font-family:var(--mono);font-size:10px;letter-spacing:.17em;text-transform:uppercase}
.desk-strip b{color:var(--brass-hi);font-weight:500}
.desk-strip .right{color:#bda78a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 受付ヘッダ */
.front{background:linear-gradient(180deg,var(--paper-2),var(--paper));border-bottom:3px double var(--line-2)}
.front .wrap{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:30px;padding-top:18px;padding-bottom:0}
.mark{display:flex;align-items:center;gap:14px;padding-bottom:16px}
.mark .emblem{width:42px;height:42px;border:1px solid var(--brass);border-radius:50%;position:relative;flex:none;background:radial-gradient(circle at 34% 30%,#fff8e8,#e9d6b4)}
.mark .emblem::before{content:"";position:absolute;left:11px;top:13px;width:12px;height:12px;border:2px solid var(--brass-dim);border-radius:50%}
.mark .emblem::after{content:"";position:absolute;left:22px;top:18px;width:16px;height:4px;background:var(--brass-dim);box-shadow:0 6px 0 -1px var(--brass-dim)}
.mark b{display:block;font-family:var(--serif);font-size:31px;letter-spacing:.19em;line-height:1;font-weight:600}
.mark span{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.26em;color:var(--mute);margin-top:6px;text-transform:uppercase}

/* 鍵を掛けるレール */
.rail{display:flex;justify-content:flex-end;align-items:flex-end;gap:6px;flex-wrap:wrap;position:relative;padding-bottom:10px}
.rail::before{content:"";position:absolute;left:0;right:0;bottom:34px;height:1px;background:linear-gradient(90deg,transparent,var(--line-2) 12%,var(--line-2) 88%,transparent)}
.fob{position:relative;display:flex;flex-direction:column;align-items:center;padding-top:13px}
.fob .ring{width:11px;height:11px;border:2px solid var(--brass);border-radius:50%;background:var(--paper-2);position:relative;z-index:2;margin-bottom:-2px}
.fob .tag{display:block;background:var(--paper-2);border:1px solid var(--line-2);border-radius:2px;padding:7px 12px 8px;text-align:center;min-width:64px;box-shadow:0 2px 0 rgba(74,51,35,.10);transition:transform .15s ease,background .15s ease}
.fob .tag i{display:block;font-family:var(--mono);font-style:normal;font-size:8.5px;letter-spacing:.14em;color:var(--brass-dim);margin-bottom:2px}
.fob .tag b{display:block;font-size:12.5px;font-weight:500;letter-spacing:.06em;white-space:nowrap}
.fob:hover .tag{transform:translateY(-3px)}
.fob.on .tag{background:var(--wood);border-color:var(--wood);color:var(--paper-2)}
.fob.on .tag i{color:var(--brass-hi)}
.enter-plate{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:linear-gradient(180deg,#c39a57,#a87c3c);color:#2c1d10;border:1px solid #8b6529;border-radius:2px;padding:9px 18px 10px;box-shadow:inset 0 1px 0 rgba(255,240,205,.65),0 2px 0 rgba(58,38,24,.25);margin-bottom:16px;flex:none}
.enter-plate b{font-family:var(--serif);font-size:14px;letter-spacing:.1em;font-weight:600}
.enter-plate i{font-family:var(--mono);font-style:normal;font-size:8px;letter-spacing:.22em}

/* ロビー（ヒーロー） */
.lobby{padding:46px 0 34px}
.lobby .wrap{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:44px;align-items:start}
.eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.26em;color:var(--brass-dim);text-transform:uppercase;margin:0 0 16px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--brass)}
.lobby h1{font-size:44px;line-height:1.42;margin:0 0 22px;letter-spacing:.03em}
.lobby h1 em{font-style:normal;white-space:nowrap;box-shadow:inset 0 -9px 0 rgba(176,134,68,.24)}
.lobby p{color:var(--ink-2);max-width:34em}
.acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 24px;font-size:14px;letter-spacing:.05em;border:1px solid var(--wood);background:var(--wood);color:var(--paper-2);border-radius:2px}
.btn.ghost{background:transparent;color:var(--wood);border-color:var(--line-2)}
.btn small{font-family:var(--mono);font-size:9px;letter-spacing:.16em;opacity:.7}

/* 鍵板とスクリーン */
.board{position:relative;background:
  repeating-linear-gradient(93deg,rgba(255,255,255,.035) 0 2px,transparent 2px 9px),
  linear-gradient(160deg,#4b3222,#332014 70%);
  border:1px solid #24160e;border-radius:3px;padding:17px 17px 14px;
  box-shadow:0 16px 30px -22px rgba(42,27,18,.85),inset 0 1px 0 rgba(217,184,124,.18)}
.board::before,.board::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f0d9a8,#9a7133);box-shadow:0 0 0 1px rgba(42,27,18,.5)}
.board::before{left:6px;top:6px}
.board::after{right:6px;top:6px}
.board .lower-screw{position:absolute;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f0d9a8,#9a7133);bottom:6px}
.board .lower-screw.l{left:6px}
.board .lower-screw.r{right:6px}
.mount{background:var(--paper-2);border:1px solid rgba(216,183,124,.55);padding:9px 9px 0}
.mount img{width:100%;height:auto;border:1px solid #b9a37f}
.mount figcaption{font-size:12px;line-height:1.72;color:var(--ink-2);padding:10px 2px 11px;border-top:1px dotted var(--line-2);margin-top:9px}
.mount figcaption b{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--brass-dim);display:block;margin-bottom:3px;font-weight:500}
.board .room-plate{position:absolute;left:26px;bottom:-13px;background:linear-gradient(180deg,#c8a05f,#a97e3c);border:1px solid #7f5c25;color:#2b1c0f;font-family:var(--mono);font-size:10px;letter-spacing:.12em;padding:6px 10px;box-shadow:0 3px 6px rgba(42,27,18,.3)}

/* 提携先 */
.pblock{background:var(--paper-3);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);padding:24px 0 26px;margin-top:8px}
.pblock .head{display:flex;align-items:baseline;gap:14px;margin-bottom:16px}
.pblock h2{font-family:var(--mono);font-size:10px;letter-spacing:.3em;font-weight:500;color:var(--mute);margin:0;text-transform:uppercase}
.pblock .head span{flex:1;height:1px;background:var(--line-2)}
.pblock .head em{font-style:normal;font-size:11px;color:var(--mute);letter-spacing:.08em}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pcell{display:flex;align-items:center;justify-content:center;height:104px;background:var(--paper-2);border:1px solid var(--line);border-radius:2px;box-shadow:inset 0 0 0 3px rgba(216,198,167,.28);padding:10px}
.pcell img{height:60px;width:auto;max-width:100%;object-fit:contain}

/* 帳票ブロック */
.sheet{padding:54px 0 8px}
.sheet + .sheet{padding-top:38px}
.sheet-head{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.sheet-head .num{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--brass-dim);border:1px solid var(--line-2);padding:4px 7px;flex:none}
.sheet-head h2{font-size:27px;margin:0;letter-spacing:.03em}
.sheet-head .rule{flex:1;height:1px;background:var(--line-2)}
.sheet-head .meta{font-family:var(--mono);font-size:9px;letter-spacing:.18em;color:var(--mute);text-transform:uppercase;white-space:nowrap}
.lede{max-width:52em;color:var(--ink-2)}
.cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-top:22px}
.cols3 h3{font-size:17px;margin:0 0 8px;padding-bottom:7px;border-bottom:1px solid var(--line)}
.cols3 p{font-size:14.5px;color:var(--ink-2);margin:0}
.cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;margin-top:18px}

/* 見本カード */
.guestcard{background:var(--paper-2);border:1px solid var(--line-2);padding:16px 18px 14px;position:relative;box-shadow:0 8px 20px -18px rgba(42,27,18,.6)}
.guestcard .stamp{position:absolute;right:12px;top:12px;font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;color:var(--wine);border:1px solid rgba(124,48,48,.5);padding:3px 6px;transform:rotate(3deg)}
.guestcard .row{display:flex;gap:12px;padding:7px 0;border-bottom:1px dotted var(--line);font-size:13.5px}
.guestcard .row:last-child{border-bottom:0}
.guestcard .k{width:88px;flex:none;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;color:var(--brass-dim);text-transform:uppercase;padding-top:3px}
.guestcard .v{color:var(--ink)}
.guestcard .v b{font-weight:600}

/* 並びの一覧 */
.sortbox{margin-top:20px;border-top:2px solid var(--wood)}
.sortrow{display:grid;grid-template-columns:74px minmax(0,1fr) 176px;gap:16px;align-items:baseline;padding:11px 4px;border-bottom:1px solid var(--line)}
.sortrow .code{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--brass-dim)}
.sortrow b{font-size:15px;font-weight:600}
.sortrow .use{font-size:12.5px;color:var(--mute);text-align:right}

/* 細かい台帳 */
.ledger{margin-top:18px;border-top:1px solid var(--line-2)}
.lrow{display:grid;grid-template-columns:64px minmax(0,1fr) 74px 72px;gap:14px;align-items:center;padding:10px 2px;border-bottom:1px solid var(--line);font-size:13px}
.lrow .time{font-family:var(--mono);font-size:11px;color:var(--brass-dim)}
.lrow .title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lrow .views,.lrow .rate{font-family:var(--mono);font-size:10.5px;color:var(--mute);text-align:right}

/* 手順 */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:22px;counter-reset:st}
.step{background:var(--paper-2);border:1px solid var(--line);border-top:3px solid var(--brass);padding:16px 18px}
.step .n{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--brass-dim)}
.step b{display:block;font-size:15.5px;margin:4px 0 6px}
.step p{font-size:13.5px;color:var(--ink-2);margin:0}

/* 内頁の見出し */
.pagehead{padding:44px 0 8px}
.pagehead .wrap{max-width:980px}
.pagehead .eyebrow{margin-bottom:12px}
.pagehead h1{font-size:38px;margin:0 0 14px;letter-spacing:.04em}
.pagehead p{color:var(--ink-2);max-width:46em}
.body{max-width:980px;margin:0 auto;padding:0 28px}

/* 鍵束 */
.rack{background:
  repeating-linear-gradient(92deg,rgba(255,255,255,.03) 0 2px,transparent 2px 10px),
  linear-gradient(165deg,#4b3222,#312016 75%);
  border:1px solid #24160e;border-radius:3px;padding:26px 22px 22px;margin:28px 0 10px;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;
  box-shadow:inset 0 1px 0 rgba(217,184,124,.18)}
.keycard{background:var(--paper-2);border:1px solid #a98c62;border-radius:2px;padding:16px 17px 14px;position:relative;margin-top:12px}
.keycard::before{content:"";position:absolute;left:50%;top:-25px;width:13px;height:13px;margin-left:-6px;border:2px solid var(--brass-hi);border-radius:50%;background:#3a261a}
.keycard::after{content:"";position:absolute;left:50%;top:-12px;width:1px;height:12px;background:var(--brass-hi);margin-left:0}
.keycard .kn{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;color:var(--brass-dim);display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.keycard .kn i{font-style:normal;color:var(--wine)}
.keycard h3{font-family:var(--sans);font-size:15px;font-weight:600;line-height:1.55;margin:0 0 8px;letter-spacing:0}
.keycard .meta{font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;color:var(--mute);display:flex;flex-wrap:wrap;gap:6px 12px;padding:7px 0;border-top:1px dotted var(--line);border-bottom:1px dotted var(--line);margin-bottom:8px}
.keycard p{font-size:13px;line-height:1.8;color:var(--ink-2);margin:0}

/* 分類（階の案内） */
.directory{margin:26px 0 0;border:1px solid var(--line-2);background:var(--paper-2)}
.dirhead{background:var(--wood);color:var(--paper-2);padding:12px 20px;display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:.2em}
.floorrow{display:grid;grid-template-columns:92px minmax(0,1fr) 150px;gap:22px;padding:22px 22px 20px;border-bottom:1px solid var(--line)}
.floorrow:last-child{border-bottom:0}
.floorno{font-family:var(--mono);font-size:30px;letter-spacing:-.02em;color:var(--brass-dim);line-height:1.1}
.floorno span{display:block;font-size:8.5px;letter-spacing:.2em;color:var(--mute);margin-top:6px}
.floorrow h2{font-size:21px;margin:0 0 6px}
.floorrow p{font-size:13.8px;color:var(--ink-2);margin:0 0 6px}
.floorrow .how{font-size:12.5px;color:var(--mute);border-left:2px solid var(--line-2);padding-left:10px}
.count{text-align:right;font-family:var(--mono);font-size:17px;color:var(--ink)}
.count span{display:block;font-size:9px;letter-spacing:.16em;color:var(--mute);margin-top:4px}

/* 手引き */
.chapter{margin:34px 0 0;padding-left:64px;position:relative}
.chapter .chapno{position:absolute;left:0;top:2px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--brass-dim);border-top:1px solid var(--brass);padding-top:6px;width:40px}
.chapter h2{font-size:23px;margin:0 0 10px}
.chapter p{color:var(--ink-2)}
.tip{margin:16px 0 0;padding:12px 16px;background:rgba(216,198,167,.34);border-left:3px solid var(--brass);font-size:13.5px}
.tip b{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;color:var(--brass-dim);display:block;margin-bottom:3px;font-weight:500}

/* 質問 */
.ask{margin:26px 0 0;border-top:1px solid var(--line-2)}
.qa{padding:18px 0 16px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px}
.qmark{width:28px;height:28px;border-radius:50%;border:1px solid var(--brass);background:var(--paper-2);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:var(--brass-dim)}
.qa h2{font-family:var(--sans);font-size:16px;font-weight:600;line-height:1.7;margin:0 0 6px;letter-spacing:0}
.qa p{font-size:14px;color:var(--ink-2);margin:0}
.qa p b{color:var(--ink)}

/* 記録 */
.record{margin:30px 0 0;padding-top:22px;border-top:1px solid var(--line)}
.record:first-of-type{border-top:0;padding-top:0}
.record h2{font-size:22px;margin:0 0 10px}
.record p{color:var(--ink-2)}
.facttable{width:100%;border-collapse:collapse;margin:14px 0 6px;font-size:13.5px}
.facttable th,.facttable td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
.facttable th{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:var(--brass-dim);font-weight:500;width:42%}
.facttable td{font-family:var(--mono);font-size:12px}

/* 図版 */
.figure{margin:26px 0 6px;background:var(--paper-2);border:1px solid var(--line-2);padding:10px}
.figure img{width:100%;height:auto;border:1px solid #b9a37f}
.figure figcaption{font-size:12px;line-height:1.7;color:var(--ink-2);padding:9px 2px 2px}
.figure figcaption b{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--brass-dim);font-weight:500}

/* 404 */
.nofound{padding:80px 0 90px;text-align:center}
.nofound .tagbig{display:inline-block;position:relative;background:var(--paper-2);border:1px solid var(--line-2);padding:30px 46px 26px;box-shadow:0 14px 24px -22px rgba(42,27,18,.7)}
.nofound .tagbig::before{content:"";position:absolute;left:50%;top:-34px;width:20px;height:20px;margin-left:-10px;border:3px solid var(--brass);border-radius:50%;background:var(--paper)}
.nofound .tagbig::after{content:"";position:absolute;left:50%;top:-14px;width:1px;height:14px;background:var(--brass)}
.nofound .tagbig span{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--brass-dim)}
.nofound .tagbig h1{font-family:var(--serif);font-size:64px;line-height:1.1;letter-spacing:.06em;margin:4px 0 2px}
.nofound .tagbig i{font-style:normal;font-size:13px;color:var(--mute)}
.nofound p{max-width:34em;margin:34px auto 0;color:var(--ink-2)}
.nofound .links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:22px}
.nofound .links a{border:1px solid var(--line-2);padding:8px 16px;font-size:13px;background:var(--paper-2)}

/* 脚注 */
.foot{background:var(--wood-3);color:#cdb99d;margin-top:64px;border-top:3px double var(--brass-dim)}
.foot .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px;padding-top:34px;padding-bottom:26px}
.foot b{font-family:var(--serif);color:var(--brass-hi);font-size:19px;letter-spacing:.14em;font-weight:600;display:block;margin-bottom:8px}
.foot p{font-size:12px;line-height:1.85;color:#bda78a;margin:0 0 6px}
.foot h3{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;color:var(--brass);font-weight:500;margin:0 0 8px}
.foot nav{display:flex;flex-wrap:wrap;gap:6px 14px}
.foot nav a{font-size:12px;color:#d6c3a6}
.foot .age{font-family:var(--mono);font-size:10px;letter-spacing:.1em;border:1px solid #6b5134;display:inline-block;padding:4px 8px;color:var(--brass-hi);margin-bottom:8px}
.foot .base{border-top:1px solid #4b3524;padding:12px 0 16px;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;color:#9c8569;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

@media(max-width:980px){
  .lobby .wrap{grid-template-columns:1fr;gap:34px}
  .lobby h1{font-size:38px}
  .board{max-width:660px}
  .cols3{gap:18px}
  .front .wrap{gap:18px}
  .rail{gap:4px}
  .fob .tag{padding:7px 9px;min-width:0}
  .foot .wrap{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  body{font-size:15px}
  .wrap{padding:0 18px}
  .desk-strip .wrap{font-size:8.5px;letter-spacing:.1em}
  .desk-strip .right{display:none}
  .front .wrap{grid-template-columns:minmax(0,1fr) auto;gap:10px;padding-top:14px}
  .mark{padding-bottom:10px;gap:10px}
  .mark .emblem{width:34px;height:34px}
  .mark .emblem::before{left:9px;top:10px;width:10px;height:10px}
  .mark .emblem::after{left:18px;top:14px;width:13px;height:3px;box-shadow:0 5px 0 -1px #8d6a35}
  .mark b{font-size:24px;letter-spacing:.13em}
  .mark span{font-size:7.5px;letter-spacing:.18em}
  .enter-plate{grid-column:2;grid-row:1;justify-self:end;padding:7px 11px;margin-bottom:10px}
  .enter-plate b{font-size:12px}
  .enter-plate i{display:none}
  .rail{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 8px;justify-content:stretch;padding:6px 0 12px}
  .rail::before{display:none}
  .fob .tag{width:100%}
  .fob{padding-top:10px}
  .fob .tag{padding:5px 7px 6px}
  .fob .tag b{font-size:11px}
  .fob .tag i{font-size:7.5px}
  .lobby{padding:30px 0 22px}
  .lobby h1{font-size:31px;line-height:1.45}
  .lobby p{font-size:14.5px}
  .board{padding:12px;margin-top:6px}
  .board .room-plate{left:14px;bottom:-11px;font-size:8.5px}
  .mount figcaption{font-size:11px}
  .pblock{padding:18px 0 20px}
  .pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .pcell{height:86px;padding:7px}
  .pcell img{height:60px;max-width:100%}
  .sheet{padding:36px 0 4px}
  .sheet-head{flex-wrap:wrap;gap:9px;margin-bottom:14px}
  .sheet-head h2{font-size:22px}
  .sheet-head .meta{width:100%;text-align:right}
  .cols3,.cols2,.steps{grid-template-columns:1fr;gap:16px}
  .sortrow{grid-template-columns:50px minmax(0,1fr);gap:10px}
  .sortrow .use{grid-column:2;text-align:left;font-size:11.5px}
  .lrow{grid-template-columns:50px minmax(0,1fr) 60px;gap:9px}
  .lrow .rate{display:none}
  .rack{grid-template-columns:1fr;padding:18px 14px;margin-top:22px;gap:26px}
  .keycard{margin-top:14px}
  .directory{margin-top:18px}
  .floorrow{grid-template-columns:58px minmax(0,1fr);gap:12px;padding:16px 14px}
  .floorno{font-size:22px}
  .count{grid-column:2;text-align:left;font-size:14px;display:flex;gap:8px;align-items:baseline}
  .count span{margin:0}
  .chapter{padding-left:0;margin-top:26px}
  .chapter .chapno{position:static;display:inline-block;width:auto;margin-bottom:6px}
  .qa{grid-template-columns:28px minmax(0,1fr);gap:10px}
  .pagehead{padding:30px 0 4px}
  .pagehead h1{font-size:29px}
  .body{padding:0 18px}
  .foot .wrap{grid-template-columns:1fr;gap:20px;padding-top:26px}
  .foot .base{flex-direction:column;gap:6px}
  .figure{margin-top:20px;padding:7px}
}
@media(max-width:640px){
  .pgrid{grid-template-columns:1fr;gap:9px}
  .pcell{height:88px}
}
@media(max-width:420px){
  .lobby h1{font-size:28px}
  .fob .tag{padding:5px 6px}
  .fob .tag b{font-size:10.5px}
  .pcell{height:82px}
  .pcell img{height:60px}
}