/* Shared view switcher: Wallet · List · Chat. Same look on every page. */
.views{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:12px;background:#ecebe7;border:1px solid #e3e2dc}
.views a{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:9px;font-size:13px;font-weight:600;letter-spacing:0;font-family:Inter,system-ui,sans-serif;color:#6b6b66;text-decoration:none;line-height:1;white-space:nowrap;transition:background .15s,color .15s}
.views a:hover{color:#20201f}
.views a.on{background:#fff;color:#20201f;box-shadow:0 1px 2px #0000000f}
.views a:focus-visible{outline:3px solid #a699ff;outline-offset:2px}
.views .views-icon{font-size:12px;opacity:.85}

/* The one header every page shares. Brand left, view switcher centred, page tools right. */
header.topbar{position:relative;max-width:1320px;margin:auto;padding:30px 40px;min-height:98px;display:flex;align-items:center;justify-content:space-between;gap:14px;font-family:Inter,system-ui,sans-serif;font-size:16px;letter-spacing:0;line-height:normal;box-sizing:border-box}
header.topbar .brand{display:flex;flex-direction:row;align-items:center;gap:12px;font-size:19px;font-weight:700;letter-spacing:-.5px;color:#20201f;min-width:0;line-height:1.2}
header.topbar .brand strong{font-size:inherit}
header.topbar .logo{width:31px;height:31px;border-radius:9px;background:#5746e8;display:grid;place-items:center;color:white;font-size:18px;flex-shrink:0}
header.topbar .views{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
header.topbar .toolbar{display:flex;gap:10px;align-items:center;flex-wrap:nowrap;justify-content:flex-end;height:38px;margin:0;padding:0}
header.topbar .toolbar button,header.topbar .toolbar .btn{height:38px;padding:0 14px;border-radius:10px;font-size:13px;font-weight:500;letter-spacing:0;font-family:Inter,system-ui,sans-serif;line-height:1;min-height:0;border:1px solid #e5e5e0;background:#fff;color:#20201f;cursor:pointer;white-space:nowrap}
header.topbar .toolbar .account{height:38px;display:inline-flex;align-items:center}
header.topbar .toolbar button:hover,header.topbar .toolbar .btn:hover{border-color:#bbb6dc;background:#faf9ff}
header.topbar .toolbar .quiet,header.topbar .toolbar .btn-quiet{background:transparent;border-color:transparent;color:#6b6b66}
header.topbar .toolbar .primary,header.topbar .toolbar .btn-primary{background:#5746e8;border-color:#5746e8;color:#fff}
header.topbar .toolbar .account{font-size:13px;color:#6b6b66;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:8px}
@media(max-width:1000px){header.topbar{flex-wrap:wrap;min-height:0}header.topbar .views{position:static;transform:none;order:3;width:100%;justify-content:center;margin:8px 0 0}header.topbar .toolbar{margin-left:auto;flex-wrap:wrap;height:auto}}
@media(max-width:700px){header.topbar{padding:20px}header.topbar .brand{font-size:16px}header.topbar .toolbar .account,header.topbar .toolbar #account,header.topbar .toolbar #tools-account{max-width:140px;margin-right:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* Reserve the scrollbar gutter so short and long pages share the same horizontal layout. */
html{scrollbar-gutter:stable}

/* ---- shared blocks every page uses: intro, footer, pills, chips (one definition, the original look) ---- */
main .intro{display:flex;gap:15px;align-items:center;margin:0 0 30px}
main .intro .avatar{border-radius:50%;width:42px;height:42px;display:grid;place-items:center;background:#232322;color:#fff;font-size:12px;flex-shrink:0}
main .intro h1{font-size:29px;letter-spacing:-1px;margin:0 0 8px;font-weight:650;line-height:35px;font-family:Inter,system-ui,sans-serif}
main .intro p{margin:0;color:#6b6b66;font-size:13px;line-height:20px;letter-spacing:0;font-family:Inter,system-ui,sans-serif}
main .intro .stat strong{font-size:14px;line-height:20px;color:#20201f;font-weight:650}
main .footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:21px 0 0;padding:0;color:#6b6b66;font-size:11px;letter-spacing:0;line-height:normal;font-family:Inter,system-ui,sans-serif}
.pill{display:inline-flex;align-items:center;border-radius:20px;padding:2px 9px;font-size:11px;font-weight:600;letter-spacing:.01em;white-space:nowrap;text-transform:none;font-family:Inter,system-ui,sans-serif}
.pill-preference,.pill-pref{background:#eeeaff;color:#544498}.pill-skill,.pill-work{background:#e7f1ff;color:#1d4f9c}.pill-knowledge{background:#e5f5eb;color:#147a3a}
.pill-always{background:#232322;color:#fff}.pill-confidential{background:#fdeaea;color:#8f2a25}.pill-owner{background:#efefec;color:#6b6b66}.pill-draft{background:#fff0e1;color:#9a4d12}.pill-archived{background:#efefec;color:#6b6b66}.pill-stale{background:#fdeaea;color:#aa302b}.pill-example{background:#eeeaff;color:#6553ee}.pill-block{background:#fdeaea;color:#aa302b}.pill-warn{background:#fff0e1;color:#9a4d12}
.chip{background:#e6e3fa;border:0;border-radius:20px;padding:6px 10px;color:#544498;font-size:11px;font-weight:600;max-width:100%;overflow-wrap:anywhere;cursor:pointer;font-family:Inter,system-ui,sans-serif;letter-spacing:0}
.chip-on,.chip.on{background:#5746e8;color:#fff}
/* Same chip and pill height on every page, whatever the page's base line-height. */
.chip{line-height:1.3}.pill{line-height:1.3}
