:root {
  color-scheme: light;
  --cv-bg-canvas:#f5f7fb; --cv-bg-surface:#ffffff; --cv-bg-sunken:#eef2f8; --cv-bg-accent:#2457d5; --cv-bg-accent-soft:#eef3ff; --cv-text-primary:#1b2334; --cv-text-secondary:#5f6a7d; --cv-text-accent:#1d46ae; --cv-text-on-accent:#ffffff; --cv-text-disabled:#a3aec2; --cv-border:#7f8ca2; --cv-border-hairline:#e3e8f0; --cv-border-control:#c3ccda; --cv-focus:#3d6fe8; --cv-status-danger:#c62828; --cv-status-danger-soft:#fdeaea; --cv-status-warning:#8a5a00; --cv-status-warning-soft:#fff4d6; --cv-radius-sm:8px; --cv-radius-md:12px; --cv-radius-lg:16px; --cv-size-control-md:36px; --cv-size-control-lg:44px; --cv-size-text-small:12px; --cv-weight-bold:700; --cv-elevation-1:0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .08); --cv-elevation-2:0 6px 16px -4px rgba(16, 24, 40, .12), 0 2px 4px rgba(16, 24, 40, .06);
  font-family:"BIZ UDPGothic","Noto Sans JP","Yu Gothic UI","Hiragino Sans",sans-serif;
}
* { box-sizing:border-box; }
html,body { min-width:320px; min-height:100%; }
body { margin:0; color:var(--cv-text-primary); background:var(--cv-bg-canvas); }
button,input,select { font:inherit; }
button,select { color:inherit; }
/* U-21（U-17 L7）: 焦点の輪はアプリ（[data-theme-shell] の focus-visible）と同じ 3px・--cv-focus・offset 2。 */
button:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid var(--cv-focus); outline-offset:2px; }
[hidden] { display:none !important; }
.login-app { min-height:100dvh; display:grid; grid-template-rows:1fr auto; }
.login-main { width:100%; display:grid; place-items:center; padding:clamp(28px,5vh,58px) clamp(16px,4vw,54px); }
.login-shell { width:min(100%,1030px); min-height:598px; display:grid; grid-template-columns:minmax(0,1.04fr) minmax(390px,.96fr); overflow:hidden; border:0; border-radius:var(--cv-radius-md); background:var(--cv-bg-surface); box-shadow:var(--cv-elevation-1); }
@media (min-width:821px){.login-shell{min-height:min(765px,calc(100dvh - 110px))}}
.welcome-pane { position:relative; min-width:0; overflow:hidden; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:36px; padding:clamp(36px,5vw,58px); color:var(--cv-text-primary); background:var(--cv-bg-sunken); text-align:center; }
.welcome-copy,.weekly-preview { position:relative; z-index:1; }
.welcome-copy h1 { margin:0; font-size:clamp(24px,3.34vw,48px); line-height:1.4; letter-spacing:.01em; }
.welcome-copy p:last-child { max-width:430px; margin:16px auto 0; color:var(--cv-text-secondary); font-size:13px; line-height:1.8; }
.rise-line { display:block; animation:login-rise .4s ease-out both; }
.rise-line:nth-child(2) { animation-delay:.08s; }
.welcome-copy p .rise-line:nth-child(1) { animation-delay:.16s; }
.welcome-copy p .rise-line:nth-child(2) { animation-delay:.24s; }
.weekly-preview { width:100%; max-width:780px; border-radius:var(--cv-radius-lg); box-shadow:var(--cv-elevation-2); line-height:0; animation:login-pop .45s ease-out .2s both; }
.weekly-preview svg { display:block; width:100%; height:auto; }
@keyframes login-rise { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
@keyframes login-pop { 0% { opacity:0; transform:scale(.96); } 70% { opacity:1; transform:scale(1.02); } 100% { opacity:1; transform:scale(1); } }
.form-pane { min-width:0; display:flex; align-items:center; padding:clamp(36px,5vw,62px); background:var(--cv-bg-surface); }
.auth-card { width:100%; }
.card-logo { display:flex; justify-content:flex-start; margin-bottom:26px; }
.card-logo img { display:block; width:262px; height:auto; }
.state-label { margin:0 0 22px; color:var(--cv-text-secondary); font-size:14px; font-weight:700; letter-spacing:.02em; }
/* U-5i（Figma InlineNotice / Danger・Warning）: 意味色の薄い面・枠なし・角 12・余白 16、左に印 20（間 8）、題 13 Bold・本文 12 Regular。 */
.session-banner,#msg:not([hidden]) { display:grid; grid-template-columns:20px minmax(0,1fr); column-gap:8px; align-items:start; margin:0 0 22px; padding:16px; border:0; border-radius:var(--cv-radius-md); color:var(--cv-text-primary); background:var(--cv-status-warning-soft); font-size:12px; line-height:17px; }
.notice-icon { grid-row:1 / span 2; width:20px; height:20px; fill:currentColor; }
.session-banner .notice-icon { color:var(--cv-status-warning); }
#msg .notice-icon { color:var(--cv-status-danger); }
.session-banner strong,#msg strong { display:block; grid-column:2; margin-bottom:6px; color:var(--cv-status-warning); font-size:13px; line-height:20px; }
.session-banner span,#msg p { display:block; grid-column:2; margin:0; }
.session-banner span { color:var(--cv-status-warning); }
#msg:not([hidden]) { background:var(--cv-status-danger-soft); }
#msg strong { color:var(--cv-status-danger); }
.field { margin-bottom:16px; }
.field > label,.field-label { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:4px; color:var(--cv-text-secondary); font-size:12px; font-weight:700; }
input::placeholder { color:var(--cv-text-disabled); }
select:invalid { color:var(--cv-text-disabled); }
select option { color:var(--cv-text-primary); }
.field-control,.pw { position:relative; }
input,select { width:100%; min-height:var(--cv-size-control-md); border:1px solid var(--cv-border); border-radius:var(--cv-radius-sm); background:var(--cv-bg-surface); color:var(--cv-text-primary); font-size:14px; transition:border-color .16s ease,box-shadow .16s ease,background .16s ease; }
input { padding:0 12px; } select { appearance:none; padding:0 28px 0 12px; cursor:pointer; }
select { border-color:var(--cv-border-control); }
/* U-21（U-17 L7）: 字の欄の枠は通常も焦点も --cv-border（アプリの字の欄と同じ border/input）。hover で濃くしない。失敗の理由がその欄にあるときだけ危険の色。
   押す物の Select は J-163 の border/control のまま（hover・焦点の枠も今のまま）。 */
select:hover { border-color:var(--cv-text-secondary); }
select:focus { border-color:var(--cv-focus); box-shadow:none; }
input:focus { box-shadow:none; }
input[aria-invalid="true"] { border-color:var(--cv-status-danger); }
input:disabled,select:disabled { color:var(--cv-text-disabled); background:var(--cv-bg-sunken); border-color:var(--cv-border-hairline); }
.select-chevron { position:absolute; right:8px; top:50%; width:16px; height:16px; fill:var(--cv-text-secondary); transform:translateY(-50%); pointer-events:none; }
.pw { margin-bottom:16px; }.pw input{padding-right:40px}
button.reveal { position:absolute; z-index:2; right:2px; top:2px; width:32px; height:32px; display:grid; place-items:center; padding:0; border:0; border-radius:var(--cv-radius-sm); background:transparent; color:var(--cv-text-secondary); cursor:pointer; }
button.reveal:hover { background:var(--cv-bg-sunken); }button.reveal svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}button.reveal .eye-off{display:none}button.reveal[aria-pressed="true"] .eye-on{display:none}button.reveal[aria-pressed="true"] .eye-off{display:block}
.primary-button { width:100%; min-height:var(--cv-size-control-md); display:flex; align-items:center; justify-content:center; gap:8px; margin-top:0; padding:0 16px; border:0; border-radius:var(--cv-radius-sm); background:var(--cv-bg-accent); color:var(--cv-text-on-accent); font-size:14px; font-weight:700; cursor:pointer; transition:filter .16s ease; }
.primary-button:hover { filter:brightness(.94); }
.primary-button:disabled { cursor:wait; opacity:.4; filter:none; }
p.note { margin:0 0 16px; color:var(--cv-text-secondary); font-size:12px; line-height:1.5; }
p.alt { margin:24px 0 0; text-align:left; }
/* U-5i（Figma Button Ghost sm）: 14 Bold text/accent・下線なし・当たり 36・横 16・角 8。横の余白の分だけ左へ出して、字を列の左にそろえる。 */
button.link,a.link { display:inline-flex; width:auto; min-height:var(--cv-size-control-md); align-items:center; margin-left:-16px; padding:0 16px; border:0; border-radius:var(--cv-radius-sm); background:transparent; color:var(--cv-text-accent); font-size:14px; font-weight:700; text-decoration:none; cursor:pointer; }
button.link:hover,a.link:hover { background:var(--cv-bg-accent-soft); }
/* 2.3.0（G-login-entry-2 案 A）: この端末がログイン中のときの帯（session-banner と同じ InlineNotice の形）。［開く］は帯の本文の列の左にそろえる。 */
.signed-in-banner a.link { grid-column:2; justify-self:start; margin-top:4px; }
.shared-device-note { display:block; margin:24px 0 0; padding:0; border:0; border-radius:0; background:transparent; color:var(--cv-text-secondary); font-size:var(--cv-size-text-small); line-height:17px; }
.local-dev-login { margin-top: 18px; padding: 12px 14px; border: 1px dashed var(--cv-status-warning); border-radius: var(--cv-radius-md); background: var(--cv-status-warning-soft); }
.local-dev-title { margin: 0 0 8px; color: var(--cv-status-warning); font-size: 12px; font-weight: 700; }
.local-dev-buttons { display: grid; gap: 8px; }
.local-dev-button { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 12px; border: 1px solid var(--cv-border-control); border-radius: var(--cv-radius-sm); background: var(--cv-bg-surface); color: var(--cv-text-primary); text-align: left; cursor: pointer; }
.local-dev-button:hover { background: var(--cv-bg-sunken); }
.local-dev-button strong { font-size: 13px; }
.local-dev-button small { color: var(--cv-text-secondary); font-size: var(--cv-size-text-small); }
p.code { width:270px; max-width:100%; min-height:64px; display:grid; place-items:center; margin:0 0 18px; padding:0 12px; border:1px solid var(--cv-border-hairline); border-radius:var(--cv-radius-md); color:var(--cv-text-primary); background:var(--cv-bg-sunken); font-family:ui-monospace,"SFMono-Regular",Consolas,monospace; font-size:18px; font-weight:var(--cv-weight-bold); letter-spacing:.06em; text-align:center; word-break:break-all; }
.login-footer { padding:0 16px 18px; color:var(--cv-text-secondary); font-size:var(--cv-size-text-small); text-align:center; }
@media (max-width:820px){.login-shell{width:min(100%,560px);grid-template-columns:1fr}.welcome-pane{min-height:auto;align-items:stretch;padding:34px 38px 32px;text-align:left}.welcome-copy h1{font-size:24px;line-height:1.5}.welcome-copy p:last-child{max-width:470px;margin:12px 0 0}.weekly-preview{display:none}.form-pane{padding:38px}}
@media (max-width:520px){.login-main{align-items:start;padding:16px 12px 28px}.login-shell{border-radius:var(--cv-radius-md)}.welcome-pane{padding:27px 25px 25px}.welcome-copy h1{font-size:22px}.welcome-copy p:last-child{font-size:13px;line-height:1.7}.form-pane{padding:29px 24px 30px}.card-logo{margin-bottom:16px}.card-logo img{width:236px}.state-label{font-size:14px;margin-bottom:16px}input,select,.primary-button,button.link,a.link{min-height:var(--cv-size-control-lg)}button.reveal{top:6px}}
@media (prefers-reduced-motion:reduce){.rise-line,.weekly-preview{animation:none}*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}