.portal-workspace { min-width:0; min-height:650px; display:flex; flex-direction:column; justify-content:center; }
.portal-view { flex:1; display:flex; flex-direction:column; justify-content:center; min-width:0; }
.portal-status { min-height:28px; margin-top:18px; font:300 .875rem/1.6 var(--sans); }
.portal-status:empty { margin-top:0; }
/* Keep the v1 login structure with the shared v2 title/contact styling. */
.portal-login { --copy-size:16px; width:min(39rem,100%); margin-inline:auto; color:var(--ink); }
.portal-login h2 { display:flex; flex-direction:column; justify-content:flex-start; font-size:clamp(2.7rem,4vw,4.2rem); line-height:.92; min-height:1.84em; margin:0; letter-spacing:-.045em; }
.portal-login h2 span { display:block; white-space:nowrap; }
.portal-login h2 em { font-style:normal; }
.portal-login-form { width:100%; display:grid; gap:.75rem; margin-top:.8rem; }
.portal-login-entry { display:grid; gap:.75rem; min-height:4.1rem; position:relative; }
.portal-login-form .visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.portal-login-form .portal-code { width:100%; padding:.7rem 0; background:transparent; border:0; border-bottom:1px solid rgba(170,162,151,.62); border-radius:0; color:inherit; font:400 1rem/normal var(--sans); outline:none; }
.portal-login-form .portal-code:focus { border-color:var(--ink); }
.portal-login-form #portal-email { border-radius:0; }
.portal-login-form #portal-email::placeholder { font:inherit; }
.portal-login-form .portal-code { font-family:var(--sans); letter-spacing:.32em; text-align:center; caret-color:transparent; }
.portal-login-button { justify-self:end; min-width:11.5rem; margin-top:1rem; }
.portal-eyebrow { font:400 .75rem/1.5 var(--sans); letter-spacing:.025em; color:var(--muted); }
.portal-profile-form label { display:block; font-size:.875rem; }
.portal-profile-form input { width:100%; padding:14px 0; background:transparent; border:0; border-bottom:1px solid var(--line); border-radius:0; color:var(--ink); font:300 1.125rem/1.5 var(--sans); }
.portal-profile-form input:focus { outline:none; border-color:var(--ink); }
.portal-quiet { font:400 .875rem/1.5 var(--sans); text-underline-offset:5px; }
.portal-quiet:hover { text-decoration:underline; }
.portal-quiet:disabled { opacity:.4; cursor:default; }
.portal-dashboard-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:30px; }
.portal-dashboard-heading h2 { font:400 clamp(2rem,2.7vw,3.6rem)/1.1 var(--serif); letter-spacing:-.04em; }
.portal-dashboard-heading p { font:300 .875rem/1.5 var(--sans); margin-top:9px; }
.portal-dashboard-actions { display:flex; gap:24px; align-items:center; }
.portal-demo-label { font:400 .75rem/1.4 var(--sans); border:1px solid var(--line); border-radius:20px; padding:7px 12px; }
.portal-dashboard-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr); gap:clamp(30px,3vw,64px); }
.portal-tabs { display:flex; gap:26px; border-bottom:1px solid var(--line); margin-bottom:4px; }
.portal-tabs button { position:relative; padding:15px 0; font:400 .9375rem/1.5 var(--sans); color:var(--muted); }
.portal-tabs button[aria-pressed="true"] { color:var(--ink); }
.portal-tabs button::after { content:''; position:absolute; inset:auto 0 -1px; height:1px; background:var(--ink); transform:scaleX(0); transition:transform .45s var(--ease); transform-origin:left; }
.portal-tabs button[aria-pressed="true"]::after { transform:scaleX(1); }
.portal-lesson { display:grid; grid-template-columns:62px minmax(0,1fr) auto; align-items:center; gap:20px; padding:20px 0; border-bottom:1px solid var(--line); }
.portal-lesson-date { text-align:center; }
.portal-lesson-date strong { display:block; font:400 2rem/1 var(--serif); }
.portal-lesson-date span { display:block; font:400 .75rem/1.5 var(--sans); margin-top:6px; text-transform:uppercase; }
.portal-lesson-info h3 { font:400 1rem/1.5 var(--sans); }
.portal-lesson-info p { margin-top:4px; font:300 .875rem/1.55 var(--sans); }
.portal-lesson-info small { color:var(--muted); font-size:.75rem; margin-left:9px; }
.portal-lesson-actions { display:flex; gap:14px; align-items:center; }
.portal-lesson-actions button,.portal-lesson-actions a { font-size:.8125rem; }
.portal-join { display:inline-flex; align-items:center; gap:15px; padding:10px 15px; border:1px solid rgba(255,255,255,.55); background:rgba(255,255,255,.25); border-radius:7px; transition:background .45s,opacity .45s,border-color .45s; }
.portal-join[aria-disabled="false"] { background:rgba(255,255,255,.94); border-color:rgba(255,255,255,.94); }
.portal-join[aria-disabled="false"]:hover { background:#fff; border-color:#fff; }
.portal-join[aria-disabled="true"] { opacity:.45; cursor:default; }
.portal-join:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.portal-lessons-list { height:clamp(330px,32svh,430px); overflow-y:auto; overscroll-behavior-y:contain; scrollbar-width:thin; scrollbar-color:rgba(41,41,41,.25) transparent; scrollbar-gutter:stable; padding-right:12px; }
.portal-lessons-list:focus-visible { outline:1px solid var(--line); outline-offset:5px; border-radius:3px; }
.portal-list-summary { padding-top:17px; font:300 .8125rem/1.5 var(--sans); color:var(--muted); }
.portal-empty { padding:50px 0; font:300 1rem/1.65 var(--sans); }
.portal-account { display:flex; flex-direction:column; gap:20px; }
.portal-account-summary { display:grid; grid-template-columns:1.2fr 1fr; gap:24px; padding:28px; background:rgba(255,255,255,.21); border:1px solid rgba(255,255,255,.48); border-radius:16px; }
.portal-account-label { font:400 .75rem/1.5 var(--sans); color:var(--muted); margin-bottom:15px; }
.portal-subscription { font:400 1.05rem/1.5 var(--sans); }
.portal-weekly-slots { font:300 .875rem/1.8 var(--sans); margin-top:10px; }
.portal-credit { font:400 2.9rem/1 var(--serif); letter-spacing:-.04em; }
.portal-credit small { font:300 .875rem/1.3 var(--sans); letter-spacing:0; }
.portal-credit-action { display:block; margin-top:18px; font-size:.875rem; text-align:left; }
.portal-yki { background:#292929; color:#fff5e8; border-radius:16px; padding:30px; flex:1; display:flex; flex-direction:column; }
.portal-yki .portal-account-label { color:#d4c7bd; }
.portal-yki h3 { font:400 clamp(1.7rem,2vw,2.5rem)/1.13 var(--serif); letter-spacing:-.03em; max-width:310px; }
.portal-yki p { font:300 .9375rem/1.65 var(--sans); color:#dfd6cd; margin:18px 0 25px; }
.portal-yki a { margin-top:auto; display:flex; align-items:center; justify-content:space-between; font-size:.875rem; }
.portal-time-note { font:300 .75rem/1.5 var(--sans); margin-top:18px; color:var(--muted); }
.portal-calendar { display:flex; flex-direction:column; gap:18px; min-height:610px; }
.portal-calendar .calendar-grid { min-height:420px; }
.portal-dialog { border:1px solid rgba(255,255,255,.8); border-radius:18px; padding:38px; background:#f9e2d0; color:var(--ink); width:min(510px,90vw); max-height:90svh; margin:auto; box-shadow:0 20px 80px #29292929; }
.portal-dialog::backdrop { background:rgba(41,41,41,.25); backdrop-filter:blur(5px); }
.portal-dialog h2 { font:400 2.5rem/1.1 var(--serif); letter-spacing:-.03em; }
.portal-dialog p { font:300 1rem/1.65 var(--sans); margin:20px 0; }
.portal-profile-form { display:grid; gap:20px; margin-top:26px; }
.portal-profile-form input { font-size:1rem; padding:8px 0; }
.portal-dialog-actions { display:flex; justify-content:space-between; gap:24px; align-items:center; margin-top:20px; }
.portal-dialog .portal-dialog-status { font-size:.875rem; margin:0; }
.portal-dialog-status:empty { display:none; }
.portal-dialog .booking-primary { min-width:0; }
.portal-view.is-switching { pointer-events:none; }
.portal-success { text-align:center; max-width:660px; margin:auto; }
.portal-success h2 { font:400 3.5rem/1.1 var(--serif); letter-spacing:-.04em; }
.portal-success p { font:300 1rem/1.7 var(--sans); margin:24px 0; }
.portal-success .booking-primary { margin-top:16px; }
@media (max-width:1300px) { .portal-lesson { gap:12px; grid-template-columns:48px minmax(0,1fr); } .portal-lesson-actions { grid-column:2; } .portal-account-summary { grid-template-columns:1fr; } .portal-workspace { min-height:680px; } }
@media (prefers-reduced-motion:reduce) { .portal-tabs button::after,.portal-join { transition:none; } }

.portal-view h2[tabindex="-1"]:focus,.portal-view h3[tabindex="-1"]:focus { outline:none; }

/* Center both login steps within the shared title-to-footer content frame. */
.portal-shell:has(.portal-login) { height:calc(100svh - var(--header-height)); min-height:0; grid-template-rows:clamp(115px,16svh,210px) minmax(0,1fr); padding-bottom:0; }
.portal-workspace:has(.portal-login) { min-height:0; }
.portal-view:has(> .portal-login) { flex:0; }
.portal-workspace:has(.portal-login) .portal-status { width:min(39rem,100%); min-height:2.8em; margin:12px auto 0; }

/* Signed-in dashboard: one welcome card over two equal columns. */
body.student-portal-page .portal-shell .portal-dashboard {
  --portal-card-gap:24px;
  display:grid;
  gap:var(--portal-card-gap);
  min-width:0;

  & .portal-dashboard-card { background:rgba(255,255,255,.2); border:1px solid rgba(255,255,255,.8); border-radius:22px; padding:28px; min-width:0; }
  & .portal-dashboard-heading { margin:0; gap:24px; }
  & .portal-dashboard-heading h2 { font-size:36px; line-height:1.1; }
  & .portal-dashboard-heading p { margin-top:8px; overflow-wrap:anywhere; }
  & .portal-dashboard-actions { flex-shrink:0; gap:24px; }
  & .portal-dashboard-actions button { min-height:44px; }
  & .portal-dashboard-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--portal-card-gap); height:540px; min-width:0; }
  & .portal-lessons-card { display:flex; flex-direction:column; min-height:0; }
  & .portal-tabs { flex-shrink:0; gap:24px; }
  & .portal-tabs button { padding-top:0; min-height:44px; }
  & .portal-lessons-list { flex:1; height:auto; min-height:0; max-height:none; padding-right:8px; }
  & .portal-lesson { grid-template-columns:76px minmax(0,1fr) auto; gap:16px; padding-block:18px; }
  & .portal-lesson-date { width:76px; aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; background:rgba(255,255,255,.45); border-radius:16px; }
  & .portal-lesson-date strong { font:500 28px/1 var(--sans); font-variant-numeric:tabular-nums; }
  & .portal-lesson-date span { margin-top:7px; font:400 11px/1.3 var(--sans); letter-spacing:.08em; }
  & .portal-lesson-actions { grid-column:3; grid-row:1; flex-wrap:nowrap; gap:14px; white-space:nowrap; }
  & .portal-list-summary { padding-top:14px; }
  & .portal-time-note { margin-top:8px; }
  & .portal-account { display:grid; grid-template-rows:repeat(2,minmax(0,1fr)); gap:var(--portal-card-gap); min-height:0; }
  & .portal-account-summary { grid-template-columns:repeat(2,minmax(0,1fr)); align-content:center; gap:24px; }
  & .portal-account-summary section { min-width:0; }
  & .portal-account-label { margin-bottom:12px; }
  & .portal-subscription { font-size:18px; }
  & .portal-weekly-slots { margin-top:8px; }
  & .portal-credit { font:500 40px/1 var(--sans); font-variant-numeric:tabular-nums; letter-spacing:-.03em; }
  & .portal-card-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; width:max-content; max-width:100%; min-height:44px; padding:10px 20px; border:1px solid #fff; border-radius:100px; background:#fff; color:#292929; font:400 14px/1.4 var(--sans); text-decoration:none; cursor:pointer; transition:background .2s; }
  & .portal-card-button:hover { background:#f4f4f4; border-color:#f4f4f4; }
  & .portal-card-button:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
  & .portal-credit-action { margin-top:18px; }
  & .portal-yki { min-height:0; border:1px solid rgba(255,255,255,.15); border-radius:22px; padding:28px; }
  & .portal-yki h3 { font-size:28px; line-height:1.15; max-width:none; }
  & .portal-yki p { margin:12px 0 18px; font-size:15px; line-height:1.55; }
  & .portal-yki > a { min-height:36px; }
  & .portal-yki-entry { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:36px; margin-top:auto; color:inherit; font:inherit; font-size:14px; text-align:left; opacity:.6; cursor:default; }
}

@media (max-width:767px), (max-width:1000px) and (max-height:600px) and (pointer:coarse) {
  body.student-portal-page .portal-shell .portal-dashboard {
    --portal-card-gap:20px;
    & .portal-dashboard-card, & .portal-yki { padding:22px; }
    & .portal-dashboard-heading { flex-direction:column; align-items:stretch; gap:12px; }
    & .portal-dashboard-heading h2 { font-size:29px; }
    & .portal-dashboard-grid { grid-template-columns:minmax(0,1fr); height:auto; }
    & .portal-lessons-card { height:460px; }
    & .portal-lesson { grid-template-columns:48px minmax(0,1fr) 80px; gap:10px; }
    & .portal-lesson-date { width:48px; border-radius:12px; }
    & .portal-lesson-date strong { font-size:23px; }
    & .portal-lesson-date span { margin-top:4px; font-size:10px; }
    & .portal-lesson-actions { flex-direction:column; align-items:flex-end; gap:0; }
    & .portal-lesson-actions :is(button,a) { font-size:12px; }
    & .portal-join { padding-inline:12px; gap:8px; }
    & .portal-account { grid-auto-rows:minmax(240px,auto); grid-template-rows:repeat(2,minmax(240px,1fr)); }
    & .portal-account-summary { gap:16px; }
    & .portal-subscription { font-size:16px; }
    & .portal-card-button { font-size:13px; padding-inline:14px; }
    & .portal-yki h3 { font-size:27px; }
    & .portal-yki p { font-size:14px; }
  }
}

html.tablet-portrait body.student-portal-page .portal-shell .portal-dashboard {
  & .portal-dashboard-grid { grid-template-columns:minmax(0,1fr); height:auto; }
  & .portal-lessons-card { height:520px; }
  & .portal-account { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:1fr; }
  & .portal-account-summary { grid-template-columns:1fr; gap:24px; }
  & .portal-yki { min-height:300px; }
  @media (max-width:767px) {
    & .portal-account { grid-template-columns:minmax(0,1fr); grid-template-rows:repeat(2,1fr); }
    & .portal-account-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  }
}