@font-face{font-family:Newsreader;font-style:normal;font-weight:200 800;font-display:swap;src:url('assets/fonts/newsreader/Newsreader-Roman-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Newsreader;font-style:normal;font-weight:200 800;font-display:swap;src:url('assets/fonts/newsreader/Newsreader-Roman-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{color-scheme:light;--bg:#fff;--surface:#fff;--sidebar:#F6F7F2;--ink:#1C1D18;--muted:#73766D;--line:#ECEEE6;--border:#E6E8E0;--accent:#5C6B10;--primary:#4F5D0E;--primary-hover:#3E4A0B;--tint:#EEF2D9;--selected:#DCDFD5;--hover:#F3F5EE;--danger:#A94B3A;--danger-wash:#F6E8E2;--ui:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue','PingFang SC','Hiragino Sans GB',sans-serif;--serif:Newsreader,'Iowan Old Style',Georgia,'Songti SC',serif;--mono:'SFMono-Regular',Menlo,monospace;--page:32px;--heading:18px;--body:14px;--caption:13px;--label:12px;--card-name:28px;--leading:1.5;--sidebar-width:232px;--space:8px;--page-pad:44px;--card-gap:24px;--radius:7px;--card-radius:12px;--menu-radius:10px;--dialog-radius:12px;--shadow:0 16px 40px rgb(28 29 24 / .12);--enter:200ms;--exit:140ms;--feedback:150ms;--ease:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}
html,body{margin:0;min-width:0;width:100%;height:100%;background:var(--bg);color:var(--ink)}
body{font:var(--body)/var(--leading) var(--ui);-webkit-font-smoothing:antialiased}
button,input,textarea{font:inherit;color:inherit}
button,a,input,textarea{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:default}
button{border:0;background:transparent}
a{color:var(--accent);text-decoration:none;overflow-wrap:anywhere}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
img{max-width:100%}
[hidden]{display:none!important}
h1,h2,h3,p{margin:0}
h1{font-size:var(--page);line-height:1.25;font-weight:600;letter-spacing:-.025em}
h2{font-size:var(--heading);line-height:1.35;font-weight:600;letter-spacing:-.01em}
h3{font-size:var(--body);line-height:1.5;font-weight:600}
svg{display:block;flex:none;width:16px;height:16px}
.muted{color:var(--muted)}
.small{font-size:var(--caption)}
.overline{font-size:var(--label);font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:8px 16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);font-weight:500;line-height:1.4;white-space:nowrap;transition:background var(--feedback) var(--ease)}
.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.btn:disabled{opacity:.5}
.btn.compact{min-height:32px;padding:4px 12px;font-size:var(--caption)}
.text-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:8px 0;color:var(--accent);font-weight:500}
.icon-btn{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--radius);color:var(--muted);flex:none}
.icon-btn svg{width:18px;height:18px}
.danger-text{color:var(--danger)}
.pill{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:4px;background:var(--hover);color:var(--muted);font-size:var(--label);white-space:nowrap}
.pill.good{background:var(--tint);color:var(--accent)}
.pill.warning{background:#F6EEDD;color:#785818}
.badge{display:inline-grid;place-items:center;min-width:20px;min-height:20px;border-radius:4px;padding:0 4px;font-size:var(--label);background:var(--hover);color:var(--muted)}
.unpublished{display:inline-flex;align-items:center;gap:8px;color:var(--danger);font-size:var(--caption)}
.red-dot{display:block;flex:none;width:6px;height:6px;border-radius:50%;background:var(--danger)}
.app-shell{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);height:100dvh;min-height:0}
.sidebar{display:flex;flex-direction:column;gap:4px;min-width:0;padding:24px 12px 16px;background:var(--sidebar)}
.window-dots{display:flex;gap:8px;padding:0 10px 24px;align-items:center}
.window-dots i{display:block;width:12px;height:12px;border-radius:50%;background:#D8DBD1}
.brand{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 10px;margin-bottom:16px;font-weight:600;color:var(--ink)}
.brand img{display:block;width:24px;height:24px;border-radius:22%}
.nav-list{display:flex;flex-direction:column;gap:4px}
.nav-item{display:flex;align-items:center;gap:12px;width:100%;min-height:36px;padding:8px 12px;border-radius:8px;text-align:left;color:var(--muted)}
.nav-item svg{stroke-width:1.7}
.nav-item.selected{color:var(--ink);background:var(--selected);font-weight:600}
.nav-item:disabled{color:var(--muted)}
.nav-item .red-dot{margin-left:auto}
.sidebar-fill{flex:1;min-height:32px}
.sidebar-foot{display:flex;flex-direction:column;gap:4px;padding:12px 0 0;border-top:1px solid var(--border)}
:root{--sidebar-body:var(--body);--sidebar-meta:var(--label);--sidebar-status-text:var(--caption);--sidebar-muted:#596050;--sidebar-control:36px;--sidebar-menu-row:32px;--sidebar-touch:44px;--sidebar-inline-padding:12px;--sidebar-account-avatar:28px;--sidebar-menu-width:256px;--sidebar-menu-gap:8px;--sidebar-menu-padding:8px;--sidebar-status-size:6px;--sidebar-dialog-width:480px;--sidebar-dialog-body:16px;--sidebar-dialog-meta:14px}
.sidebar-status-wrap,.sidebar-account-wrap{position:relative;min-width:0}
.capture-status{display:flex;align-items:center;gap:var(--sidebar-menu-gap);width:100%;min-height:var(--sidebar-control);padding:8px var(--sidebar-inline-padding);border-radius:var(--radius);text-align:left;color:var(--sidebar-muted);font-size:var(--sidebar-status-text);line-height:var(--leading)}
.capture-status .od-field{--od-gap:0px}
.capture-status small{display:block;font-size:var(--sidebar-meta);overflow-wrap:anywhere}
.status-dot{width:var(--sidebar-status-size);height:var(--sidebar-status-size);display:block;flex:none;margin-inline:calc((var(--sidebar-account-avatar) - var(--sidebar-status-size)) / 2);border:1px solid var(--sidebar-muted);border-radius:50%}
.capture-status.is-active .status-dot{background:var(--accent);border-color:var(--accent)}
.account{display:flex;align-items:center;gap:var(--sidebar-menu-gap);width:100%;min-height:var(--sidebar-control);text-align:left;padding:4px var(--sidebar-inline-padding);border-radius:var(--radius);font-size:var(--sidebar-body)}
.account .avatar{width:var(--sidebar-account-avatar);height:var(--sidebar-account-avatar);font-size:var(--caption)}
.account .od-field{--od-gap:0px}
.account small{color:var(--muted);font-size:var(--label)}
.sidebar-account-name,.sidebar-account-email{display:block;overflow-wrap:anywhere}
.sidebar-account-email{color:var(--sidebar-muted);font-size:var(--sidebar-meta)}
.sidebar-update{width:100%;min-height:var(--sidebar-control);padding:8px var(--sidebar-inline-padding);gap:var(--sidebar-menu-gap);border-radius:var(--radius);font-size:var(--sidebar-status-text);text-align:left;color:var(--ink)}
.sidebar-update svg{color:var(--accent);margin-inline:calc((var(--sidebar-account-avatar) - 16px) / 2)}
.sidebar-foot .sidebar-popover{top:auto;bottom:calc(100% + var(--sidebar-menu-gap));left:0;right:auto;width:var(--sidebar-menu-width);min-width:0;max-width:calc(var(--window-width) - 48px);max-height:max(144px,calc(100dvh - 192px));overflow-y:auto;overscroll-behavior:contain;padding:var(--sidebar-menu-padding);color:var(--ink);animation:sidebar-menu-enter var(--enter) ease-out}
.sidebar-menu-title{font:500 var(--sidebar-meta)/var(--leading) var(--ui);color:var(--sidebar-muted);padding:4px var(--sidebar-menu-padding)}
.sidebar-foot .menu-option{min-height:var(--sidebar-menu-row);padding:4px var(--sidebar-menu-padding);font-size:var(--sidebar-body);line-height:var(--leading);white-space:normal;gap:var(--sidebar-menu-gap)}
.pause-option>span,.pause-option>small{display:block}
.pause-option>span{white-space:nowrap}
.pause-option>small{font-size:var(--sidebar-meta);color:var(--sidebar-muted);white-space:nowrap;flex:none}
.resume-option{color:var(--accent)}
.sidebar-menu-divider{height:1px;background:var(--border);margin:var(--sidebar-menu-gap) 0}
.sidebar-menu-identity{padding:var(--sidebar-menu-padding);--od-gap:12px}
.sidebar-menu-identity .od-field{--od-gap:4px}
.sidebar-menu-identity .avatar{width:32px;height:32px;font-size:var(--sidebar-body)}
.sidebar-menu-identity .sidebar-account-name{font-size:var(--sidebar-body)}
.account-option kbd{font:400 var(--sidebar-meta)/var(--leading) var(--ui);color:var(--sidebar-muted);white-space:nowrap}
.sidebar-dialog{width:var(--sidebar-dialog-width);font-size:var(--sidebar-dialog-body);line-height:var(--leading)}
.sidebar-dialog .dialog-head p,.sidebar-dialog .field-help,.sidebar-dialog .identity-row p{font-size:var(--sidebar-dialog-meta);color:var(--sidebar-muted)}
.sidebar-dialog .identity-row strong{font-size:var(--sidebar-dialog-body);overflow-wrap:anywhere}
.sidebar-dialog .field-error{font-size:var(--sidebar-dialog-meta)}
.sidebar-dialog-body{display:flex;flex-direction:column;gap:16px;overflow-wrap:anywhere}
.sidebar-dialog-body .identity-row{margin-bottom:0}
.sidebar-empty{--od-gap:16px;align-items:flex-start;padding:16px 0}
.sidebar-empty>svg{width:24px;height:24px;color:var(--accent)}
.sidebar-empty h3{font-size:var(--sidebar-dialog-body)}
.sidebar-empty p,.sidebar-capability-note{color:var(--sidebar-muted);font-size:var(--sidebar-dialog-meta);line-height:var(--leading)}
.sidebar-settings{--od-gap:24px}
.sidebar-settings .od-field{--od-gap:4px}
.sidebar-settings small{font-size:var(--sidebar-dialog-meta);color:var(--sidebar-muted)}
.sidebar-dialog .dialog-actions .btn{min-height:var(--sidebar-touch)}
@media(pointer:coarse){.sidebar-foot{gap:var(--sidebar-menu-gap)}.capture-status,.account,.sidebar-update,.sidebar-foot .menu-option{min-height:var(--sidebar-touch)}}
@media(hover:hover){.capture-status:hover,.account:hover,.sidebar-update:hover{background:var(--selected);color:var(--ink)}}
@keyframes sidebar-menu-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.main{position:relative;min-width:0;min-height:0;overflow:auto;scrollbar-gutter:stable;padding:var(--page-pad) var(--page-pad) 64px}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:40px;flex-wrap:wrap}
.page-intro{font-size:16px;color:var(--muted);margin-top:8px;max-width:64ch}
.head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
:root{--peers-tab-size:16px;--peers-tab-gap:24px;--peers-tab-height:44px;--peers-panel-gap:24px;--peers-dot-size:8px;--peers-underline:2px;--peers-activity-width:720px}
.peers-section{min-width:0}
.peers-toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--peers-tab-gap);flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:var(--peers-panel-gap)}
.peers-tabs{--od-gap:var(--peers-tab-gap);flex:none;align-items:stretch}
.peers-tab{--od-gap:var(--space);position:relative;min-height:var(--peers-tab-height);padding:var(--space) 0;color:var(--muted);font-size:var(--peers-tab-size);font-weight:400;transition:color var(--feedback) var(--ease)}
.peers-tab>span{display:block}
.peers-tab::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:var(--peers-underline);background:var(--accent);opacity:0;transition:opacity var(--feedback) var(--ease)}
.peers-tab[aria-selected=true]{color:var(--ink);font-weight:500}
.peers-tab[aria-selected=true]::after{opacity:1}
.peers-count{color:var(--muted);font-size:var(--caption);font-weight:400}
.peers-unread{flex:none;width:var(--peers-dot-size);height:var(--peers-dot-size);border-radius:50%;background:var(--danger);visibility:hidden}
.peers-unread.is-unread{visibility:visible}
.peers-panel{display:block;min-width:0}
.main[data-route="peers"]{display:grid;grid-template-rows:auto minmax(0,1fr);overflow:clip;scrollbar-gutter:auto;padding-bottom:0}
.main[data-route="peers"] .peers-section{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0}
.main[data-route="peers"] .peers-panel{scrollbar-gutter:stable;padding:0 var(--space) calc(8 * var(--space)) 0}
.main[data-route="peers"] .peers-panel:focus-visible{outline-offset:-4px}
.peers-panel:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:var(--radius)}
.peers-toolbar .menu-wrap{padding-bottom:var(--space)}
.peers-empty{font-size:var(--peers-tab-size)}
@media(hover:hover){.peers-tab:hover{color:var(--ink)}}
.collection-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.collection-title{display:flex;align-items:center;gap:8px}
.collection-title h2{font-size:var(--body);font-weight:500}
.peer-grid{--peer-card-width:264px;--peer-card-min-height:296px;--peer-card-face-height:144px;--peer-card-padding:12px;--peer-card-avatar:32px;--peer-card-name:20px;--peer-card-text:14px;--peer-card-meta:13px;--peer-card-label:11px;display:grid;grid-template-columns:repeat(3,minmax(0,var(--peer-card-width)));gap:var(--card-gap);justify-content:start}
.peer-card{display:flex;flex-direction:column;text-align:left;min-height:var(--peer-card-min-height);height:auto;min-width:0;width:100%;padding:0;border:1px solid var(--border);border-radius:var(--card-radius);background:#fff;box-shadow:0 2px 4px rgb(28 29 24 / .025);transition:box-shadow var(--feedback),border-color var(--feedback)}
.card-face{display:flex;flex-direction:column;align-items:center;background:var(--face,#fff);color:var(--face-ink,var(--ink));padding:16px 24px 24px;border-radius:var(--card-radius) var(--card-radius) 0 0;width:100%}
.peer-card .card-face{height:var(--peer-card-face-height);flex:none;align-items:stretch;gap:var(--space);padding:var(--peer-card-padding)}
.card-brand{display:flex;justify-content:space-between;gap:16px;width:100%;color:var(--face-muted,var(--muted));font-size:10px;letter-spacing:.1em;font-weight:500;line-height:1.4}
.card-face .avatar{margin-top:20px;margin-bottom:12px;width:64px;height:64px}
.avatar{display:grid;place-items:center;flex:none;overflow:hidden;width:40px;height:40px;border-radius:50%;font:400 20px/1 var(--serif);background:var(--avatar-bg,var(--tint));color:var(--face-ink,var(--accent))}
.avatar img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.card-name{display:block;width:100%;font:400 var(--card-name)/1.2 var(--serif);letter-spacing:-.02em;text-align:center}
.card-role{display:block;margin-top:8px;color:var(--face-muted,var(--muted));font-size:var(--caption);min-height:20px;max-width:100%}
.card-copy{display:flex;flex-direction:column;gap:16px;padding:20px 24px 24px;flex:1;width:100%;min-height:0;color:var(--ink)}
.card-about{font-size:var(--body);line-height:1.5;flex:none}
.card-skills{display:grid;gap:4px;margin-top:auto}
.card-skills .overline{font-size:10px;letter-spacing:.06em;margin-bottom:4px}
.card-skills span{display:block;font-size:var(--caption)}
.card-fallback{color:var(--muted);font-size:var(--caption);line-height:1.5;max-width:24ch}
.card-copy.mystery{justify-content:center;text-align:center;align-items:center}
.peer-card .card-brand{font-size:var(--peer-card-label)}
.peer-card .card-identity{width:100%;flex:1;min-height:0;align-items:center;justify-content:center;--od-gap:4px}
.peer-card .card-identity .od-field{width:100%;--od-gap:4px}
.peer-card .card-face .avatar{width:var(--peer-card-avatar);height:var(--peer-card-avatar);margin:0;font-size:var(--peer-card-text);line-height:var(--leading)}
.peer-card .card-name{font-size:var(--peer-card-name);text-align:center}
.peer-card .card-role{font-size:var(--peer-card-meta);margin-top:0;min-height:0;text-align:center}
.peer-card .card-copy{padding:var(--peer-card-padding);gap:var(--space)}
.peer-card .card-about,.peer-card .card-fallback{font-size:var(--peer-card-text)}
.peer-card .card-skills span{font-size:var(--peer-card-meta)}
.peer-card .card-skills .overline{font-size:var(--peer-card-label);margin-bottom:0}
.sort-button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:36px;padding:8px 12px;border:1px solid var(--border);border-radius:var(--radius);font-size:var(--caption);background:white;white-space:nowrap}
.sort-button svg{width:14px;height:14px}
.menu-wrap{position:relative;flex:none}
.popover{position:absolute;top:calc(100% + 8px);right:0;min-width:200px;padding:4px;background:white;border:1px solid var(--border);border-radius:var(--menu-radius);box-shadow:var(--shadow);z-index:12}
.menu-option{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:8px 12px;min-height:36px;font-size:var(--caption);text-align:left;border-radius:var(--radius);white-space:nowrap}
.menu-option[aria-checked=true]{background:var(--tint);color:var(--accent)}
.activity-panel{min-width:0;width:100%;max-width:var(--peers-activity-width)}
.activity-items{--od-gap:0px}
.activity-items>.activity-date:first-child{margin-top:0}
.activity-copy,.activity-skill{overflow-wrap:anywhere}
.activity-panel h2{font-size:var(--body);font-weight:500;margin-bottom:24px}
.activity-date{font-size:var(--label);color:var(--muted);margin:24px 0 16px}
.activity-row{display:flex;gap:12px;width:100%;text-align:left;margin-bottom:24px;padding:0;border-radius:4px;color:var(--ink)}
.activity-row .avatar{width:28px;height:28px;font-size:var(--body)}
.activity-row .od-field{--od-gap:4px}
.activity-copy{font-size:var(--caption);line-height:1.55}
.activity-skill{color:var(--accent);font-weight:500;font-size:var(--caption)}
.activity-time{color:var(--muted);font-size:var(--label)}
.empty{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;min-height:400px;text-align:center;padding:48px 24px}
.empty h2{max-width:32ch;font:400 28px/1.3 var(--serif)}
.empty p{color:var(--muted);max-width:44ch}
.empty .empty-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--tint);color:var(--accent);margin-bottom:8px}
.empty svg{width:24px;height:24px}
.empty.compact{min-height:200px;padding:32px 16px}
.empty.compact h2{font:500 var(--heading)/1.4 var(--ui)}
:root{--card-detail-width:560px;--card-detail-inset:24px;--card-detail-viewport-gap:48px;--card-detail-face-radius:8px;--my-card-border:#D1D4C9;--my-card-shadow:0 4px 16px rgb(28 29 24 / .06)}
.narrow-page{max-width:560px;margin:0 auto}
.narrow-page.my-card-page{max-width:calc(var(--card-detail-width) - 2 * var(--card-detail-inset))}
.back-link{display:inline-flex;align-items:center;gap:8px;min-height:36px;color:var(--muted);margin-bottom:24px;padding:0}
.narrow-page .page-head{margin-bottom:24px;gap:16px}
.narrow-page .page-intro{font-size:var(--body)}
.detail-card{border:1px solid var(--border);border-radius:var(--card-radius);background:white}
.detail-card .card-face{padding:20px 24px 32px}
.detail-card .avatar{width:72px;height:72px;margin-top:28px;margin-bottom:16px;font-size:28px}
.detail-body{padding:24px;display:flex;flex-direction:column;gap:28px}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.section-heading .text-btn{min-height:24px;padding:0;font-size:var(--caption)}
.section-copy{line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}
.skill-list{display:flex;flex-direction:column;gap:12px}
.skill-row{display:flex;align-items:center;gap:12px;width:100%;padding:16px;text-align:left;border:1px solid var(--border);border-radius:8px;background:white;color:var(--ink)}
.skill-row .od-field{--od-gap:4px}
.skill-row strong{font-weight:500}
.skill-row p{font-size:var(--caption);line-height:1.5;color:var(--muted)}
.skill-row svg{margin-left:auto;color:var(--muted)}
.public-setting{display:flex;flex-direction:column;gap:12px;margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}
.toggle{display:block;position:relative;width:40px;height:24px;background:#D1D4C9;border-radius:16px;padding:0;flex:none;border:1px solid transparent}
.toggle::after{content:'';display:block;width:18px;height:18px;background:white;border-radius:50%;margin:2px;box-shadow:0 1px 2px rgb(0 0 0 / .1);transition:transform var(--feedback) var(--ease)}
.toggle[aria-checked=true]{background:var(--accent)}
.toggle[aria-checked=true]::after{transform:translateX(16px)}
.toggle:disabled{opacity:.5}
.public-link{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--hover);border-radius:var(--radius)}
.public-link a{font-family:var(--mono);font-size:var(--label);flex:1;min-width:0;overflow-wrap:anywhere}
.agent-soon{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:24px 0 0;border-top:1px solid var(--line);color:var(--muted);font-size:var(--caption);text-align:left}
.agent-soon .pill{background:var(--hover)}
dialog{margin:auto;border:1px solid var(--border);border-radius:var(--dialog-radius);padding:0;background:white;color:var(--ink);width:min(580px,calc(100vw - 48px));max-height:calc(100dvh - 48px);box-shadow:0 24px 80px rgb(20 24 14 / .18);overflow:auto}
dialog::backdrop{background:rgb(28 29 24 / .24)}
dialog[open]{animation:dialog-enter var(--enter) ease-out}
dialog.editor-dialog{width:min(880px,calc(100vw - 48px))}
dialog.card-dialog{width:min(var(--card-detail-width),calc(100vw - var(--card-detail-viewport-gap)))}
dialog.confirm-dialog{width:min(464px,calc(100vw - 48px))}
:root{--invitation-dialog-width:640px;--invitation-section-gap:16px;--invitation-section-pad:24px;--invitation-title-size:18px;--invitation-body-size:14px;--invitation-caption-size:13px;--invitation-avatar-size:16px;--invitation-leading:1.5}
dialog.invitations-dialog{width:min(var(--invitation-dialog-width),calc(100vw - 48px));font-size:var(--invitation-body-size);line-height:var(--invitation-leading)}
.invitations-dialog .dialog-head h2{font-size:var(--invitation-title-size);line-height:1.4;font-weight:600}
.invitations-dialog .btn,.invitations-dialog .btn.compact,.invitations-dialog .field input,.invitations-dialog .field label,.invitations-dialog .identity-row strong{font-size:var(--invitation-body-size)}
.invitations-dialog .dialog-head p,.invitations-dialog .small,.invitations-dialog .field-help,.invitations-dialog .field-error,.invitations-dialog .identity-row p,.invitations-dialog .remaining,.invitations-dialog .row-status,.invitations-dialog .permission-note,.invitations-dialog .invitation-success{font-size:var(--invitation-caption-size);line-height:var(--invitation-leading)}
.invitations-dialog .identity-row .avatar{font-size:var(--invitation-avatar-size)}
.invitations-dialog .empty.compact h2{font-size:var(--invitation-body-size)}
.invitation-composer{--od-gap:var(--invitation-section-gap);padding:var(--invitation-section-pad);font-size:var(--invitation-body-size)}
.invitation-composer h3{font-size:var(--invitation-body-size)}
.invitation-composer .field{margin:0}
.invitation-composer .identity-row{margin:0}
.invitation-composer .notice{margin:0}
.invite-email-row{--od-gap:var(--invitation-section-gap)}
.invite-email-row .btn{flex:none;min-height:48px}
.invitation-compose-actions{--od-gap:var(--invitation-section-gap);justify-content:space-between;flex-wrap:wrap}
.invitation-success{--od-gap:var(--space);padding:var(--invitation-section-gap);border-radius:var(--radius);background:var(--tint);color:var(--primary);font-size:var(--caption);overflow-wrap:anywhere}
.invitations-dialog .tab{font-size:var(--invitation-body-size)}
.invitations-dialog .invitation-foot{padding-left:0}
.invitations-dialog [role=tabpanel]:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}
.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:white;z-index:3}
.dialog-head p{margin-top:4px;color:var(--muted);font-size:var(--caption)}
.dialog-head h2{font-size:var(--heading)}
.dialog-body{padding:24px}
.dialog-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px;padding:16px 24px 24px}
.dialog-actions.between{justify-content:space-between}
.dialog-head .popover{min-width:160px}
.card-dialog .dialog-body{padding:0 var(--card-detail-inset) var(--card-detail-inset)}
.card-dialog .dialog-head{border:0;padding-bottom:16px}
.card-dialog .detail-card{border:0}
.card-dialog .detail-body{padding:var(--card-detail-inset) 0 0}
.card-dialog .card-face{border-radius:var(--card-detail-face-radius)}
.my-card-page>.detail-card{border:1px solid var(--my-card-border);background:var(--surface);box-shadow:var(--my-card-shadow)}
.my-card-page>.detail-card .detail-body{padding:var(--card-detail-inset)}
.my-card-page>.detail-card .card-face{border-radius:calc(var(--card-radius) - 1px) calc(var(--card-radius) - 1px) 0 0}
.confirm-copy{display:flex;flex-direction:column;gap:16px;line-height:1.65}
.identity-row{display:flex;align-items:center;gap:12px;padding:16px;background:var(--hover);border:1px solid var(--line);border-radius:8px;margin-bottom:24px}
.identity-row .avatar{width:48px;height:48px}
.identity-row .od-field{--od-gap:2px}
.identity-row strong{font-weight:500}
.identity-row p{color:var(--muted);font-size:var(--caption);overflow-wrap:anywhere}
.field{display:flex;flex-direction:column;gap:8px;min-width:0;margin-bottom:20px}
.field label{font-weight:500}
.field input,.field textarea{display:block;width:100%;min-width:0;border:1px solid var(--border);border-radius:var(--radius);padding:12px;background:white;line-height:1.5;appearance:none}
.field textarea{resize:vertical;min-height:100px}
.field input::placeholder,.field textarea::placeholder{color:var(--muted)}
.field input[aria-invalid=true]{border-color:var(--danger)}
.field-error{display:block;min-height:20px;color:var(--danger);font-size:var(--caption)}
.field-help{color:var(--muted);font-size:var(--caption)}
.editor-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px;align-items:start}
.editor-preview{padding-top:4px}
.editor-preview .detail-card{margin-top:12px}
.editor-preview .card-name{font-size:24px}
.editor-preview .detail-body{font-size:var(--caption);padding:20px}
.swatches{display:flex;gap:12px;margin-top:12px;flex-wrap:wrap}
.swatch{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--border)}
.swatch[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:3px}
.swatch svg{width:16px;height:16px}
.upload-row{display:flex;align-items:center;gap:12px;margin-bottom:24px;flex-wrap:wrap}
.upload-row .avatar{width:48px;height:48px}
.file-input{display:none}
.notice{display:flex;align-items:flex-start;gap:12px;background:var(--hover);border-radius:8px;padding:16px;margin:16px 0;color:var(--muted);line-height:1.6;font-size:var(--caption)}
.notice svg{margin-top:2px;color:var(--accent)}
.notice.warning{background:#F6EEDD;color:#785818}
.notice.error{background:var(--danger-wash);color:var(--danger)}
.success-symbol{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--tint);color:var(--accent);margin-bottom:20px}
.success-symbol svg{width:24px;height:24px}
.success-copy h2{margin-bottom:12px}
.success-copy p{color:var(--muted);line-height:1.65;overflow-wrap:anywhere}
.tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin:0 24px}
.tab{display:flex;align-items:center;gap:8px;min-height:44px;border-bottom:2px solid transparent;color:var(--muted);padding:12px 0}
.tab[aria-selected=true]{color:var(--ink);border-color:var(--accent);font-weight:500}
.invitation-row{display:flex;flex-direction:column;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.invitation-row:first-child{padding-top:0}
.invitation-row:last-child{border:0;padding-bottom:0}
.invitation-row .identity-row{padding:0;background:none;border:0;margin:0}
.invitation-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-left:60px}
.invitation-foot .head-actions{gap:8px}
.remaining{color:var(--muted);font-size:var(--label);white-space:nowrap}
.row-status{font-size:var(--caption);font-weight:500;color:var(--muted);display:flex;align-items:center;gap:8px}
.row-status.accepted{color:var(--accent)}
.permission-note{padding:16px 24px;background:var(--hover);font-size:var(--caption);color:var(--muted);line-height:1.6;border-radius:0 0 var(--dialog-radius) var(--dialog-radius)}
.skill-detail{font-size:16px;line-height:1.65}
.skill-detail h1{font-size:28px;line-height:1.25;margin-bottom:12px;overflow-wrap:anywhere}
.skill-detail .purpose{color:var(--muted);margin-bottom:16px;font-size:var(--body)}
.skill-detail .skill-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:28px;font-size:var(--caption)}
.skill-section{margin:24px 0}
.skill-section h3{font-size:var(--body);margin-bottom:12px}
.skill-section p,.skill-section li{font-size:16px;line-height:1.7;overflow-wrap:anywhere}
.skill-section ol{margin:0;padding-left:24px}
.skill-section li+li{margin-top:12px}
.file-row{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius);text-align:left;font-size:var(--caption);margin-top:8px}
.file-row span{overflow-wrap:anywhere;min-width:0}
.file-row svg:last-child{margin-left:auto}
.file-content{display:block;width:100%;padding:16px;background:var(--hover);border:1px solid var(--line);border-radius:8px;white-space:pre-wrap;overflow-wrap:anywhere;font:var(--caption)/1.7 var(--mono);max-height:320px;overflow:auto}
.check-row{display:flex;align-items:flex-start;gap:12px;cursor:pointer;padding:16px 0;border-bottom:1px solid var(--line)}
.check-row input{appearance:none;display:grid;place-items:center;flex:none;width:20px;height:20px;margin:2px 0 0;border:1px solid #B3B8AA;border-radius:4px;background:white;cursor:pointer}
.check-row input:checked{background:var(--accent);border-color:var(--accent)}
.check-row input:checked::after{content:'';display:block;width:10px;height:6px;border-left:2px solid white;border-bottom:2px solid white;transform:rotate(-45deg);margin-top:-2px}
.check-row .od-field{--od-gap:4px}
.check-row .od-field p{color:var(--muted);font-size:var(--caption)}
.playbook-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:24px}
.playbook-skill{display:flex;flex-direction:column;text-align:left;gap:16px;min-height:224px;padding:24px;border:1px solid var(--border);border-radius:12px;background:white;color:var(--ink)}
.playbook-skill .skill-mark{display:grid;place-items:center;width:36px;height:36px;background:var(--tint);color:var(--accent);border-radius:8px}
.playbook-skill h2{font-size:var(--heading)}
.playbook-skill p{color:var(--muted);font-size:var(--caption)}
.playbook-skill .source{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:var(--label);color:var(--muted)}
.filter-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.filter-tab{min-height:36px;border-radius:7px;padding:8px 12px;color:var(--muted)}
.filter-tab[aria-pressed=true]{background:var(--selected);color:var(--ink);font-weight:500}
.outside-page{min-height:100dvh;background:#fff;padding:40px 24px 64px}
.outside-brand{display:flex;align-items:center;gap:12px;font-weight:600;max-width:560px;margin:0 auto 48px}
.outside-brand img{width:28px;height:28px;display:block;border-radius:22%}
.outside-content{max-width:560px;margin:auto}
.email-surface{border:1px solid var(--border);border-radius:12px;padding:32px}
.email-surface h1{font-size:28px;line-height:1.3;margin-bottom:12px;max-width:24ch}
.email-surface p{margin-bottom:20px;line-height:1.7}
.email-meta{display:flex;flex-direction:column;gap:8px;margin:28px 0;color:var(--muted);font-size:var(--caption)}
.result-page{padding:56px 0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.result-page h1{font-size:28px;line-height:1.3;max-width:26ch}
.result-page p{max-width:44ch;color:var(--muted);line-height:1.7}
.result-page .btn{margin-top:8px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:12px 20px;background:var(--ink);color:#fff;border-radius:8px;box-shadow:var(--shadow);z-index:100;font-size:var(--caption);max-width:calc(100vw - 32px);animation:toast-enter var(--enter) ease-out}
.toast svg{color:#C5D69B}
.toast button{color:white;text-decoration:underline}
@media(hover:hover){.btn:not(:disabled):hover{background:var(--hover)}.btn.primary:not(:disabled):hover{background:var(--primary-hover)}.btn.danger:not(:disabled):hover{background:#8D3D2E}.icon-btn:hover,.menu-option:hover,.filter-tab:hover{background:var(--hover)}.nav-item:not(:disabled):hover{background:#E4E6DE;color:var(--ink)}.peer-card:hover{border-color:#B6BDA5;box-shadow:0 8px 24px rgb(28 29 24 / .08)}.skill-row:hover,.playbook-skill:hover{background:#F7F8F3;border-color:#C4CBBA}.activity-row:hover .activity-copy,.text-btn:hover,.back-link:hover{color:var(--ink)}a:hover{text-decoration:underline}.file-row:hover{background:var(--hover)}}
@keyframes dialog-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes toast-enter{from{opacity:0;transform:translateX(-50%) translateY(8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
@media(min-width:1440px){.main{padding-top:48px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
:root{--window-width:1200px;--desktop-min-width:calc(var(--window-width) + 2 * var(--desktop-inline-inset));--desktop-inset:24px;--desktop-inline-inset:0px;--desktop-ground:#E9EBE5;--window-border:rgba(28,29,24,.18);--window-radius:16px;--window-shadow:0 24px 64px rgba(28,29,24,.12),0 4px 16px rgba(28,29,24,.06);--window-max-width:var(--window-width);--window-max-height:960px}
html{min-width:var(--desktop-min-width);overflow-x:auto}
body:has(.app-shell){display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:var(--desktop-inset) var(--desktop-inline-inset);background:var(--desktop-ground);overflow:hidden}
body:has(.app-shell)>#app{width:var(--window-width);min-width:0}
.app-shell{width:var(--window-width);max-width:var(--window-max-width);height:calc(100dvh - 2 * var(--desktop-inset));max-height:var(--window-max-height);border:1px solid var(--window-border);border-radius:var(--window-radius);box-shadow:var(--window-shadow);background:var(--surface);overflow:clip}
body:has(.app-shell) dialog{max-width:calc(100vw - 2 * var(--desktop-inline-inset) - 32px);max-height:min(calc(100dvh - 2 * var(--desktop-inset) - 32px),calc(var(--window-max-height) - 32px))}
:root{--suggestion-body:var(--body);--suggestion-meta:var(--caption);--suggestion-muted:var(--muted);--suggestion-touch:44px;--suggestion-section-gap:24px;--suggestion-inline-pad:12px;--suggestion-header-height:40px;--suggestion-paragraph-gap:calc(2 * var(--space));--suggestion-narrow-pad:16px;--suggestion-sidebar-width:64px}
.suggestion-card{color:var(--ink)}
.suggestion-card-header{--od-gap:var(--space);min-height:var(--suggestion-header-height);padding:4px var(--peer-card-padding);letter-spacing:.06em}
.suggestion-source{--od-gap:0px}
.suggestion-source>.od-row{--od-gap:var(--space);justify-content:space-between}
.suggestion-source span{display:block;white-space:nowrap}
.suggestion-card .suggestion-connect{flex:none;min-height:32px;padding:4px var(--space);border:0;border-radius:calc(var(--space) / 2);background:transparent;color:var(--primary);font-size:var(--peer-card-meta);font-weight:500;letter-spacing:normal;line-height:var(--leading);transition:background var(--feedback) var(--ease)}
.suggestion-card .suggestion-connect:not(:disabled):active{background:var(--tint);color:var(--primary-hover)}
.suggestion-open{--od-gap:0px;flex:1;align-items:stretch;width:100%;padding:0;text-align:left;border-radius:var(--card-radius);color:var(--ink)}
.suggestion-open:focus-visible{outline-offset:-4px}
.suggestion-open .card-face{height:calc(var(--peer-card-face-height) - var(--suggestion-header-height));padding-block:var(--space)}
.suggestion-summary{--od-gap:4px}
.suggestion-summary>.overline{font-size:var(--peer-card-label);letter-spacing:.06em}
.suggestion-relationship{color:var(--muted);overflow-wrap:anywhere}
.suggestion-detail-dialog .dialog-head>.od-field{flex:1}
.suggestion-detail-dialog .dialog-head p{overflow-wrap:anywhere}
.suggestion-detail-dialog .dialog-actions{justify-content:center}
.suggestion-detail-dialog .section-copy{line-height:var(--leading)}
.suggestion-basic-info{--od-gap:var(--suggestion-paragraph-gap);margin:0;font-size:var(--suggestion-body);line-height:var(--leading)}
.suggestion-basic-row{--od-gap:var(--suggestion-paragraph-gap)}
.suggestion-basic-row dt{width:calc(8 * var(--space));color:var(--suggestion-muted)}
.suggestion-basic-row dd{margin:0;overflow-wrap:anywhere}
.suggestion-paragraphs{--od-gap:var(--suggestion-paragraph-gap)}
.suggestion-paragraphs#suggestion-identity{--od-gap:0}
.suggestion-paragraphs#suggestion-identity>.section-copy+.section-copy{margin-block-start:var(--suggestion-paragraph-gap)}
.suggestion-paragraphs#suggestion-identity>.section-copy:nth-child(3){margin-block-start:calc(var(--space) / 2)}
.suggestion-relationship-label{align-self:flex-start;white-space:normal;overflow-wrap:anywhere}
.suggestion-moments{--od-gap:var(--suggestion-paragraph-gap);margin:0;padding-left:var(--suggestion-section-gap)}
.suggestion-invite-note{margin:0;padding:var(--space) var(--invitation-section-pad);font-size:var(--suggestion-meta);line-height:var(--leading);color:var(--suggestion-muted);overflow-wrap:anywhere}
.suggestion-invitation-dialog .icon-btn,.suggestion-invitation-dialog .btn,.suggestion-invitation-dialog .tab{min-width:var(--suggestion-touch);min-height:var(--suggestion-touch)}
@media(pointer:coarse){.suggestion-card .suggestion-connect,.suggestion-detail-dialog .btn,.suggestion-detail-dialog .icon-btn,.suggestion-detail-dialog .text-btn{min-width:var(--suggestion-touch);min-height:var(--suggestion-touch)}}
html:has(#main[data-peers-tab="suggestion"]){min-width:0;overflow-x:clip}
body:has(#main[data-peers-tab="suggestion"])>#app{width:min(var(--window-width),100%)}
body:has(#main[data-peers-tab="suggestion"]) .app-shell{width:100%}
@media(hover:hover) and (pointer:fine){.suggestion-card .suggestion-connect{opacity:0;pointer-events:none;transition:opacity var(--enter) ease-out,background var(--feedback) var(--ease)}.suggestion-card:hover .suggestion-connect,.suggestion-card:focus-within .suggestion-connect{opacity:1;pointer-events:auto}.suggestion-card .suggestion-connect:not(:disabled):hover{background:var(--tint);color:var(--primary-hover)}}
@media(max-width:1023px){#main[data-peers-tab="suggestion"]{padding:var(--suggestion-section-gap)}#main[data-peers-tab="suggestion"] .suggestions-grid{grid-template-columns:repeat(2,minmax(0,var(--peer-card-width)))}}
@media(max-width:767px){
  .editor-grid{grid-template-columns:minmax(0,1fr)}
  body:has(#main[data-peers-tab="suggestion"]) .app-shell{grid-template-columns:var(--suggestion-sidebar-width) minmax(0,1fr)}
  body:has(#main[data-peers-tab="suggestion"]) .sidebar{padding:var(--suggestion-narrow-pad) var(--space);align-items:stretch}
  body:has(#main[data-peers-tab="suggestion"]) .window-dots{padding:0 0 var(--space);gap:4px;justify-content:center}
  body:has(#main[data-peers-tab="suggestion"]) .brand{padding:0;justify-content:center;margin-bottom:var(--space)}
  body:has(#main[data-peers-tab="suggestion"]) .nav-item{min-height:var(--suggestion-touch);justify-content:center;padding:var(--space)}
  body:has(#main[data-peers-tab="suggestion"]) :is(.brand>span,.nav-item>span:not(.red-dot),.capture-status>.od-field,.account>.sidebar-account-name,.sidebar-update>span){position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  body:has(#main[data-peers-tab="suggestion"]) .nav-item .red-dot{margin-left:0}
  body:has(#main[data-peers-tab="suggestion"]) :is(.capture-status,.account,.sidebar-update){justify-content:center;min-height:var(--suggestion-touch);padding:var(--space)}
  body:has(#main[data-peers-tab="suggestion"]) .sidebar-popover{left:0;right:auto;max-width:calc(100vw - 32px)}
  #main[data-peers-tab="suggestion"]{padding:var(--suggestion-narrow-pad)}
  #main[data-peers-tab="suggestion"] .page-head{gap:var(--suggestion-narrow-pad);margin-bottom:var(--suggestion-section-gap)}
  #main[data-peers-tab="suggestion"] .page-head .btn{min-height:var(--suggestion-touch)}
  #main[data-peers-tab="suggestion"] .peers-tabs{--od-gap:var(--space)}
  #main[data-peers-tab="suggestion"] .peers-tab{font-size:var(--suggestion-meta)}
  #main[data-peers-tab="suggestion"] .suggestions-grid{grid-template-columns:minmax(0,min(100%,var(--peer-card-width)))}
  .suggestion-invitation-dialog .invite-email-row{flex-direction:column;align-items:stretch}
  .suggestion-invitation-dialog .invite-email-row input{width:100%;flex:auto;min-height:var(--suggestion-touch)}
  .suggestion-invitation-dialog .dialog-head{align-items:flex-start;gap:var(--space)}
  .suggestion-invitation-dialog .dialog-head>.od-field{flex:1;overflow-wrap:anywhere}
  .suggestion-invitation-dialog .dialog-head>.od-row{--od-gap:0px}
  .suggestion-invitation-dialog .invitation-foot{flex-wrap:wrap;gap:var(--suggestion-inline-pad)}
}
@media(max-width:374px){body:has(#main[data-peers-tab="suggestion"]) .app-shell{grid-template-columns:var(--suggestion-touch) minmax(0,1fr)}body:has(#main[data-peers-tab="suggestion"]) .sidebar{padding-inline:0}#main[data-peers-tab="suggestion"] .peers-tabs{--od-gap:4px}}