/* Agents: running Claude, questions, the live transcript and the plan meter. Uses the Apple tokens. */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.a-group{background:var(--a-card);border-radius:18px;padding:16px 18px;box-shadow:var(--a-shadow);margin-bottom:16px}
.a-group-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.a-group-head h2{margin:0;font-size:17px;font-weight:650;letter-spacing:-.02em}
.a-group-head small{color:var(--a-label2);font-size:13px;font-variant-numeric:tabular-nums}

/* Summary strip */
.a-strip{display:grid;gap:14px;margin-bottom:18px}
.a-running{background:var(--a-card);border-radius:18px;padding:14px 16px;box-shadow:var(--a-shadow)}
.a-pills{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.a-pill{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:11px 13px;border-radius:14px;border:1px solid var(--a-sep);background:var(--a-card2);color:var(--a-label);text-align:left;cursor:pointer;font:inherit}
.a-pill>.a-sparkle{grid-row:1/3}
.a-pill span:not(.a-run-state):not(.a-sparkle){display:grid;min-width:0}.a-pill strong{font-size:14px}.a-pill small{color:var(--a-label2);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.a-pill em{grid-column:3;font-style:normal;font-size:12px;color:var(--a-label2);text-align:right;font-variant-numeric:tabular-nums}
.a-pill.waiting{border-color:color-mix(in srgb,var(--orange) 45%,transparent)}

/* State pill */
.a-run-state{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:980px;font-size:12px;font-weight:600;white-space:nowrap;background:var(--a-fill);color:var(--a-label2)}
.a-run-state i{width:7px;height:7px;border-radius:50%;background:currentColor}
.a-run-state.good{background:color-mix(in srgb,var(--green) 15%,transparent);color:var(--green)}
.a-run-state.warn{background:color-mix(in srgb,var(--orange) 16%,transparent);color:var(--orange)}
.a-run-state.failed{background:color-mix(in srgb,var(--red) 14%,transparent);color:var(--red)}
.a-run-state.running i,.a-run-state.starting i{animation:a-pulse 1.4s ease-in-out infinite}
@keyframes a-pulse{50%{opacity:.3}}

/* Questions */
.a-needs{display:grid;gap:12px}
.a-question{background:var(--a-card);border-radius:18px;padding:16px 18px;box-shadow:var(--a-shadow);border:1px solid color-mix(in srgb,var(--blue) 30%,transparent);background-image:linear-gradient(160deg,color-mix(in srgb,var(--blue) 8%,transparent),transparent 60%)}
.a-question-head{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--a-label2)}.a-question-head small{margin-left:auto}
.a-question p{margin:10px 0 12px;font-size:16px;font-weight:600;line-height:1.4;color:var(--a-label)}
.a-options{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.a-options:empty{display:none}
.a-option{border:0;border-radius:980px;padding:9px 16px;background:var(--blue);color:#fff;font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.a-option+.a-option{background:var(--a-fill);color:var(--a-label)}
.a-answer-row,.a-start-row{display:flex;gap:8px;align-items:center}
.a-answer-row input,.a-start-row input,.a-composer textarea{flex:1;min-width:0;border:1px solid var(--a-sep);border-radius:12px;padding:10px 12px;background:var(--a-card2);color:var(--a-label);font:inherit;font-size:15px}
.a-answer-row input:focus,.a-start-row input:focus,.a-composer textarea:focus{outline:2px solid var(--blue);outline-offset:-1px}
.a-send{flex:none;width:36px;height:36px;border-radius:50%;border:0;background:var(--blue);color:#fff;display:grid;place-items:center;cursor:pointer}.a-send:disabled{opacity:.5}
.a-link{border:0;background:none;padding:0;color:var(--blue);font:inherit;cursor:pointer}

/* Agents page */
.a-agents-top{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px}
.a-agents-top>.a-group{margin-bottom:16px}
.a-start-row #agent-key{flex:0 0 110px;text-transform:uppercase}
.a-start .c-primary .icon{width:16px;height:16px}
.a-form-error{margin:8px 0 0;color:var(--red);font-size:13px;min-height:1em}
.a-usage-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.a-usage{display:flex;align-items:center;gap:10px}.a-usage svg{width:56px;height:56px;flex:none}
.a-usage .track{fill:none;stroke:var(--a-fill);stroke-width:6}.a-usage .fill{fill:none;stroke-width:6;stroke-linecap:round;stroke:var(--green)}
.a-usage .fill.soon{stroke:var(--orange)}.a-usage .fill.warn{stroke:var(--red)}
.a-usage text{font-size:13px;font-weight:650;fill:var(--a-label);font-variant-numeric:tabular-nums}
.a-usage strong{display:block;font-size:14px}.a-usage small{color:var(--a-label2);font-size:12.5px}
.a-plan-note{margin:12px 0 0;color:var(--a-label2);font-size:13px;line-height:1.45}
.a-list{list-style:none;margin:0 -8px;padding:0}
.a-list li+li{border-top:1px solid var(--a-sep)}
.a-list button{display:flex;align-items:center;gap:12px;width:100%;padding:11px 8px;border:0;background:none;color:var(--a-label);font:inherit;text-align:left;cursor:pointer;border-radius:10px}
.a-list button:hover{background:var(--a-fill2)}
.a-list-key{flex:none;font-size:12.5px;font-weight:650;color:var(--indigo);min-width:62px;font-variant-numeric:tabular-nums}
.a-list-main{flex:1;min-width:0;display:grid}.a-list-main strong{font-size:14.5px;font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.a-list-main small{color:var(--a-label2);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.a-list-mr{display:inline-flex;align-items:center;gap:3px;font-size:12px;color:var(--a-label2)}.a-list-mr .icon{width:14px;height:14px}
.a-list .icon:last-child{color:var(--a-label3);width:14px}
.a-empty-line{margin:4px 0;color:var(--a-label2);font-size:14px}

/* Work on this */
.a-agent-actions{margin-top:8px}
.a-agent-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--a-sep);border-radius:980px;padding:5px 12px 5px 8px;background:var(--a-card);color:var(--a-label);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.a-agent-chip:hover{border-color:var(--blue)}.a-agent-chip.waiting{border-color:var(--orange);color:var(--orange)}
.a-agent-chip .a-sparkle .icon,.a-pill .a-sparkle .icon,.a-question-head .a-sparkle .icon{width:15px;height:15px}

/* Run view */
.a-back{display:inline-flex;align-items:center;gap:2px;border:0;background:none;color:var(--blue);font:inherit;font-size:15px;padding:0;margin-bottom:10px;cursor:pointer}.a-back .icon{transform:rotate(180deg);width:16px}
.a-run-head{display:grid;gap:8px;margin-bottom:16px}
.a-key{justify-self:start;padding:3px 10px;border-radius:8px;background:color-mix(in srgb,var(--indigo) 16%,transparent);color:var(--indigo);font-weight:700;font-size:13px}
.a-run-head h2{margin:0;font-size:26px;letter-spacing:-.025em;line-height:1.2;text-wrap:balance}
.a-run-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.a-working{display:inline-flex;align-items:center;gap:6px;color:var(--a-label2);font-size:13px}
.a-stop{margin-left:auto}.a-stop .icon{width:14px;height:14px}
.a-run-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:16px;align-items:start}
.a-run-side{position:sticky;top:calc(env(safe-area-inset-top,0px) + 70px)}
.a-transcript{background:var(--a-card);border-radius:18px;padding:8px 16px;box-shadow:var(--a-shadow)}
.a-transcript ol{list-style:none;margin:0;padding:0;display:grid}
.a-transcript li{padding:9px 0}.a-transcript li+li{border-top:1px solid var(--a-sep)}
.t-note{color:var(--a-label2);font-size:12.5px;text-align:center}
.t-claude{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.5}.t-claude>div{min-width:0;overflow-wrap:anywhere}
.t-claude small{display:block;color:var(--a-label2);font-size:12px}
.t-claude code,.a-outcome-text code{font:12.5px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--a-fill);padding:1px 5px;border-radius:5px}
.t-you{display:flex;justify-content:flex-end}.t-you div{max-width:80%;background:var(--blue);color:#fff;padding:9px 13px;border-radius:16px 16px 4px 16px;font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.t-you a{color:#fff}
.t-tool{font-size:13.5px;color:var(--a-label2)}
.t-tool .t-line,.t-tool summary{display:flex;align-items:center;gap:9px;cursor:default;list-style:none}.t-tool summary{cursor:pointer}.t-tool summary::-webkit-details-marker{display:none}
.t-tool span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.t-tool i{flex:none;display:grid;place-items:center}.t-tool i .icon{width:15px;height:15px}
.t-tool.ok i{color:var(--green)}.t-tool.error i{color:var(--red)}.t-tool.pending span{color:var(--a-label)}
.t-tool pre{margin:8px 0 2px 27px;padding:10px 12px;border-radius:10px;background:var(--a-card2);font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--a-label);max-height:280px;overflow:auto}
.t-tool pre.err{color:var(--red)}
.t-q .a-question{box-shadow:none}
.a-composer{position:sticky;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);display:flex;gap:8px;align-items:flex-end;margin-top:12px;padding:8px;border-radius:22px;background:var(--a-material);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);border:1px solid var(--a-sep);box-shadow:0 6px 24px rgba(0,0,0,.08)}
.a-composer textarea{resize:none;border-radius:16px;max-height:240px;line-height:1.4}
.a-outcome{background:var(--a-card);border-radius:18px;padding:16px 18px;margin-bottom:14px;box-shadow:var(--a-shadow);border-left:0;background-image:linear-gradient(160deg,color-mix(in srgb,var(--green) 10%,transparent),transparent 55%)}
.a-outcome.failed{background-image:linear-gradient(160deg,color-mix(in srgb,var(--red) 10%,transparent),transparent 55%)}
.a-outcome.cancelled{background-image:none}
.a-outcome-text{font-size:15px;line-height:1.55}
.a-mrs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.a-mrs a{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:980px;background:var(--a-fill);color:var(--a-label);text-decoration:none;font-size:13px;font-weight:600}.a-mrs .icon{width:15px;height:15px}
.a-error{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:var(--a-card2);font:12px/1.5 ui-monospace,Menlo,monospace;white-space:pre-wrap;overflow:auto;max-height:220px}
.a-plan-list ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.a-plan-list li{display:flex;gap:9px;align-items:flex-start;font-size:14px;line-height:1.35}
.a-plan-list li i{flex:none;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--a-label3);display:grid;place-items:center;margin-top:1px}
.a-plan-list li.completed i{background:var(--green);border-color:var(--green);color:#fff}.a-plan-list li.completed{color:var(--a-label2)}
.a-plan-list li.in_progress i{border-color:var(--blue);box-shadow:inset 0 0 0 3px var(--a-card),inset 0 0 0 9px var(--blue)}
.a-plan-list li i .icon{width:12px;height:12px}
.a-facts dl{margin:0;display:grid;gap:10px}.a-facts dt{font-size:12px;color:var(--a-label2)}.a-facts dd{margin:2px 0 0;font-size:14px;overflow-wrap:anywhere}.a-facts a{color:var(--blue);text-decoration:none}

@media (max-width:900px){
 .a-agents-top,.a-run-grid{grid-template-columns:1fr}
 .a-run-side{position:static}
 .a-usage-row{grid-template-columns:1fr}
 .a-start-row{flex-wrap:wrap}.a-start-row #agent-key{flex:1 1 100px}.a-start-row #agent-note{flex:1 1 100%;order:3}
 .a-composer{bottom:calc(env(safe-area-inset-bottom,0px) + 84px)}
 .a-run-head h2{font-size:22px}
}
@media (prefers-reduced-motion:reduce){.a-run-state i{animation:none}}
.t-tool details summary{color:var(--a-label2);font:inherit;font-size:13.5px;padding:0}
.t-tool.pending details summary span{color:var(--a-label)}
.a-question-head>span{display:block}.a-question-head .a-link{display:inline;font-size:inherit}
@media (max-width:900px){
 body.apple .a-tabbar{grid-template-columns:repeat(5,1fr)}
 .a-tabbar button{position:relative}.a-tabbar .a-count{position:absolute;top:0;left:calc(50% + 6px);min-width:18px;height:18px;font-size:11px}
}

/* Liquid Glass sidebar (design direction A + B): a floating translucent panel inset from the window edge. */
@media (min-width:901px){
 body.apple{background:radial-gradient(900px 700px at 0% 0%,color-mix(in srgb,var(--indigo) 10%,transparent),transparent 70%),radial-gradient(700px 600px at 100% 100%,color-mix(in srgb,var(--blue) 6%,transparent),transparent 70%),var(--a-bg);background-attachment:fixed}
 body.apple .a-sidebar{inset:12px auto 12px 12px;width:248px;border-radius:24px;border:1px solid var(--a-glass-edge);
  background:linear-gradient(180deg,var(--a-glass-top),var(--a-glass-bottom));backdrop-filter:saturate(180%) blur(40px);-webkit-backdrop-filter:saturate(180%) blur(40px);
  box-shadow:inset 0 1px 0 var(--a-glass-shine),0 10px 40px rgba(0,0,0,.10)}
 body.apple .a-main{margin-left:272px}
 body.apple .a-toolbar{background:transparent;border-bottom-color:transparent;backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px)}
 body.apple .a-nav.active{background:color-mix(in srgb,var(--blue) 88%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
}
body.apple{--a-glass-top:rgba(255,255,255,.72);--a-glass-bottom:rgba(246,246,250,.58);--a-glass-edge:rgba(255,255,255,.7);--a-glass-shine:rgba(255,255,255,.9)}
body.apple[data-theme=dark]{--a-glass-top:rgba(58,58,72,.46);--a-glass-bottom:rgba(28,28,36,.40);--a-glass-edge:rgba(255,255,255,.10);--a-glass-shine:rgba(255,255,255,.12)}
body.apple[data-theme=dark] .a-sidebar{box-shadow:inset 0 1px 0 var(--a-glass-shine),0 0 60px color-mix(in srgb,var(--indigo) 22%,transparent)}
@media (min-width:901px){body.apple[data-theme=dark]{background:radial-gradient(900px 700px at 0% 0%,color-mix(in srgb,var(--indigo) 26%,transparent),transparent 70%),radial-gradient(800px 700px at 100% 100%,color-mix(in srgb,var(--blue) 12%,transparent),transparent 70%),#000;background-attachment:fixed}}

/* Markdown tables and lists in Claude's text */
.a-md-table{overflow-x:auto;margin:8px 0}.a-md-table table{border-collapse:collapse;font-size:13.5px;min-width:100%}
.a-md-table th,.a-md-table td{text-align:left;padding:6px 10px;border-bottom:1px solid var(--a-sep);vertical-align:top}
.a-md-table th{font-weight:600;color:var(--a-label2);font-size:12.5px}
.a-md-list{margin:6px 0;padding-left:20px}.a-md-list li{padding:1px 0!important;border:0!important}
.a-settings{display:grid;gap:12px}.a-settings .a-group-head{margin-bottom:0}
.a-setting{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.a-setting label,.a-setting>span{font-size:14px;font-weight:550}
.a-setting select{border:1px solid var(--a-sep);border-radius:10px;padding:7px 10px;background:var(--a-card2);color:var(--a-label);font:inherit;font-size:14px}
.a-effort{display:inline-flex;gap:2px;padding:2px;border-radius:9px;background:var(--a-fill)}
.a-effort button{border:0;background:none;padding:5px 11px;border-radius:7px;font:inherit;font-size:13px;color:var(--a-label);cursor:pointer}
.a-effort button.active{background:var(--a-card);box-shadow:0 1px 3px rgba(0,0,0,.12);font-weight:600}