/* ==========================================================================
   theme-student.css — 学生モード
   モチーフは「合宿のしおり」。ノートの罫線、付箋、蛍光ペン、ベタ塗りの影。
   ========================================================================== */

[data-mode="student"] {
  --ink: #131c33;
  --ink-soft: #4d5c7e;
  --ink-faint: #8b98b8;
  --paper: #edf2ff;
  --card: #ffffff;
  --line: #c3d1f2;
  --line-strong: #131c33;
  --accent: #2c63f5;
  --accent-ink: #ffffff;
  --accent-wash: #dde6ff;
  --highlight: #ffe24a;
  --positive: #17c294;
  --alert: #ff4e6a;

  --radius-lg: 22px;
  --radius-md: 16px;
  --radius-sm: 11px;
  --border-w: 2px;

  --font-display: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", system-ui, sans-serif;
  --font-body: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
  --display-weight: 900;
  --display-tracking: 0.005em;
  --heading-leading: 1.4;
  --body-leading: 1.9;
}

/* ノートの横罫を紙に敷く。文字とは重ならない薄さで。 */
[data-mode="student"] body {
  background-image: repeating-linear-gradient(
    to bottom,
    transparent 0 31px,
    rgba(44, 99, 245, .09) 31px 32px
  );
}

/* 見出しの上に、蛍光ペンでなぞったような帯を引く。 */
[data-mode="student"] .pagehead h1,
[data-mode="student"] .section > h2 {
  display: inline-block;
  background-image: linear-gradient(var(--highlight), var(--highlight));
  background-repeat: no-repeat;
  background-size: 100% .42em;
  background-position: 0 88%;
  padding-inline: 2px;
}

/* 主要なカードはベタ塗りの影でステッカーのように浮かせる。 */
[data-mode="student"] .card,
[data-mode="student"] .suggestion,
[data-mode="student"] .tripcard {
  box-shadow: 4px 4px 0 var(--line-strong);
}
[data-mode="student"] .suggestion:hover,
[data-mode="student"] .tripcard:hover {
  box-shadow: 6px 6px 0 var(--line-strong);
  transform: translate(-2px, -2px);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

[data-mode="student"] .btn { box-shadow: 3px 3px 0 var(--line-strong); }
[data-mode="student"] .btn:active { box-shadow: 1px 1px 0 var(--line-strong); transform: translate(2px, 2px); }
[data-mode="student"] .btn--quiet { box-shadow: none; }
[data-mode="student"] .btn--quiet:active { box-shadow: none; transform: translateY(1px); }

/* 提案カードの1枚目だけ、机に置いた付箋のように少し傾ける。 */
[data-mode="student"] .grid--3 > .suggestion:nth-child(1) { rotate: -.7deg; }
[data-mode="student"] .grid--3 > .suggestion:nth-child(3) { rotate: .6deg; }
[data-mode="student"] .grid--3 > .suggestion:hover { rotate: 0deg; }

[data-mode="student"] .modeswitch { box-shadow: 2px 2px 0 var(--line-strong); }

/* 日付ブロックは丸っこいタグで。 */
[data-mode="student"] .dayblock__n { padding: 3px 14px; font-size: 13px; }

/* ようこそ画面：紙に大きく書いたタイトル */
[data-mode="student"] .welcome__title { letter-spacing: -.01em; }
[data-mode="student"] .welcome__title em {
  font-style: normal;
  background-image: linear-gradient(var(--highlight), var(--highlight));
  background-repeat: no-repeat;
  background-size: 100% .38em;
  background-position: 0 82%;
}

[data-mode="student"] .empty { border-width: 3px; }

[data-mode="student"] .toast { border-radius: var(--radius-pill); }

/* 学生モードの補足コピーは少しくだけた行間に */
[data-mode="student"] .field__hint { line-height: 1.7; }

/* 地図もカードと同じく、ベタ塗りの影で紙の上に置いた感じにする。 */
[data-mode="student"] .mapbox__canvas { box-shadow: 4px 4px 0 var(--line-strong); }
[data-mode="student"] .mapmark { border-width: 3px; }
[data-mode="student"] .mapbox__day { box-shadow: 2px 2px 0 var(--line-strong); }

/* 学生モードは地図もそのままの色で。少しだけ明るくして紙の白に馴染ませる。 */
[data-mode="student"] .leaflet-tile { filter: saturate(1.05) brightness(1.02); }
