/* /entrar en dos columnas (task 98, plan/entrar.html). Loaded only by /entrar, after auth.css and before theme.css
   is fine: it uses theme.css tokens (--board, --chalk, --pencil, --rule, --margin) and adds no control.
   Left: the existing <main class="auth"> untouched. Right: <aside class="ep"> = the chalkboard half, full-bleed. */
.ent{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:calc(100vh - 64px);min-height:calc(100dvh - 64px)}
.ent>.auth{align-self:start;width:100%;max-width:400px}
/* a view column never grows past the form width (the dispositivo mail used to push it to 299 px at 320) */
.ent .stack{grid-template-columns:minmax(0,1fr)}
.ent .who-line [data-mail]{min-width:0}
/* the session length choice shows the keyboard focus (the radio itself is hidden) */
.ent .seg label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:-2px;position:relative;z-index:1}
.ep{position:relative;display:grid;align-content:center;padding:64px 64px 96px;background:var(--board);color:var(--chalk)}
.ep-in{display:grid;gap:48px;max-width:592px}
.ep-msg{display:grid;justify-items:start}
.ep-h{font:700 31px/1.2 var(--font);letter-spacing:-.015em;color:var(--chalk);max-width:14em}
.ep-under{display:block;width:280px;height:14px;margin-top:4px;color:var(--pencil)}
.ep-p{margin-top:16px;font-size:17px;line-height:1.5;color:var(--chalk-2);max-width:34em}
/* the drawing: chalk task list + notebook page, side by side */
.ep-art{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start}
.ep-tasks{padding-top:8px}
.ep-tt{font:700 20px/1.3 var(--font);color:var(--chalk);transform:rotate(-1.5deg);transform-origin:left center;margin-bottom:16px}
.ep-tasks ul{display:grid;gap:12px}
.ep-tasks li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;align-items:center;font-size:17px;line-height:1.4;color:var(--chalk)}
.ep-box{width:24px;height:24px;border:2px solid var(--chalk-2);border-radius:4px;position:relative}
.ep-box svg{position:absolute;left:-2px;top:-8px;width:28px;height:28px;color:var(--pencil)}
.ep-tasks li.ep-ok{display:block;margin:-8px 0 0 36px;font-weight:700;font-size:16px;color:var(--pencil);transform:rotate(-3deg);transform-origin:left center}
/* notebook page: ONE material (white ruled paper + 1 px ring + short contact shadow), library 26 */
.ep-nb{position:relative;width:300px;padding:32px 16px 16px 64px;border-radius:4px;transform:rotate(2deg);box-shadow:0 0 0 1px rgba(0,0,0,.2),0 4px 6px rgba(0,0,0,.3);color:var(--accent);font:600 18px/32px var(--font)}
.ep-nb p{white-space:nowrap}
.ep-spiral{position:absolute;left:0;top:-12px;width:100%;height:24px}
.ep-nh{display:flex;justify-content:space-between;gap:8px;margin-left:-48px;color:var(--ink);font-size:16px}
.ep-nh b{font-weight:700}
.ep-nh span{color:var(--muted);font-weight:400}
.ep-m{color:var(--muted);font-weight:400}
.ep-x{background:linear-gradient(transparent 55%,var(--pencil) 55%,var(--pencil) 90%,transparent 90%);padding:0 4px;color:var(--ink);font-weight:700}
.ep-tick{width:24px;height:24px;margin-left:8px;vertical-align:-5px;color:var(--ok-ink)}
.ep-hint{white-space:normal!important;font-size:16px;line-height:32px;color:var(--pencil-ink);font-weight:600}
/* the board's ledge and the pencil lying on it */
.ep-ledge{position:absolute;left:32px;right:32px;bottom:24px;height:8px;border-radius:999px;background:var(--board-line)}
.ep-pencil{position:absolute;right:64px;bottom:26px;width:180px;height:24px}
/* 960-1199: the half is narrower, the notebook goes under the tasks */
@media (max-width:1199px){
  .ep{padding:64px 48px 96px}
  .ep-art{grid-template-columns:minmax(0,1fr)}
  .ep-nb{justify-self:end;margin-right:8px}
}
/* under 960: one column — the form first, the board below it, full width */
@media (max-width:959px){
  .ent{grid-template-columns:minmax(0,1fr);min-height:0}
  .ep{padding:48px 24px 96px}
  .ep-art{grid-template-columns:minmax(0,1fr) 300px}
}
/* phone: message + three board tasks; no notebook (library 11 R-BAN-8, decision D1) */
@media (max-width:600px){
  .ep{padding:40px 16px 80px}
  .ep-in{gap:32px}
  .ep-h{font-size:24px;line-height:1.25}
  .ep-under{width:200px}
  .ep-p{font-size:16px}
  .ep-art{grid-template-columns:minmax(0,1fr)}
  .ep-nb,.ep-tasks .ep-4{display:none}
  .ep-ledge{left:16px;right:16px}
  .ep-pencil{right:32px;width:140px}
}