body.session-locked > .app-shell,
body.session-locked > .skip-link,
body.session-locked > #dialog,
body.session-locked > #toast { display: none; }
.session-view { min-height: 100dvh; padding: 32px 20px; display: grid; place-content: center; }
.session-view[hidden] { display: none; }
.session-panel { width: min(100%, 420px); padding: 32px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); }
.session-brand { display: block; margin-bottom: 28px; font-size: 28px; font-weight: 700; letter-spacing: -1px; }
.session-panel h1 { font-size: 25px; line-height: 1.25; margin: 0 0 12px; letter-spacing: -.5px; }
.session-panel p { margin: 0 0 22px; color: var(--muted); }
.session-panel form { display: grid; gap: 18px; }
.session-panel label { display: grid; gap: 7px; font-weight: 500; }
.session-panel input { width: 100%; min-width: 0; min-height: 44px; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; background: var(--surface); color: var(--ink); }
.session-panel input:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.session-panel .session-message { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.session-panel .session-message.error { color: var(--red); }
.session-links { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 10px; }
.session-links .btn { white-space: normal; }
.session-user { display: flex; align-items: center; gap: 10px; max-width: 240px; }
.session-user span { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.session-user .btn { flex-shrink: 0; }
@media (max-width: 760px) { .session-user span { display: none; } }
@media (max-width: 460px) { .session-view { padding: 20px 14px; } .session-panel { padding: 25px 22px; } }