:root{--cta:#F2B417;--cta-ink:#1E1A14;--wx:50%;--wy:50%;}html[data-side="with"]{--ground:#F1E7D0;--ground-2:#E8DBBE;--ink:#2B1D17;--soft:#5A463A;--accent:#7A2531;--card:#FBF5E6;--rule:#C9B48F;--tab-off:#E3D3B1;}html[data-side="without"]{--ground:#D3D9E0;--ground-2:#C3CAD3;--ink:#27303B;--soft:#4C5866;--accent:#3E4A59;--card:#E9ECF0;--rule:#A3ACB8;--tab-off:#C7CED7;}*,*::before,*::after{box-sizing:border-box}html{overflow-x:clip;background:var(--ground)}body{margin:0;min-height:100dvh;font-family:"EB Garamond",Garamond,"Times New Roman",serif;font-weight:400;color:var(--ink);background:linear-gradient(180deg,var(--ground) 0%,var(--ground) 55%,var(--ground-2) 100%);display:flex;flex-direction:column;overflow-x:clip;}.wrap{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) 18px max(20px,env(safe-area-inset-left));display:grid;gap:22px;align-content:center;}.copy{display:flex;flex-direction:column;align-items:flex-start;gap:14px;min-width:0}.logo{display:block;width:clamp(60px,16vw,96px);height:auto;aspect-ratio:1/1;border-radius:18px}h1{margin:0;font-weight:600;letter-spacing:-0.01em;line-height:0.98;font-size:clamp(2.6rem,1.6rem + 5vw,5.2rem);}h1 em{display:block;font-style:italic;font-weight:400;color:var(--accent)}.lede{margin:0;max-width:30ch;font-size:clamp(1.15rem,1rem + 0.6vw,1.4rem);line-height:1.35;color:var(--soft)}.cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:12px 30px;border-radius:999px;background:var(--cta);color:var(--cta-ink);text-decoration:none;font-weight:600;font-size:clamp(1.15rem,1.05rem + 0.4vw,1.3rem);letter-spacing:0.01em;box-shadow:0 1px 0 rgba(30,26,20,0.25);-webkit-tap-highlight-color:transparent;transition:transform .15s ease;}.cta svg{width:18px;height:18px}.cta:focus-visible{outline:3px solid var(--ink);outline-offset:3px}.cta:active{transform:translateY(1px)}.under{margin:0;font-style:italic;font-size:clamp(1rem,0.95rem + 0.25vw,1.1rem);color:var(--soft);max-width:34ch}.stage{min-width:0;width:100%;max-width:470px;justify-self:center}.tabs{display:flex;gap:6px;padding-left:18px}.tab{-webkit-tap-highlight-color:transparent;appearance:none;cursor:pointer;min-height:44px;padding:8px 18px;border:1px solid var(--rule);border-bottom:0;border-radius:12px 12px 0 0;background:var(--tab-off);color:var(--soft);font:inherit;font-size:1.05rem;font-weight:600;letter-spacing:0.02em;position:relative;top:1px;}.tab[aria-pressed="true"]{background:var(--card);color:var(--ink);z-index:1}.tab:focus-visible{outline:3px solid var(--ink);outline-offset:-4px}.tab.nudge{animation:nudge .7s ease-out .6s 1 both}@keyframes nudge{0%,100%{transform:translateY(0)}40%{transform:translateY(-5px)}70%{transform:translateY(1px)}}.card{background:var(--card);border:1px solid var(--rule);border-radius:4px 14px 14px 14px;padding:clamp(16px,4vw,26px) clamp(16px,4vw,28px) clamp(14px,3vw,22px);}.card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:10px;border-bottom:3px double var(--rule)}.kicker{font-variant:small-caps;letter-spacing:0.08em;font-size:1rem;color:var(--soft)}.card h2{margin:0;font-weight:400;font-style:italic;font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem);color:var(--accent)}.rows{list-style:none;margin:6px 0 0;padding:0}.rows li{display:flex;align-items:baseline;gap:8px;padding:9px 0;border-bottom:1px solid var(--rule);font-size:clamp(1.05rem,1rem + 0.3vw,1.2rem)}.rows li:last-child{border-bottom:0}.rows .k{font-variant:small-caps;letter-spacing:0.06em;color:var(--soft);flex:none}.rows .dots{flex:1;min-width:16px;border-bottom:2px dotted var(--rule);transform:translateY(-4px)}.rows .v{text-align:right;color:var(--ink)}.side[data-for="without"] .v{font-style:italic;color:var(--soft)}.note{margin:10px 0 0;font-style:italic;font-size:1rem;color:var(--soft)}footer{text-align:center;font-size:0.95rem;color:var(--soft);padding:12px 20px max(14px,env(safe-area-inset-bottom));}@media (min-width:900px){.wrap{grid-template-columns:1.05fr 1fr;gap:56px;padding-top:28px}.stage{justify-self:end}}@media (hover:hover) and (pointer:fine){.cta:hover{transform:translateY(-1px)}.tab:not([aria-pressed="true"]):hover{color:var(--ink)}}::view-transition-old(root){animation:none}::view-transition-new(root){animation:wipe 360ms cubic-bezier(.3,.7,.2,1) both}@keyframes wipe{from{clip-path:circle(0 at var(--wx) var(--wy))}to{clip-path:circle(150vmax at var(--wx) var(--wy))}}.stage.fade .card{opacity:0}.card{transition:opacity .18s ease}@media (prefers-reduced-motion:reduce){.tab.nudge{animation:none}::view-transition-new(root){animation:none}.card{transition:none}.cta{transition:none}}