:root{--gray10:#f4f4f4;--layer:#ffffff;--ink:#161616;--ink2:#525252;--line:#c6c6c6;--line2:#e0e0e0;--blue:#0f62fe;--teal:#00695c;--teal-dark:#004d43;--teal-tint:#d9f5f0;--wide:"Krona One","Arial Black",sans-serif;--plex:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;}*{box-sizing:border-box;margin:0;padding:0}html{background:var(--gray10);color:var(--ink);font-family:var(--plex);-webkit-text-size-adjust:100%}body{min-height:100dvh;display:flex;flex-direction:column;overflow-x:clip}.wrap{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:max(16px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) 12px max(20px,env(safe-area-inset-left));display:grid;gap:20px;align-content:start}.intro{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.brand{display:flex;align-items:center;gap:12px}.brand img{width:56px;height:56px;display:block;flex:none}.brand span{font-family:var(--plex);font-weight:600;font-size:clamp(0.95rem,0.9rem + 0.3vw,1.1rem);letter-spacing:0.01em}h1{font-family:var(--wide);font-weight:400;font-size:clamp(1.55rem,1.1rem + 2.6vw,3.1rem);line-height:1.12;letter-spacing:-0.01em;max-width:13ch}.sub{font-size:clamp(0.98rem,0.94rem + 0.25vw,1.15rem);line-height:1.45;color:var(--ink2);max-width:40ch}.main-btn{display:inline-flex;align-items:center;gap:14px;min-height:48px;padding:0 20px 0 18px;background:var(--teal);color:#fff;text-decoration:none;font-weight:600;font-size:clamp(1rem,0.96rem + 0.2vw,1.1rem);border-radius:0;-webkit-tap-highlight-color:transparent;transition:background-color 0.11s ease}.main-btn svg{width:18px;height:18px;flex:none}.main-btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px;box-shadow:inset 0 0 0 1px #fff}.main-btn:active{background:var(--teal-dark)}@media (hover: hover){.main-btn:hover{background:var(--teal-dark)}}.need{font-size:clamp(0.85rem,0.83rem + 0.1vw,0.92rem);color:var(--ink2);line-height:1.4;max-width:36ch}.stage{position:relative;width:100%;max-width:420px;justify-self:center}.tabs{display:flex;gap:0;position:relative;z-index:2}.tab{flex:1;min-height:48px;border:0;background:var(--line2);color:var(--ink2);font-family:var(--plex);font-size:0.95rem;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;box-shadow:inset 0 2px 0 transparent;transition:background-color 0.11s ease,color 0.11s ease}.tab+.tab{border-left:1px solid var(--line)}.tab[aria-pressed="true"]{background:var(--layer);color:var(--ink);box-shadow:inset 0 3px 0 var(--blue)}.tab:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}@media (hover: hover){.tab[aria-pressed="false"]:hover{background:#d1d1d1;color:var(--ink)}}.nudge .tab[data-to="without"]{animation:nudge 0.6s ease 0.9s 1 both}@keyframes nudge{0%,100%{transform:translateX(0)}40%{transform:translateX(-5px)}70%{transform:translateX(2px)}}.badge{view-transition-name:badge;background:var(--layer);position:relative;padding:22px 20px 20px;border-top:0}.face{display:grid;gap:14px}.face[hidden]{display:none}.strip{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:0.8rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink2)}.state{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;background:var(--line2);color:var(--ink)}.face-with .state{background:var(--teal-tint);color:var(--teal-dark)}.state i{width:8px;height:8px;border-radius:50%;background:currentColor;display:block}.hello{font-family:var(--wide);font-size:clamp(1.05rem,0.95rem + 0.6vw,1.35rem);line-height:1.2}.hello small{display:block;font-family:var(--plex);font-size:0.85rem;font-weight:400;color:var(--ink2);margin-bottom:6px}.num{font-size:0.95rem;color:var(--ink2);letter-spacing:0.04em}.rows{list-style:none;display:grid;border-top:1px solid var(--line2)}.rows li{display:grid;grid-template-columns:7.2em 1fr;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line2);font-size:0.92rem;line-height:1.3}.rows b{font-weight:600;color:var(--ink2);font-size:0.82rem}.face-without .rows span{display:flex;align-items:center;gap:8px;color:var(--ink2)}.blank{flex:1;height:10px;background:var(--line2);display:block}.face-with .rows span{color:var(--ink)}.face-with .rows li:first-child span{font-weight:600}footer{padding:14px max(20px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-bottom));font-size:0.85rem;color:var(--ink2);text-align:center;border-top:1px solid var(--line2)}::view-transition-old(badge){animation:turnOut 0.17s ease-in both;transform-origin:center}::view-transition-new(badge){animation:turnIn 0.17s ease-out 0.17s both;transform-origin:center}@keyframes turnOut{from{transform:perspective(900px) rotateY(0)}to{transform:perspective(900px) rotateY(90deg)}}@keyframes turnIn{from{transform:perspective(900px) rotateY(-90deg)}to{transform:perspective(900px) rotateY(0)}}.fade{animation:fade 0.3s ease both}@keyframes fade{from{opacity:0}to{opacity:1}}@media (min-width: 900px){.wrap{grid-template-columns:1.05fr 0.95fr;align-items:center;align-content:center;gap:48px;padding-top:40px;padding-bottom:40px}.intro{gap:18px}.brand img{width:96px;height:96px}.stage{justify-self:end}}@media (max-width: 899px) and (max-height: 760px){.intro{gap:10px}}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none !important;transition:none !important}::view-transition-old(badge),::view-transition-new(badge){animation:none !important}}