*{box-sizing:border-box}body{margin:0;background:#f5f7fb}#app{min-height:100vh;font-family:Arial,Helvetica,sans-serif;color:#1f2937}.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 32px;background:#1d4ed8;color:#fff}.topbar h1{margin:0;font-size:20px}nav{display:flex;gap:18px}nav a{color:#dbeafe;text-decoration:none}nav a.router-link-exact-active{color:#fff;font-weight:700}.page-container{width:min(900px,calc(100% - 32px));margin:32px auto}.page-card{padding:28px;background:#fff;border-radius:12px;box-shadow:0 4px 18px rgba(15,23,42,.08)}.page-card h2{margin-top:0}@media (max-width:640px){.topbar{display:block;padding:18px}nav{margin-top:14px;flex-wrap:wrap;gap:12px}}