@charset "UTF-8";
/* ============================================================
   セイカのミノリ — 共通スタイル（デザイントークン）
   プレゼン資料と同じ言語：リソグラフ風の2色 + Zen Kaku Gothic New
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;500;700;900&family=Space+Mono:wght@400;700&display=swap');

:root{
  --ink:#16182c;
  --ink-soft:#2c2f4a;
  --paper:#eceef3;
  --card:#ffffff;
  --line:#d9dce4;
  --teal:#0fae9e;        /* 学生軸 */
  --teal-ink:#0a6f66;
  --teal-wash:#e2f6f3;
  --pink:#ff3d7f;        /* 授業軸 */
  --pink-ink:#c31857;
  --pink-wash:#ffe6ef;
  --violet:#5b4bd6;
  --violet-wash:#ece9fb;
  --muted:#6a6f82;
  --field:#f4f5f8;
  --field-line:#c7ccd8;
  --danger:#e53e3e;
  --danger-wash:#fff5f5;
  --ok:#38a169;
  --radius:14px;
  --shadow:0 1px 2px rgba(22,24,44,.06), 0 12px 30px -18px rgba(22,24,44,.35);
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:"Zen Kaku Gothic New",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
.mono{font-family:"Space Mono",ui-monospace,monospace}

/* --- ボタン --- */
.btn{
  font-family:inherit;font-size:15px;font-weight:700;
  padding:11px 20px;border:none;border-radius:10px;cursor:pointer;
  background:var(--ink);color:#fff;transition:background .18s,transform .05s;
}
.btn:hover{background:var(--ink-soft)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-teal{background:var(--teal)} .btn-teal:hover{background:var(--teal-ink)}
.btn-pink{background:var(--pink)} .btn-pink:hover{background:var(--pink-ink)}
.btn-ghost{background:transparent;border:1px solid var(--field-line);color:var(--muted)}
.btn-ghost:hover{background:var(--field);color:var(--ink)}
.btn-block{width:100%}

/* --- 入力欄 --- */
.field{margin-bottom:16px}
.field label{
  display:block;font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);margin-bottom:6px;
}
.field input, .field textarea, .field select{
  width:100%;padding:11px 13px;font-size:15px;font-family:inherit;color:var(--ink);
  background:var(--card);border:1px solid var(--field-line);border-radius:10px;
  transition:border-color .18s, box-shadow .18s;
}
.field input:focus, .field textarea:focus, .field select:focus{
  outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-wash);
}

/* --- メッセージ（エラー/成功） --- */
.msg{padding:11px 14px;border-radius:10px;font-size:14px;margin-bottom:16px;display:none}
.msg.show{display:block}
.msg-error{background:var(--danger-wash);border:1px solid #fc8181;color:#c53030}
.msg-ok{background:var(--teal-wash);border:1px solid var(--teal);color:var(--teal-ink)}

/* --- カード --- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}

/* --- ヘッダーバー（ログイン後の各画面共通） --- */
.topbar{
  background:var(--ink);color:#fff;padding:14px 0;
}
.topbar .inner{max-width:1000px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between}
.topbar .brand{font-weight:900;font-size:17px;letter-spacing:.01em}
.topbar .brand .sub{font-family:"Space Mono",monospace;font-size:11px;color:#aeb4cc;margin-left:10px;letter-spacing:.1em}
.topbar .user{display:flex;align-items:center;gap:14px;font-size:13px;color:#c4c9df}
.topbar .user a{color:#fff;text-decoration:none;font-size:13px;border:1px solid rgba(255,255,255,.25);padding:6px 12px;border-radius:8px}
.topbar .user a:hover{background:rgba(255,255,255,.1)}

.wrap{max-width:1000px;margin:0 auto;padding:32px 24px}

/* --- キーボードフォーカスを見やすく --- */
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important}
}
