/* Reading scale shared by the landing page and its guided product demos. */
:root{--muted:#505b4e;--reading-small:14px;--reading-body:18px}
body{font-size:18px}
.wrap{width:min(1240px,calc(100% - 72px))}
.navlinks{font-size:15px}
.btn,.setup-card .btn{font-size:16px;min-height:48px}
.motion-control{font-size:14px}
.intro,.section-label{font-size:14px}
.lead{font-size:22px;line-height:1.55}
.under-action{font-size:15px;color:var(--muted);max-width:660px;margin:16px auto 0}
.demo-tabs button{font-size:16px;padding:12px 20px;gap:9px}
.demo-tabs svg{width:18px;height:18px}
.structure{gap:48px}
.structure-copy>p,.section-heading p,.feature-copy p,.access-copy p,.setup-section p,.faq p,.closing p{font-size:18px;line-height:1.65}
.structure-copy>p{max-width:500px}
.section-heading p{max-width:430px}
.feature-copy h3,.access-copy h3{font-size:28px;line-height:1.2}
.feature-copy p,.access-copy p{max-width:48ch}
.concept-trio b{font-size:16px;line-height:1.4}
.concept-trio span{font-size:14px;color:var(--muted)}
.access-footnote,.setup-section small,.setup-card small,.preview-caption,footer,footer>span{font-size:14px;color:var(--muted);line-height:1.6}
.setup-head b{font-size:22px;line-height:1.3}
.setup-head span,.connection-list>span{font-size:15px;color:var(--muted)}
.setup-card>p{font-size:17px}
.prompt{font-size:16px;line-height:1.75;color:#46593d}
.faq summary{font-size:18px;line-height:1.5}
.mini-doc-top,.mini-col,.comment-card,.comment-card p,.doc-inline-comment{font-size:14px;color:var(--muted)}
.mini-doc>p,.mini-ticket{font-size:15px}
.mini-ticket>div{font-size:13px;flex-wrap:wrap}
.mini-board{gap:12px;padding:18px 16px 26px;margin:0 20px}
.mini-ticket{padding:12px;min-height:160px}
.mini-ticket .agent-label,.activity{font-size:12px}
.access-ui-head{font-size:16px;flex-wrap:wrap}
.access-ui-head>span,.access-row small{font-size:13px;color:var(--muted)}
.access-row strong{font-size:15px}
.status-chip{font-size:12px;color:#41602e}
.status-chip.neutral{color:#59624f}
.access-row>div{min-width:0}

/* Give the story the strongest hierarchy; the application chrome stays quiet. */
.demo-guide{min-height:100px;padding:18px 22px;gap:20px}
.guide-story strong{font-size:18px;line-height:1.35}
.guide-story span:not(.demo-live-dot){font-size:15px;line-height:1.5;color:#4f6047;max-width:580px}
.demo-transport>span{font-size:14px;color:var(--muted)}
.demo-transport button{width:40px;height:40px;font-size:21px}
.windowbar{font-size:13px;height:48px;color:var(--muted)}
.collaborators>span{font-size:12px}
.sidebar{width:174px;padding:18px 10px;font-size:13px}
.sidebrand{font-size:13px;gap:6px}
.sidebrand img{width:22px;height:22px}
.search{font-size:12px}
.search kbd{display:none}
.side-label{font-size:12px;color:var(--muted)}
.sidelink{gap:7px;padding:9px 7px;color:#53604d}
.side-bottom small{font-size:12px;color:var(--muted)}
.shellbody{min-height:650px}
.doc-and-chat{height:650px;grid-template-columns:minmax(0,1fr) minmax(340px,.85fr)}
.doc-content{padding:26px 30px}
.doc-content h2{font-size:30px;line-height:1.15}
.doc-content h3{font-size:18px;line-height:1.35;margin:24px 0 12px}
.doccrumb{height:auto;min-height:48px;padding:12px 20px;font-size:13px;line-height:1.45;color:#586650;flex-wrap:wrap}
.doc-meta{font-size:12px;color:var(--muted);gap:8px;flex-wrap:wrap;line-height:1.5}
.doc-meta .avatar{width:23px;height:23px}
.doc-callout,.doc-copy{font-size:16px;line-height:1.65}
.doc-copy{min-height:72px;color:#414d3c}
.checkline{font-size:15px;line-height:1.6;gap:9px}
.checkbox{width:15px;height:15px;font-size:11px;margin-top:4px}
.edit-hint{font-size:13px;line-height:1.5;color:#596650;margin-top:18px}
.editor-presence{font-size:12px;bottom:-17px}
.editor-presence .avatar{width:18px;height:18px}
.typing-caret,.is-editing .doc-copy:after{height:17px}
#slash-input,.slash-menu{font-size:15px}
.slash-menu{width:min(290px,100%)}
.slash-menu>small,.slash-menu>div>small{font-size:12px;color:#596650}
.notion-block{margin-top:22px}
.chat-head{font-size:16px;min-height:49px}
.chat-sub,.dayline{font-size:13px;line-height:1.5;color:#596650}
.chat-sub{padding:12px 18px 8px}
.chat-scroll{padding:0 18px}
.chat-message{gap:11px;margin-bottom:24px}
.chat-message .avatar{width:32px;height:32px}
.msg-name{font-size:15px;flex-wrap:wrap;gap:5px}
.msg-name small{font-size:12px;color:#596650}
.agent-label{font-size:12px;color:#4f683e}
.chat-message p{font-size:16px;line-height:1.65;color:#414d3c}
.chat-welcome{font-size:16px;color:#4f6047}
.chat-welcome p,.thinking span{font-size:14px;color:#596650}
.task-attachment strong{font-size:14px;line-height:1.5}
.task-attachment small{font-size:13px;color:#596650}
.demo-composer{min-height:108px;padding:13px 14px}
.demo-composer>span{font-size:15px;color:#596650}
.composer-tools{font-size:16px}
.mention-menu>small,.mention-menu small{font-size:12px;color:#596650}
.mention-menu b{font-size:15px}

/* Tickets remain readable instead of shrinking to fit a miniature board. */
.sprint-heading p,.member-head p{font-size:16px}
.badge,.board-toolbar{font-size:13px}
.column-title{font-size:15px;color:#4f6047;line-height:1.4}
.column-title small{font-size:13px}
.ticket h4,.static-ticket h4{font-size:16px;line-height:1.4}
.ticket-label{font-size:12px;color:#536449}
.ticket p,.ticket-person{font-size:14px}
.ticket-person>span:last-child{font-size:12px;color:#596650}
.ticket-person .avatar{width:28px;height:28px}
.ticket-footer{font-size:13px;color:#596650;overflow-wrap:anywhere}
.drop-hint{font-size:15px;color:#596650}
.drop-hint span{font-size:13px}
.ghost-ticket b{font-size:16px}
.ghost-ticket small{font-size:13px;color:#596650}
.agent-work-feed b{font-size:15px}
.agent-work-feed #board-status{font-size:15px;color:#4f6047;line-height:1.5}
.agent-work-feed>#board-time{font-size:13px;color:#4f6047}
.agent-work-feed>div{min-width:0}
.board-note{font-size:13px;line-height:1.5;color:#596650}

/* Connection and organization labels carry information, not decoration. */
.setup-step{font-size:12px;color:#596650;letter-spacing:.04em}
.connection-card,.manager-card{min-height:310px}
.pair-node>small,.pair-log{font-size:13px;color:#596650}
.connect-action{font-size:16px;min-height:46px}
.connection-card>p{font-size:14px;color:var(--muted)}
.manager-card h3{font-size:19px;line-height:1.35}
.manager-select{font-size:15px;min-height:64px}
.manager-select b,.manager-option b{font-size:15px}
.manager-select small,.manager-option small,.manager-picker>small{font-size:13px;color:#596650}
.manager-picker{top:180px}
.assigned-line{font-size:14px;color:#4f6047;flex-wrap:wrap}
.onboarding-context{grid-template-columns:repeat(3,minmax(0,1fr))}
.onboarding-context b{font-size:14px;line-height:1.4}
.onboarding-context small{font-size:13px;color:#596650}
.member-note{font-size:14px;line-height:1.55;color:#596650}
.org-topline,.org-bottom{font-size:14px;color:#4f6047}
.org-topline{flex-wrap:wrap}
.signal,.diagram-caption{font-size:12px;color:#596650}
.org-map{height:306px}
.org-map .org-node{height:70px;padding:10px;gap:8px;min-width:0;width:45%}
.org-node strong{font-size:15px}
.org-node small{font-size:13px;line-height:1.4;color:#596650}
.org-node .avatar{width:28px;height:28px}
.org-map .org-node.owner{top:20px;width:66%}
.org-node.owner>span{font-size:12px;color:#596650}
.org-map .org-node.lead{top:118px}
.org-map .org-node.report{top:216px}
.org-node.report>.agent-label{display:none}

@media(max-width:1100px){
  .sidebar{display:none}
  .structure{grid-template-columns:1fr;gap:32px}
  .structure-copy>p{max-width:65ch}
  .org-demo{width:100%;max-width:650px;justify-self:center}
  .section-heading{display:block}
  .section-heading p{margin-top:20px;max-width:60ch}
  .access-panel{gap:26px}
}
@media(max-width:800px){
  .wrap{width:calc(100% - 36px)}
  .lead{font-size:20px;max-width:440px}
  .intro{font-size:12px}
  .under-action{font-size:15px;max-width:34ch}
  .hero-text .btn,.setup-card .btn,.closing .btn{font-size:16px;padding:12px 16px;min-height:48px}
  .demo-tabs{gap:3px}
  .demo-tabs button{font-size:14px;padding:11px 7px;line-height:1.35;gap:6px}
  .demo-tabs svg{flex-shrink:0;width:16px;height:16px}
  .demo-guide{padding:16px;flex-wrap:wrap;gap:12px}
  .guide-story strong{font-size:18px}
  .guide-story span:not(.demo-live-dot){font-size:15px;max-width:none}
  .demo-transport{margin-left:auto}
  .demo-transport>span{display:block;font-size:13px}
  .demo-transport button{width:40px;height:40px}
  .windowbar>span{font-size:13px}
  .shellbody{min-height:650px}
  #workspace .doc-and-chat,#workspace .document,#workspace .chat{min-height:650px}
  .doc-and-chat{grid-template-columns:1fr;height:auto}
  .doc-content{padding:24px}
  .doc-meta>span:last-child{margin-left:0}
  .doc-callout,.doc-copy,.chat-message p{font-size:16px}
  .chat{max-height:none}
  .chat-scroll{min-height:300px}
  .doc-content h3{font-size:18px}
  .preview-caption{font-size:14px;max-width:36ch}
  .concept-trio{gap:14px}
  .concept-trio b{font-size:15px}
  .concept-trio span{font-size:14px}
  .feature-copy{padding:24px}
  .access-panel{padding:24px 18px}
  .access-ui-head{font-size:15px}
  .access-ui-head span{font-size:13px}
  .access-row{flex-wrap:wrap}
  .access-row>div{flex:1;min-width:150px}
  .access-row .status-chip{margin-left:40px}
  .access-row strong{font-size:15px}
  .access-row small{font-size:13px}
  .status-chip{font-size:12px}
  .mini-board{grid-template-columns:1fr;margin:0 18px;padding:16px;gap:16px}
  .mini-ticket{min-height:0;font-size:15px}
  .mini-ticket>div{margin-top:10px}
  .mini-col{margin-bottom:6px;font-size:14px}
  .mini-ticket .agent-label{display:inline-block;font-size:12px}
  .activity{font-size:12px}
  .org-node.owner>span:not(.avatar){display:none}
  .org-map .org-node{height:80px;gap:6px;padding:8px;width:46%}
  .org-node small{font-size:12px}
  .org-node strong{font-size:14px}
  .org-node .avatar{width:25px;height:25px}
  .org-map{height:316px}
  .diagram-caption{font-size:12px}
  .demo-board{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0 12px}
  .demo-board .column:nth-child(3){grid-column:1/-1}
  .demo-board .column:nth-child(3) .drop-zone{min-height:0}
  .column{padding:8px}
  .column-title{font-size:14px;gap:5px}
  .column-title small{font-size:12px}
  .ticket{padding:10px}
  .ticket h4,.static-ticket h4{font-size:15px}
  .ticket-label{font-size:12px}
  .ticket-person{font-size:13px}
  .ticket-footer{font-size:12px}
  .drop-zone{min-height:300px}
  .drop-hint{font-size:14px;padding:32px 5px}
  .drop-hint span{font-size:13px}
  #drag-preview{left:22px;top:50px;width:calc((100% - 68px)/2)}
  .ghost-ticket b{font-size:15px}
  .ghost-ticket small{font-size:12px}
  .agent-work-feed{flex-wrap:wrap}
  .agent-work-feed>div{flex:1}
  .agent-work-feed>#board-time{font-size:12px}
  .sprint-heading p{font-size:15px}
  .board-toolbar{font-size:13px}
  .board-note{font-size:13px}
  .member-head{flex-wrap:wrap}
  .member-head>.badge{font-size:12px;max-width:120px}
  .onboarding-grid{min-height:310px}
  .connection-card,.manager-card{min-height:300px;padding:18px}
  .manager-picker{top:150px;left:18px;right:18px}
  .onboarding-context{grid-template-columns:1fr}
  .onboarding-context b{font-size:14px}
  .onboarding-context small{font-size:13px}
  .member-note{font-size:14px}
  .faq summary{font-size:18px}
  .faq p{font-size:18px}
  footer>span{font-size:14px}
}


/* Pointer, press and keyboard feedback for every functional control. */
:where(a[href],button:enabled,summary){
  -webkit-tap-highlight-color:#365c4326;
  transition:background-color .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease,filter .16s ease;
}
a[href]:not(.btn):not(.brand){text-underline-offset:5px;text-decoration-thickness:1.5px}
.motion-control,summary{border-radius:6px}
@media(hover:hover){
  a[href]:hover,button:enabled:hover,summary:hover{filter:brightness(.94)}
  a[href]:not(.btn):not(.brand):hover{text-decoration:underline;color:#284c34}
  .brand:hover{transform:translateY(-1px);color:#365c43}
  .btn:hover{box-shadow:0 5px 14px #365c4326}
  .demo-tabs button:hover,summary:hover{background:#e8efdf;color:#284c34}
  .demo-tabs button:hover{border-color:#becfb0;transform:translateY(-1px)}
  .demo-transport button:hover{background:#edf4e6;border-color:#8eac79;box-shadow:0 3px 10px #365c431a;transform:translateY(-1px)}
}
a[href]:active,button:enabled:active,summary:active{filter:brightness(.86);transform:translateY(1px) scale(.98)}
a.btn:active,button.btn:active,.demo-tabs button:active,.demo-transport button:active{box-shadow:inset 0 2px 5px #17372030;transform:translateY(1px) scale(.98)}
:is(a[href],button,summary):focus-visible{outline:3px solid #678d62;outline-offset:4px}
.demo-tabs button[aria-selected="true"]{border-color:#9bb68a;box-shadow:0 2px 8px #365c431a;font-weight:600}
.faq details[open]>summary{color:#365c43;background:#f0f5eb}
button:disabled{filter:none;transform:none}

/* A soft transparency sweep across the whole card signals active work. */
#moving-ticket.is-working{
  -webkit-mask-image:linear-gradient(110deg,#000 40%,#0007 50%,#000 60%);
  mask-image:linear-gradient(110deg,#000 40%,#0007 50%,#000 60%);
  -webkit-mask-size:300% 100%;mask-size:300% 100%;
  -webkit-mask-position:100% 0;mask-position:100% 0;
  animation:agent-working-shimmer 2.6s ease-in-out infinite;
}
@keyframes agent-working-shimmer{
  0%,15%{-webkit-mask-position:100% 0;mask-position:100% 0}
  85%,100%{-webkit-mask-position:0% 0;mask-position:0% 0}
}
@media(prefers-reduced-motion:reduce){
  :where(a[href],button,summary){transition:none}
  #moving-ticket.is-working{animation:none!important;-webkit-mask-image:none;mask-image:none}
}

/* The product scene is a presentation; controls live outside this shell. */
.workspace-shell{pointer-events:none;user-select:none;-webkit-user-select:none}
.workspace-shell :is(.doc-copy,.demo-ticket,.connect-action,.manager-select){cursor:default}