/* The empty workspace: one message from Collab (web/house-welcome.js). */
.app .workspace>#welcome.house-welcome-ready{align-self:stretch;width:100%;max-width:none;min-width:0;margin:0;padding:0;justify-content:flex-start;overflow-y:auto}
#welcome.house-welcome-ready #welcome-mark{display:none}
.welcome-home{width:min(100%,560px);margin:auto;padding:32px 24px}
.house-welcome{min-width:0;text-align:left}
.house-welcome-message{display:flex;gap:12px;align-items:flex-start}
.house-welcome-face{flex:none;line-height:0}
.house-welcome-body{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0}
.house-welcome-meta{display:flex;align-items:baseline;gap:6px;font-size:13px}
.house-welcome-meta b{font-weight:600;color:var(--conversation-agent,var(--ink))}
.house-welcome-tag{font:500 9px/1 var(--mono,'Martian Mono',ui-monospace,monospace);text-transform:uppercase;letter-spacing:.06em;color:var(--conversation-agent,#526915);border:1px solid currentColor;padding:2px 4px;border-radius:2px}
.house-welcome-text{display:flex;flex-direction:column;gap:6px;color:var(--ink);font-size:15px;line-height:1.45}
.house-welcome-actions{display:flex;flex-wrap:wrap;gap:8px}
.house-welcome-go,.house-welcome-join{padding:8px 14px;border-radius:2px;font-weight:600}
.house-welcome button:focus-visible{outline:2px solid #D7FF2E;outline-offset:2px}
@media (max-width:760px){
 .welcome-home{padding:56px 16px calc(16px + env(safe-area-inset-bottom))}
}
/* On a phone (the iOS app, a phone browser or a home-screen app) the welcome sits in the
   Threads screen, right under that screen's own New group button. */
.house-welcome-where-phone,:root[data-phone=true] .house-welcome-where-web,:root[data-phone=true] .house-welcome-go{display:none}
:root[data-phone=true] .house-welcome-where-phone{display:inline}
.welcome.phone-welcome{display:block;flex:none;min-height:0;padding:8px 16px 24px;text-align:left;color:var(--ink)}
/* Undo the older lone-mark .welcome paragraph and button styles inside the welcome. */
.welcome .house-welcome p{margin:0;font-size:inherit;line-height:inherit}
.welcome .house-welcome button{margin:0;min-width:0;display:inline-flex;align-items:center;justify-content:center}
.welcome .house-welcome :is(.house-welcome-go,.house-welcome-join){color:var(--ink);background:var(--tint);border:1px solid var(--line);font-size:13px}
.welcome .house-welcome :is(.house-welcome-go,.house-welcome-join):hover{border-color:var(--muted)}
.house-welcome-invites{display:flex;flex-direction:column;gap:6px;margin-top:10px;color:var(--ink);font-size:15px;line-height:1.45}
/* How Collab works: three short rows under the welcome (web/welcome-facts.js). */
.house-welcome-facts{display:flex;flex-direction:column;width:100%;max-width:600px;margin-top:4px;border-top:1px solid var(--line)}
.house-welcome-fact{display:grid;grid-template-columns:112px minmax(0,1fr);gap:4px 16px;padding:12px 0;border-bottom:1px solid var(--line)}
.house-welcome-fact-label{padding-top:3px;font:500 10px/1.5 var(--mono,'Martian Mono',ui-monospace,monospace);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.welcome .house-welcome .house-welcome-fact-text{font-size:14px;line-height:1.45;color:var(--ink)}
.house-welcome-fact-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.house-welcome-status{font:500 10px/1 var(--mono,'Martian Mono',ui-monospace,monospace);text-transform:uppercase;letter-spacing:.06em;padding:4px 6px;border-radius:2px;background:var(--tint);color:var(--muted)}
.house-welcome-status[data-state=ready]{color:var(--conversation-agent,#526915)}
.house-welcome-meter{flex:1 1 140px;max-width:220px;height:4px;border-radius:2px;background:var(--line);overflow:hidden}
.house-welcome-meter>i{display:block;height:100%;background:var(--conversation-agent,#526915)}
.welcome .house-welcome .house-welcome-fact-action{padding:5px 10px;border-radius:2px;border:1px solid var(--line);background:transparent;color:var(--ink);font-size:12px;font-weight:600}
.welcome .house-welcome .house-welcome-fact-action:hover{border-color:var(--muted)}
@media(max-width:560px){.house-welcome-fact{grid-template-columns:1fr}.house-welcome-meter{flex:1 1 100%;max-width:none}}

/* Today's draw, beside the meter. */
.house-welcome-meter-label{font-size:12px;color:var(--collab-muted,var(--muted));font-variant-numeric:tabular-nums;white-space:nowrap}
.house-welcome-draw{display:flex;align-items:center;gap:10px;flex:1 1 100%}

/* The welcome as a window over the workspace, like the agent panel (web/welcome-window.js). */
.workspace>.welcome-window{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);width:min(600px,calc(100% - 32px));max-height:calc(100% - 32px);display:flex;flex-direction:column;background:var(--agent-sheet-bg,var(--bg));border:1px solid var(--agent-mine,var(--line));border-radius:var(--control-radius,2px);box-shadow:0 18px 48px rgba(0,0,0,.18)}
/* Compact layout: above the open sidebar (and its backdrop), which holds Get started. */
.workspace>.welcome-window.over-sidebar{position:fixed;z-index:30;max-height:calc(100% - 48px)}
.welcome-window[hidden]{display:none}
.welcome-window-bar{position:relative;display:flex;align-items:center;gap:8px;padding:8px 8px 8px 16px;border-bottom:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink)}
.welcome-window-title{flex:1}
.welcome-window-close{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:var(--control-radius,2px);background:transparent;color:var(--collab-muted,var(--muted));font-size:20px;line-height:1;cursor:pointer}
.welcome-window-close:hover{background:var(--surface-hover);color:var(--ink)}
.welcome-window-body{min-height:0;overflow:auto;padding:20px 22px 22px}
/* On a phone, a sheet over Threads. */
.phone-root>.welcome-sheet{position:absolute;z-index:8;left:0;right:0;bottom:0;max-height:82%;display:flex;flex-direction:column;background:var(--bg);border-radius:12px 12px 0 0;box-shadow:0 -12px 40px rgba(0,0,0,.18);padding-bottom:env(safe-area-inset-bottom)}
.welcome-sheet .welcome-window-bar{padding-top:16px}
.welcome-sheet-grabber{position:absolute;left:50%;top:6px;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--line)}
.welcome-sheet .welcome-window-close{width:44px;height:44px}
/* Folded on a phone: the Get started card floats at the bottom of Threads, in its own design. */
.phone-gs{position:absolute;z-index:7;left:12px;right:12px;bottom:calc(22px + env(safe-area-inset-bottom));max-height:38%;overflow:auto}
.phone-gs[hidden]{display:none}
.phone-gs>.onboarding-card{--onboarding-bg:#f0f0f0;background:var(--onboarding-bg);border:0;margin:0;padding:12px;border-radius:2px}
:root[data-theme=dark] .phone-gs>.onboarding-card{--onboarding-bg:#242424}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .phone-gs>.onboarding-card{--onboarding-bg:#242424}}
/* The row on the card that reopens the welcome. */
.gs-open{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;margin:0 0 10px;padding:8px 10px;border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);border-radius:var(--control-radius,2px);background:color-mix(in srgb,var(--ink) 4%,var(--onboarding-bg,transparent));color:var(--ink);font:600 13px/1.2 inherit;cursor:pointer}
.gs-open:hover{background:color-mix(in srgb,var(--ink) 10%,var(--onboarding-bg,transparent))}
.onboarding-card>.gs-open:only-child{margin:0}
/* Folding lands with a short lime pulse on the card. */
@keyframes gs-pulse{0%{box-shadow:0 0 0 0 rgba(215,255,46,.9)}100%{box-shadow:0 0 0 14px rgba(215,255,46,0)}}
.onboarding-card.just-minimized{animation:gs-pulse 1.1s ease-out}
@media(prefers-reduced-motion:reduce){.onboarding-card.just-minimized{animation:none}}