/* イノプロ授業資料 共通スタイル（site/templates/style.css が原本。dist/ 配下はビルド生成物） */
:root{
  --plane:#f9f9f7; --surface:#fcfcfb;
  --ink:#0b0b0b; --ink-2:#52514e; --muted:#898781;
  --rule:#e1e0d9; --axis:#c3c2b7; --ring:rgba(11,11,11,0.10);
  --s1:#2a78d6;
  --sans:"Noto Sans JP","Hiragino Sans",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --plane:#0d0d0d; --surface:#1a1a19;
    --ink:#ffffff; --ink-2:#c3c2b7; --muted:#898781;
    --rule:#2c2c2a; --axis:#383835; --ring:rgba(255,255,255,0.10);
    --s1:#3987e5;
  }
}
:root[data-theme="dark"]{
  --plane:#0d0d0d; --surface:#1a1a19;
  --ink:#ffffff; --ink-2:#c3c2b7; --muted:#898781;
  --rule:#2c2c2a; --axis:#383835; --ring:rgba(255,255,255,0.10);
  --s1:#3987e5;
}
html{color-scheme:light dark;}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--plane); color:var(--ink);
  font-family:var(--sans); font-size:15px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:760px; margin:0 auto; padding:44px 24px 88px;}
@media (max-width:640px){ .wrap{padding:30px 16px 64px;} }

.eyebrow{font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; color:var(--muted);}
h1{font-size:clamp(24px,4.2vw,34px); font-weight:700; letter-spacing:-.01em; margin:6px 0 18px; line-height:1.25;}
.lede{margin:0 0 34px; color:var(--ink-2); font-size:14.5px;}

.facts{display:flex; flex-wrap:wrap; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); margin:0 0 40px;}
.facts div{flex:1 1 140px; padding:11px 14px 11px 0;}
.facts dt{font-family:var(--mono); font-size:10.5px; color:var(--muted); letter-spacing:.06em;}
.facts dd{margin:2px 0 0; font-size:13.5px; font-weight:500;}

h2{font-size:13px; font-weight:700; letter-spacing:.02em; margin:0 0 12px;}

.list{display:flex; flex-direction:column; border-top:1px solid var(--axis);}
.row{
  display:grid; grid-template-columns:46px minmax(0,1fr) auto; align-items:baseline; gap:0 14px;
  padding:16px 4px; border-bottom:1px solid var(--rule); text-decoration:none; color:var(--ink);
}
.row:hover{background:var(--surface);}
.row .n{font-family:var(--mono); font-size:13px; font-weight:700; color:var(--muted);}
.row .t{font-size:16px; font-weight:700; line-height:1.4;}
.row .k{font-family:var(--mono); font-size:11.5px; color:var(--ink-2); margin-top:3px; display:block;}
.row .go{font-family:var(--mono); font-size:11.5px; color:var(--s1); white-space:nowrap;}
.row.pending{color:var(--muted); pointer-events:none;}
.row.pending .t{font-weight:500;}
.row.pending .go{color:var(--muted);}
@media (max-width:560px){
  .row{grid-template-columns:34px minmax(0,1fr); gap:0 10px;}
  .row .go{grid-column:2; margin-top:6px;}
}

.empty{
  border-top:1px solid var(--axis); border-bottom:1px solid var(--rule);
  padding:28px 4px; color:var(--muted); font-size:13.5px;
}

.back{
  display:inline-block; margin-bottom:22px; font-family:var(--mono); font-size:11.5px;
  color:var(--ink-2); text-decoration:none;
}
.back:hover{color:var(--s1);}

.note{
  margin-top:40px; padding:14px 16px; background:var(--surface);
  border:1px solid var(--ring); font-size:13px; color:var(--ink-2);
}
.note ul{margin:8px 0 0; padding-left:0; list-style:none;}
.note li{padding:4px 0 4px 16px; position:relative;}
.note li::before{content:""; position:absolute; left:2px; top:14px; width:6px; height:1px; background:var(--muted);}

footer{margin-top:56px; padding-top:14px; border-top:1px solid var(--rule); font-family:var(--mono); font-size:11px; color:var(--muted);}
a{color:var(--s1);}
a:focus-visible{outline:2px solid var(--s1); outline-offset:2px;}