/* Shared design tokens and geometry across both tools */
:root{--site-width:1080px;--site-accent:#5965db;--site-border:#e5e9f1;--site-card-radius:20px}
header .nav{width:100%;max-width:var(--site-width);margin:0 auto;padding:18px 24px;min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
header .brand{font-size:20px;font-weight:850;letter-spacing:-.6px;white-space:nowrap}
header .site-menu{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
header .site-menu a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:#47516c;font-size:13px;font-weight:700;padding:10px 13px;background:#f2f4fb;border-radius:9px;min-height:38px;transition:background .15s,color .15s}
header .site-menu a:hover{background:#e6eafd}
header .site-menu a.active,header .site-menu a[aria-current="page"]{color:#fff;background:var(--site-accent)}
main{width:100%;max-width:var(--site-width);margin:0 auto;padding:38px 24px 70px}
main .hero,main .intro{text-align:left;margin:0 0 24px}
main .hero h1,main .intro h1{font-size:30px;line-height:1.3;letter-spacing:-1px;margin:0 0 10px;font-weight:850}
main .hero p,main .intro p{font-size:15px;color:#67738b;line-height:1.7;margin:0}
main .layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:start}
main .panel,main .aside,main .side{border-radius:var(--site-card-radius);border:1px solid var(--site-border);box-shadow:0 8px 25px #1a31500a}
main .panel{padding:24px}
main .aside,main .side{padding:24px}
.site-footer .footer-inner{max-width:var(--site-width)}
@media(max-width:800px){main .layout{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){header .nav{padding:14px 16px;gap:12px}header .site-menu{width:100%}header .site-menu a{flex:1;padding:10px 8px}main{padding:28px 16px 55px}main .panel,main .aside,main .side{padding:17px}main .hero h1,main .intro h1{font-size:26px}}