/* Entry screen: one page for guests. Headline and a hollow-core slab section on the left, the sign-in form on the right.
   Uses the brand tokens only (monochrome + one rebar-orange signal), hairlines, no shadows. */
body:not(.app) #nav-login{display:none}
.entry{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);gap:56px;align-items:center;padding-block:44px 64px;min-height:calc(100vh - 150px)}
.entry-h{font:600 clamp(26px,3.6vw,44px)/1.08 var(--f-display);letter-spacing:-.025em;max-width:15ch;text-wrap:balance}
.entry-sub{margin-top:18px;max-width:50ch;font-size:16px;line-height:25px;color:var(--ink-muted)}
.slabfig{margin:34px 0 0;border:1px solid var(--line);background-color:var(--surface-200);
  background-image:linear-gradient(color-mix(in srgb,var(--line) 55%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--line) 55%,transparent) 1px,transparent 1px);background-size:24px 24px;background-position:-1px -1px;padding:20px 20px 12px}
.slab{display:block;width:100%;height:auto;overflow:visible}
.slab .mk{font:600 20px var(--f-display);fill:var(--ink)}
.slab .sl{fill:none;stroke:var(--ink);stroke-width:1.7;stroke-linejoin:round}
.slab .sf{fill:url(#stip);stroke:none}
.slab .sp{fill:var(--concrete)}
.slab .vd circle{fill:var(--surface-200);stroke:var(--ink);stroke-width:1.4}
.slab .rb circle{fill:var(--rebar)}
.slab .dm path{fill:none;stroke:var(--line-strong);stroke-width:1}
.slab .dm .dt{fill:var(--line-strong);stroke:none}
.slab .dm text{font:600 13px var(--f-body);fill:var(--ink-muted);font-variant-numeric:tabular-nums}
.slabfig figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 20px;margin-top:6px;font-size:12px;line-height:16px;color:var(--ink-muted)}
.rbl{display:inline-flex;align-items:center;gap:7px}.rbl i{width:8px;height:8px;border-radius:50%;background:var(--rebar);display:inline-block}
.chain{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.chain li{position:relative;padding-right:14px;min-width:0}
.chain li b{display:flex;align-items:center;gap:10px;font:600 11px/1 var(--f-body);letter-spacing:.08em;color:var(--ink-muted);margin-bottom:8px}
.chain li b::after{content:"";height:1px;flex:1;background:var(--line-strong)}
.chain li:last-child b::after{background:none}
.chain li>span{display:block;font-size:14px;line-height:19px;font-weight:600}
.entry .loginform{justify-self:end;max-width:420px;width:100%;padding:28px}
.entry .loginform h1{font-size:24px}
/* one orchestrated moment: the outline is drawn, then the rebar is set */
@media (prefers-reduced-motion:no-preference){
  .slab .sl,.slab .vd circle{stroke-dasharray:1;stroke-dashoffset:1;animation:slDraw 1.5s cubic-bezier(.5,0,.2,1) .1s forwards}
  .slab .vd circle:nth-child(2){animation-delay:.2s}.slab .vd circle:nth-child(3){animation-delay:.3s}.slab .vd circle:nth-child(4){animation-delay:.4s}.slab .vd circle:nth-child(5){animation-delay:.5s}.slab .vd circle:nth-child(6){animation-delay:.6s}
  .slab .sf,.slab .dm,.slab .mk{opacity:0;animation:slFade .7s ease 1s forwards}
  .slab .rb circle{transform-box:fill-box;transform-origin:center;transform:scale(0);animation:slPop .35s cubic-bezier(.3,1.6,.5,1) forwards}
  .slab .rb circle:nth-child(1){animation-delay:1.5s}.slab .rb circle:nth-child(2){animation-delay:1.58s}.slab .rb circle:nth-child(3){animation-delay:1.66s}.slab .rb circle:nth-child(4){animation-delay:1.74s}.slab .rb circle:nth-child(5){animation-delay:1.82s}.slab .rb circle:nth-child(6){animation-delay:1.9s}.slab .rb circle:nth-child(7){animation-delay:1.98s}
}
@keyframes slDraw{to{stroke-dashoffset:0}}@keyframes slFade{to{opacity:1}}@keyframes slPop{to{transform:scale(1)}}
@media (max-width:900px){
  .entry{grid-template-columns:1fr;gap:28px;padding-block:24px 40px;min-height:0}
  .entry .loginform{order:-1;justify-self:stretch;max-width:none}
  .entry-h{max-width:none}.slabfig{margin-top:24px;padding:14px 12px 8px}
}
@media (max-width:560px){.chain{grid-template-columns:1fr 1fr;row-gap:18px}.chain li:nth-child(2) b::after{background:none}}
@media (max-width:560px){.slab .dm text{font-size:18px}.slab .mk{font-size:26px}}

:root:is([data-theme="muzli"],[data-theme="smena"]) .slabfig{-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-color:var(--glass-edge)}
