/* Shared site styles - extracted from inline template CSS */
:root{
  --bg:#F7F8FC; --fg:#111; --muted:#64748b;
  --card:#fff; --ring:#e5e7eb; --brand:#6a5acd; --brand-2:#7c6cff;
}
*{box-sizing:border-box}
html{font-size:100%;-webkit-text-size-adjust:100%}
html,body{height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--fg);line-height:1.5}
a{color:#1e293b;text-decoration:none}
a:hover{color:var(--brand);text-decoration:underline}
.wrap{max-width:1000px;margin:0 auto;padding:16px 14px}
@media (min-width:600px){.wrap{padding:24px 20px}}
@media (min-width:960px){.wrap{padding:32px 24px}}
.card{background:var(--card);border-radius:16px;border:1px solid #e2e8f0;box-shadow:0 2px 8px rgba(0,0,0,.04);padding:24px}
@media (min-width:600px){.card{padding:32px 28px}}
@media (min-width:960px){.card{padding:44px 48px;border-radius:20px;box-shadow:0 4px 12px rgba(0,0,0,.04)}}
.top-bar-card{padding:16px 24px}
@media (min-width:600px){.top-bar-card{padding:20px 28px}}
.main-card{margin-top:24px}
@media (min-width:960px){.main-card{margin-top:32px}}
.top-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:0;padding:4px 0}
.brand-logo-link{display:inline-grid;place-items:center}
.brand-logo{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;flex:0 0 40px;background:var(--brand);box-shadow:0 2px 8px rgba(106,90,205,.2)}
.brand-logo img{width:22px;height:22px;display:block;filter:drop-shadow(0 1px 1px rgba(0,0,0,.15))}
.brand-nav{margin-left:auto;font-size:14px;font-weight:600}
.brand-nav a{color:#1e293b}
.brand-nav a:hover{color:var(--brand)}