/* Viewport and print overrides for the base layer.
 * A later pass over the base layer — order matters, keep it loaded after the files above. */
@media(max-width:1100px){.shell{grid-template-columns:205px 1fr}.content{padding:28px}.top{padding:0 28px}.workspace{grid-template-columns:1fr}.hero{grid-template-columns:1.3fr .7fr}.hero h2{font-size:1.8rem}.card{padding:20px}.scenario.selected{padding:19px}.plan ul{min-height:230px}.auth-story{padding:40px 8%}}
@media(max-width:760px){.shell{display:block}.side{position:relative;height:auto;padding:17px}.side .logo{margin:0 0 19px}.side .eyebrow,.side-bottom{display:none}.nav{flex-direction:row;overflow:auto}.nav button{flex-shrink:0;padding:10px;font-size:.8rem}.nav svg{display:none}.top{height:auto;min-height:64px;padding:12px 19px}.top .tag{display:none}.content{padding:24px 18px}.grid2,.grid3{grid-template-columns:1fr}.stats{grid-template-columns:repeat(3,1fr);gap:8px}.stat{padding:13px 10px}.stat strong{font-size:1.2rem}.stat .meta,.stat p{font-size:.73rem}.hero{grid-template-columns:1fr;padding:26px}.mini-plot{display:none}.choices{gap:5px}.choice{font-size:.78rem;padding:10px 3px}.step{font-size:.73rem}.plan ul{min-height:auto}.auth{display:block}.auth-story{padding:28px}.auth-story .logo{margin-bottom:30px}.auth-story h1{font-size:2.6rem}.auth-panel{padding:32px 25px}.row.between{align-items:flex-start}.top .btn{font-size:.8rem;min-height:36px;padding:8px 12px}}
@media print{.side,.top,.btn,.footer{display:none!important}.shell{display:block}.content{padding:0}.card{break-inside:avoid}}
@media(prefers-reduced-motion:no-preference){.content{animation:appear .2s ease}@keyframes appear{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}}