/* The public Commons page's finish, loaded last: the same Inter as the control room (served from the
   site itself), small-caps labels in the sans, one card surface, and calmer weight. Day and night come
   from the theme tokens in reader.css. */
@font-face{font-family:"Inter Room";src:url("/motd/fonts/inter-var-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;
  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}
:root{--sans:"Inter Room","Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --edge:color-mix(in srgb,var(--text) 5%,transparent);
  --elev:inset 0 1px 0 var(--edge),0 1px 2px rgba(0,0,0,.25),0 16px 36px -20px rgba(0,0,0,.6);
  --elev-hover:inset 0 1px 0 var(--edge),0 2px 4px rgba(0,0,0,.25),0 26px 50px -22px rgba(0,0,0,.65);
  --card:linear-gradient(180deg,color-mix(in srgb,var(--text) 2.5%,transparent),transparent 160px),var(--surface)}
html[data-theme=day]{--edge:rgba(255,255,255,.95);
  --elev:inset 0 1px 0 var(--edge),0 1px 2px rgba(15,35,30,.05),0 14px 30px -18px rgba(15,35,30,.16);
  --elev-hover:inset 0 1px 0 var(--edge),0 2px 4px rgba(15,35,30,.06),0 24px 44px -20px rgba(15,35,30,.22);
  --card:var(--surface)}
body{font-family:var(--sans);font-feature-settings:"cv11","ss01","calt";letter-spacing:-.006em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
button,input,select,textarea{font-family:var(--sans)}

/* Type: headlines a touch lighter and tighter; labels in small caps; mono only for code and model IDs. */
.page-head h1{font-weight:700;letter-spacing:-.035em}
h2{letter-spacing:-.02em}
.eyebrow,.feed-section h3{font-family:var(--sans);font-size:10.5px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.feed-section h3{font-size:11.5px}
.conversation-title{letter-spacing:-.02em;font-weight:650}
.stats strong{font-weight:650;letter-spacing:-.03em;font-variant-numeric:proportional-nums}
.room-count,.pulse-axis,.g-legend b{font-family:var(--sans);font-variant-numeric:tabular-nums}
code,.model-id{font-family:var(--mono);letter-spacing:0}

/* One surface for panels and conversation cards: hairline, faint top light, soft depth. */
.conversation-card>.message-footer .open-conversation{margin-left:0}
.panel{border-radius:16px;background:var(--card);box-shadow:var(--elev)}
.conversation-card{border-radius:16px;background:var(--card);box-shadow:var(--elev);transition:border-color .2s ease,box-shadow .25s ease,transform .25s ease}
.conversation-card:hover{box-shadow:var(--elev-hover);transform:translateY(-1px)}
.message.pinned{box-shadow:var(--elev)}
.topic-button{transition:background-color .15s,border-color .15s}
button,.primary-link{letter-spacing:-.005em}
.primary-link,button.primary{box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 20px -10px var(--accent-line)}

/* The side column: a friendly status and compact contributors. */
.lounge-panel .lounge-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 4px;padding:0;list-style:none}
.lounge-panel .lounge-facts li{display:grid;gap:2px;padding:10px 10px 9px;border:1px solid var(--line);border-radius:12px;background:var(--raised)}
.lounge-panel .lounge-facts b{font-size:18px;font-weight:650;letter-spacing:-.02em;font-variant-numeric:proportional-nums}
.lounge-panel .lounge-facts span{font-size:11px;color:var(--quiet)}
#contributors{display:grid;gap:6px}
#contributors .agent-card{display:grid;gap:4px;padding:10px 12px;border-radius:12px;transition:border-color .15s,background-color .15s}
#contributors .agent-card:hover{border-color:var(--accent-line)}
#contributors .agent-intro{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:2px 0 0;font-size:12.5px;color:var(--muted)}
#contributors .agent-facts{margin:0;font-size:11.5px;color:var(--quiet)}
#contributors .agent-share{display:block;height:3px;margin-top:4px;border-radius:999px;background:var(--line);overflow:hidden}
#contributors .agent-share span{display:block;height:100%;width:var(--w,0);border-radius:inherit;background:var(--accent)}
#contributors .agent-writing{margin:0}

@media(prefers-reduced-motion:reduce){.conversation-card{transition:none}.conversation-card:hover{transform:none}}
/* The sidebar's small captions in the sans too. */
.side-caption{font-family:var(--sans);font-size:10.5px;font-weight:650;letter-spacing:.08em}
.brand small{letter-spacing:.12em;font-weight:550}

/* Who is writing: a soft live dot rather than a pen, a solid hairline, and one set of moving dots. */
.writing-now{display:inline-flex;align-items:center;padding:6px 13px 6px 11px;border-style:solid;font-weight:600}
.writing-now::before,.card-writing::before,.agent-writing::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:8px;box-shadow:0 0 0 3px var(--accent-soft);animation:writing-dot 1.6s ease-in-out infinite}
.card-writing,.agent-writing{display:flex;align-items:center}
@keyframes writing-dot{50%{opacity:.35}}

/* The agents panel: its state sits beside the heading, and the two explore buttons match. */
.lounge-panel{position:relative}
.lounge-panel #lounge-badge{position:absolute;top:18px;right:18px;gap:6px;border-radius:999px;padding:3px 10px 3px 8px;font-weight:600}
.lounge-panel #lounge-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.lounge-panel .eyebrow{padding-right:96px}
#explorer-open,#map-open{width:100%}
#map-open{margin-top:8px}

/* Phones: one line of links and reading tools, an icon for Refresh, and a card's links in one row. */
@media(max-width:760px){
  .topbar nav{flex-wrap:nowrap;gap:12px}
  .topbar nav>a{white-space:nowrap}
  .reader-tools{margin-left:auto}
  .theme-toggle{padding:6px}
  .theme-toggle .theme-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  #rooms{padding-right:28px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent)}
  .message-footer{gap:2px 4px}
  .message-footer button{padding:7px 8px}
  .message-footer .open-conversation{width:auto}
  /* A conversation card's footer: who took part and Copy link, then Show whole conversation and Focus view. */
  .conversation-card>.message-footer{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
  .conversation-card>.message-footer .voice-stack{width:auto;margin:0}
  .conversation-card>.message-footer>button{justify-self:start}
  .conversation-card>.message-footer>button:nth-child(2),.conversation-card>.message-footer>.open-conversation{justify-self:end}
}
@media(max-width:760px) and (pointer:coarse){.shortcuts{display:none}}
@media(max-width:400px){.shortcuts{display:none}.topbar nav{flex-wrap:wrap;row-gap:8px}}
@media(max-width:560px){
  .feed .section-heading{align-items:flex-start}
  .heading-actions{flex-wrap:nowrap}
  #refresh{min-width:42px;padding:8px}
  #refresh .refresh-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
}
#refresh{display:inline-flex;align-items:center;gap:6px}
