/* ログイン画面（かわいさは控えめに、信頼感を優先） */
body.login, body.login * { box-sizing: border-box; }
body.login { margin: 0; min-height: 100dvh; background: var(--bg); color: var(--text); font-family: var(--font-ui); font-size: 1rem; line-height: 1.5; display: grid; place-items: center; padding: 20px; }
body.login [hidden] { display: none !important; }
.lbox { width: 100%; max-width: 430px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 20px; display: flex; flex-direction: column; gap: 20px; }
.brand { display: flex; flex-direction: column; align-items: center; gap: 4px; padding-top: 8px; }
.brand svg { width: 2.5rem; height: 2.5rem; color: var(--c-p); }
.bname { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; color: var(--c-p-dark); }
.bsub { font-size: 0.75rem; color: var(--text-dim); }
.lform { display: flex; flex-direction: column; gap: 16px; }
.ltitle { font-size: 1rem; font-weight: 700; color: var(--c-p-dark); }
.note { font-size: 0.75rem; color: var(--text-dim); }
.lf { display: flex; flex-direction: column; gap: 4px; }
.ll { font-size: 0.75rem; color: var(--text-dim); }
.inp { min-height: 2.75rem; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); padding: 0 0.75rem; font-family: var(--font-ui); font-size: 1rem; color: var(--text); width: 100%; }
.inp:focus { outline: 2px solid var(--c-p-tag); outline-offset: 1px; }
.btn-p { min-height: 2.75rem; padding: 0 1.25rem; border: 0; background: var(--c-p); border-radius: 8px; font-family: var(--font-ui); font-size: 0.875rem; font-weight: 700; color: var(--btn-text); cursor: pointer; }
.btn-p:hover { background: var(--c-p-dark); }
.btn-p:disabled { background: var(--bg-sub); color: var(--text-dim); cursor: default; }
.msg { font-size: 0.875rem; color: var(--color-danger); min-height: 1.25rem; }
.msg.ok { color: var(--c-p-dark); }
.link { align-self: center; border: 0; background: none; padding: 0 0.5rem; min-height: 2.75rem; font-family: var(--font-ui); font-size: 0.875rem; color: var(--c-p-dark); cursor: pointer; }
.link:hover { text-decoration: underline; }