*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,sans-serif;background:#f5f5f5;color:#222;min-height:100vh}.container{max-width:720px;margin:0 auto;padding:2rem 1rem;display:flex;flex-direction:column;gap:1.5rem}header{display:flex;align-items:center;gap:1rem}h1{font-size:2rem;font-weight:700;color:#1a1a2e}.badge{background:#16a34a;color:#fff;font-size:.75rem;font-weight:600;padding:.25rem .6rem;border-radius:999px;letter-spacing:.03em}main{display:flex;flex-direction:column;gap:1rem}.card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:1.5rem;display:flex;flex-direction:column;gap:.75rem}h2{font-size:1.1rem;font-weight:600;color:#1a1a2e}ul{list-style:none;display:flex;flex-direction:column;gap:.4rem}li{color:#555}code{background:#f3f4f6;padding:.1rem .35rem;border-radius:4px;font-size:.9em;font-family:Courier New,monospace}.interactive button{margin-top:.25rem;padding:.6rem 1.4rem;background:#1a1a2e;color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:background .15s;align-self:flex-start}.interactive button:hover{background:#2d2d5e}.mono{font-family:Courier New,monospace;font-size:.85rem;color:#555;word-break:break-all}.hint{font-size:.85rem;color:#888}footer{text-align:center;font-size:.8rem;color:#aaa;padding-top:1rem}