/* Shared portal shell; values come from the original forest/ivory Agent page. */
:root { --portal-ivory:#f4f3e9; --portal-forest:#102019; --portal-nav-surface:#eeede3; --portal-ink:#173c35; --portal-muted:#61736b; --portal-selected:#d5edcd; --portal-line:#173c3526; --portal-gold:#d6a65e; }
body.portal-page { margin:0; height:100dvh; overflow:hidden; background:var(--portal-ivory); color:var(--portal-ink); font:16px/1.6 Inter,ui-sans-serif,system-ui,sans-serif; }
.portal-page > header,.portal-page > footer,.portal-page .portal-background { display:none; }
body.portal-page > main { display:block; width:100%; max-width:none; height:100%; margin:0; padding:0; overflow:hidden; }
body.portal-page .portal-shell, body.portal-page .portal-shell.agent-new-conversation-page, body.portal-page #dashboard.portal-shell { display:grid; grid-template-columns:var(--portal-nav-width,280px) minmax(0,1fr) 260px; width:100%; height:100%; min-height:0; margin:0; padding:0; gap:0; align-items:stretch; justify-items:stretch; }
body.portal-page .portal-shell--conversation, body.portal-page .portal-shell--conversation.agent-new-conversation-page { grid-template-columns:var(--portal-nav-width,280px) minmax(0,1fr); }
body.portal-page .portal-shell--without-context { grid-template-columns:var(--portal-nav-width,280px) minmax(0,1fr); }
body.portal-page .portal-shell--conversation.portal-sidebar-collapsed { grid-template-columns:minmax(0,1fr); }
.portal-sidebar-collapsed .portal-left { display:none !important; }
.portal-shell * { box-sizing:border-box; }
.portal-shell a:focus-visible,.portal-shell button:focus-visible,.portal-shell summary:focus-visible,.portal-shell select:focus-visible { outline:3px solid var(--portal-gold); outline-offset:3px; }
.portal-shell h1,.portal-shell h2 { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.025em; }
body.portal-page .portal-left { position:relative; width:100%; display:flex; flex-direction:column; gap:12px; height:100%; min-height:0; overflow:hidden; padding:28px 22px 18px; background:var(--portal-nav-surface); color:var(--portal-ink); border:0; border-radius:0; }
.portal-left .brand { flex-shrink:0; margin:0 0 12px; color:var(--portal-ink); }
.portal-left .brand-mark { border-color:#173c3540; color:#bfe6ad; }
.portal-left .brand-copy small { color:var(--portal-muted); }
.portal-switcher { display:grid; gap:6px; color:var(--portal-muted); font-size:12px; }
.portal-switcher select { width:100%; min-height:44px; margin:0; padding:10px 12px; border:1px solid #173c3540; border-radius:10px; background:var(--portal-nav-surface); color:var(--portal-ink); font:600 15px system-ui; }
.portal-nav { display:grid; gap:3px; flex-shrink:0; }
.portal-nav a { display:block; padding:9px 12px; min-height:42px; border:0; border-radius:9px; color:#375247; text-decoration:none; font:600 14px/1.6 system-ui; }
.portal-nav a:hover { background:#e5f1e3; }
.portal-nav a[aria-current=page] { background:var(--portal-selected); color:var(--portal-forest); box-shadow:inset 3px 0 var(--portal-gold); }
body.portal-page .portal-list { display:block; flex:1 1 0; min-height:0; overflow-y:auto; overscroll-behavior:contain; margin:0 -22px 0 0; padding-right:18px; scrollbar-gutter:stable; scrollbar-color:#a5b0a7 var(--portal-nav-surface); }
.portal-left .agent-conversation-history { display:flex; flex:1 1 0; flex-direction:column; gap:12px; min-height:0; }
.portal-left .agent-conversation-history .agent-new-conversation { flex:0 0 auto; }
.portal-list .agent-conversation-tab { margin-bottom:5px; }
body.portal-page .portal-left .portal-profile { position:relative; flex-shrink:0; inset:auto; z-index:2; margin:auto 0 0; padding:14px 0 0; width:100%; border-top:1px solid #173c3526; background:var(--portal-nav-surface); backdrop-filter:none; }
.portal-profile summary,.portal-profile .profile-toggle { display:flex; align-items:center; gap:12px; color:var(--portal-ink); min-height:44px; cursor:pointer; }
.portal-profile .profile-menu-actions,.portal-profile .profile-popover { position:absolute; bottom:100%; top:auto; left:0; right:0; padding:12px; background:var(--portal-ivory); color:var(--portal-ink); border-radius:12px; box-shadow:0 8px 24px #10201930; }
.portal-profile .profile-menu-actions a,.portal-profile .profile-menu-actions button { color:var(--portal-ink); }
body.portal-page .portal-main,body.portal-page .agent-new-conversation-page .portal-main { display:block; height:100%; min-height:0; min-width:0; overflow-y:auto; margin:0; padding:38px clamp(24px,3vw,52px); border:0; border-radius:0; background:var(--portal-ivory); box-shadow:none; }
.portal-sidebar-toggle { position:fixed; top:18px; left:calc(var(--portal-nav-width,280px) - 18px); z-index:4; display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid var(--portal-line); border-radius:50%; color:var(--portal-ink); background:var(--portal-ivory); box-shadow:0 2px 8px #1020191f; font:700 18px/1 system-ui; cursor:pointer; }
.portal-sidebar-collapsed .portal-sidebar-toggle { left:16px; }
.portal-sidebar-toggle:hover { background:#e5f1e3; }
body.portal-page .dashboard-layout.portal-main { padding:0; }
.portal-page .dashboard-content { padding:38px clamp(24px,3vw,52px); }
.portal-page .dashboard-grid { display:block; width:100%; }
.portal-page .portal-main .card { padding:0; background:transparent; border:0; box-shadow:none; }
.portal-page .portal-main h1,.portal-page .portal-main section > h2 { margin:0 0 20px; font-size:clamp(28px,3vw,42px); }
.portal-page .mission-plan-card { margin:0; }
.portal-page .player { padding:22px 0; border:0; border-bottom:1px solid var(--portal-line); background:transparent; }
.portal-page .player > strong { font:28px Georgia,serif; }
.portal-page .player button,.portal-page .player .button { margin:8px 8px 0 0; }
.portal-page .player[aria-current=true] { border-left:3px solid var(--portal-gold); padding-left:16px; }
.portal-player-management { margin-top:14px; }
.portal-player-management summary { cursor:pointer; font-size:14px; }
.portal-right { min-width:0; overflow-y:auto; padding:34px 24px; border-left:1px solid var(--portal-line); background:#eeeee2; color:var(--portal-muted); }
.portal-right h2 { color:var(--portal-ink); margin:0 0 16px; font-size:28px; overflow-wrap:anywhere; }
.portal-kicker { font-size:11px; text-transform:uppercase; letter-spacing:.14em; margin:0 0 10px; }
.portal-context-note { font-size:14px; }
.portal-context-links { display:grid; gap:12px; margin:26px 0; font-size:14px; }
.portal-context-links a { color:var(--portal-ink); text-decoration:none; }
.portal-page .agent-new-conversation-page .agent-chat-card { display:flex; justify-content:center; }
.portal-page .agent-chat-card:not(.settings-content) { display:flex; flex-direction:column; overflow:hidden; }
.portal-page .agent-messages { flex:1; width:min(100%,760px); align-self:center; overflow-y:auto; padding-right:8px; }
.portal-page .agent-form { flex-shrink:0; margin:16px 0 0; background:var(--portal-ivory); }
.portal-page .portal-main .agent-form { width:min(100%,760px); align-self:center; }
.portal-page .agent-form textarea { max-height:24dvh; }
.portal-page .agent-message-content { font-size:clamp(.95rem,1vw,1.02rem); line-height:1.65; }
.portal-page .agent-new-conversation-page .agent-form { margin-block:auto; }
.portal-page .agent-composer-heading h1 { font:400 clamp(24px,2.3vw,36px)/1.15 Georgia,serif; }
.portal-page .settings-content-inner { max-width:760px; }
.portal-settings-row { display:block; padding:24px 0; border-bottom:1px solid var(--portal-line); text-decoration:none; color:var(--portal-ink); }
.portal-settings-row strong { display:block; font-size:18px; }
.portal-settings-row small { color:var(--portal-muted); }
.portal-page .account-settings-form { display:grid; gap:18px; max-width:520px; margin-top:24px; }
.portal-page .account-settings-form label { gap:7px; color:var(--portal-ink); font-weight:600; }
.portal-page .account-settings-form input { width:100%; border:1px solid #173c3540; border-radius:10px; padding:11px 12px; background:var(--portal-ivory); color:var(--portal-ink); }
.portal-page .account-settings-form input:focus { outline:3px solid var(--portal-gold); outline-offset:2px; }
.portal-page .account-settings-form .primary-button { justify-self:start; margin-top:4px; background:var(--portal-selected); color:var(--portal-forest); }
.portal-page .settings-notice { margin:16px 0 0; color:var(--portal-ink); }
.portal-page .settings-notice--error { color:#8a342c; }
.portal-page .layout-choice { padding:0; border:0; background:transparent; }
.portal-mobile-bar { display:none; }
@media (max-width:1100px) and (min-width:801px) { body.portal-page .portal-shell,body.portal-page .portal-shell.agent-new-conversation-page,body.portal-page #dashboard.portal-shell { grid-template-columns:var(--portal-nav-width,240px) minmax(0,1fr) 210px; } body.portal-page .portal-shell--conversation,body.portal-page .portal-shell--conversation.agent-new-conversation-page,body.portal-page .portal-shell--without-context { grid-template-columns:var(--portal-nav-width,240px) minmax(0,1fr); } .portal-right{padding:28px 18px;} }
@media (max-width:800px) {
 body.portal-page .portal-shell,body.portal-page .portal-shell.agent-new-conversation-page,body.portal-page #dashboard.portal-shell { grid-template-columns:minmax(0,1fr); grid-template-rows:56px minmax(0,1fr); }
 .portal-mobile-bar { display:flex; justify-content:space-between; padding:8px 16px; border-bottom:1px solid var(--portal-line); }
 .portal-mobile-bar button { padding:6px 12px; border:1px solid var(--portal-line); border-radius:8px; background:transparent; color:var(--portal-ink); font:600 14px system-ui; }
 body.portal-page .portal-left,body.portal-page .portal-right { display:none; position:fixed; top:56px; bottom:0; height:calc(100dvh - 56px); width:min(340px,90vw); z-index:10; box-shadow:0 12px 30px #10201940; }
 body.portal-page .portal-left { left:0; } body.portal-page .portal-right { right:0; }
 body.portal-page .navigation-open .portal-left { display:flex; } body.portal-page .context-open .portal-right { display:block; }
 body.portal-page .portal-main,body.portal-page .agent-new-conversation-page .portal-main { padding:24px 18px; grid-column:1; grid-row:2; }
 .portal-page .dashboard-content { padding:0; }
 .portal-page .portal-main .agent-form textarea { min-height:110px; }
 .portal-page .agent-composer .agent-send-button { bottom:12px; width:44px; height:44px; }
 .portal-sidebar-toggle { display:none; }
}
/* Normalize inherited account/template typography and control spacing. */
.portal-left .brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.portal-left .brand-mark { display:grid; place-items:center; width:38px; height:38px; border:1px solid #173c3540; border-radius:50%; font:22px Georgia,serif; }
.portal-left .brand-copy { display:grid; line-height:1.05; }
.portal-left .brand-copy strong { font:24px Georgia,serif; letter-spacing:.4px; }
.portal-left .brand-copy small { margin-top:4px; font:700 10px system-ui; letter-spacing:2px; text-transform:uppercase; }
.portal-left .portal-switcher { margin:0; padding:0; font:600 12px/1.6 system-ui; }
.portal-left .portal-nav { padding:0; margin:0; align-content:start; }
.portal-right .portal-context-links a { padding:0; min-height:32px; border:0; font:500 14px/1.6 system-ui; }
.portal-left .portal-profile .profile-initial { color:var(--portal-ink); border-color:#173c3540; }
.portal-shell .agent-sidebar-heading:empty { display:none; }
.portal-page #error:not(:empty),.portal-page #notice:not(:empty) { position:fixed; bottom:16px; left:calc(var(--portal-nav-width,280px) + 20px); max-width:60vw; z-index:15; padding:14px 18px; background:var(--portal-ivory); border:1px solid var(--portal-line); border-radius:12px; box-shadow:0 4px 20px #10201922; }

.portal-shell [hidden] { display:none !important; }

/* Screenshot reference: sampled left pane RGB(238,237,227), warm ivory. */
.portal-left .profile-name { color:var(--portal-ink); }
.portal-left .agent-new-conversation { color:#174b40; background:#e5f1e3; border:1px solid #1f665733; }
.portal-left .agent-new-conversation:hover { background:#d5edcd; }
.portal-left .agent-conversation-tab { color:#375247; }
.portal-left .agent-conversation-tab small { color:#61736b; }
.portal-left .agent-conversation-tab:hover { background:#e5f1e3; }
.portal-left .agent-conversation-tab[aria-current=page] { color:#173c35; background:var(--portal-selected); box-shadow:inset 3px 0 var(--portal-gold); }
.portal-left .portal-list::-webkit-scrollbar-track { background:var(--portal-nav-surface); }
.portal-left .portal-list::-webkit-scrollbar-thumb { border:4px solid var(--portal-nav-surface); background:#a5b0a7; }

.portal-back-link { display:inline-flex; align-items:center; min-height:44px; padding:8px 14px; margin:0 0 24px; border:1px solid var(--portal-line); border-radius:10px; color:var(--portal-ink); background:transparent; text-decoration:none; font:600 14px/1.6 system-ui; }
.portal-back-link:hover { background:#e5f1e3; }

.learning-discussion{margin:0 20px 12px;padding:10px 14px;border:1px solid #d8e3d7;border-radius:12px;font-size:14px}.learning-discussion summary{cursor:pointer}.learning-discussion [data-learning-messages]{max-height:240px;overflow:auto;white-space:pre-wrap}.learning-discussion textarea{width:100%;box-sizing:border-box}.learning-discussion form{display:grid;gap:8px}

.portal-left .agent-page-tabs { flex-shrink:0; }
.portal-main .learning-page { margin:0; padding:0; border:0; width:100%; max-width:900px; align-self:start; }
.learning-page h1 { margin:0 0 24px; font-size:24px; }
.learning-page [data-learning-messages] { max-height:none; }
.learning-page form { margin-top:24px; }
.portal-page [data-agent-page="progress"] .agent-chat-card,
.portal-page [data-agent-page="messages"] .agent-chat-card { overflow-y:auto; }
.learning-page { flex-shrink:0; }

/* Shared parent–mentor chat, scoped separately from the learning agent. */
.portal-page [data-agent-page="messages"] .portal-main { overflow:hidden; }
.portal-main [data-learning-discussion].learning-page { display:flex; flex-direction:column; height:100%; min-height:0; max-width:960px; margin:0 auto; font:15px/1.5 Inter,ui-sans-serif,system-ui,sans-serif; }
.learning-chat-header { flex-shrink:0; padding:0 0 20px; border-bottom:1px solid var(--portal-line); }
.learning-page .learning-chat-header h1 { margin:0 0 6px; font:650 clamp(22px,2vw,28px)/1.25 Inter,ui-sans-serif,system-ui,sans-serif; letter-spacing:-.6px; }
.learning-chat-header .muted { margin:0; font-size:13px; color:var(--portal-muted); }
.learning-chat-header label { display:flex; align-items:center; gap:12px; margin-top:14px; font-size:13px; }
.learning-chat-header select { max-width:320px; border:1px solid var(--portal-line); border-radius:10px; padding:9px 12px; background:#fffdf7; color:var(--portal-ink); font:inherit; }
.learning-page [data-learning-messages] { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:20px 6px; white-space:normal; }
.learning-chat-date { text-align:center; margin:6px 0 22px; color:var(--portal-muted); font-size:12px; }
.learning-chat-message { display:flex; flex-direction:column; align-items:flex-start; margin-bottom:18px; }
.learning-chat-message.is-own { align-items:flex-end; }
.learning-chat-sender { margin:0 10px 5px; font-size:12px; font-weight:600; color:var(--portal-muted); }
.learning-chat-bubble { max-width:78%; padding:12px 16px 8px; border:1px solid #173c3512; border-radius:18px 18px 18px 4px; background:#fffdf8; box-shadow:0 2px 3px #173c3505; }
.is-own .learning-chat-bubble { background:#dcecd8; border-radius:18px 18px 4px 18px; }
.learning-chat-text { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.6; }
.learning-chat-bubble time { display:block; margin-top:6px; text-align:right; color:#586c61; font-size:11px; }
.learning-chat-activity { margin-bottom:7px; color:#61736b; font-size:11px; font-weight:600; }
.learning-page [data-learning-form] { flex-shrink:0; display:flex; align-items:flex-end; gap:10px; margin:12px 0 0; padding:10px 12px; background:#fffdf8; border:1px solid #173c352b; border-radius:20px; box-shadow:0 3px 12px #173c3506; }
.learning-page [data-learning-form]:focus-within { border-color:#50836a; box-shadow:0 0 0 3px #50836a18; }
.learning-page [data-learning-form] textarea { flex:1; min-width:0; min-height:44px; max-height:144px; padding:10px 4px; margin:0; border:0; border-radius:0; background:transparent; color:var(--portal-ink); font:15px/1.5 Inter,ui-sans-serif,system-ui,sans-serif; resize:none; outline:none; box-shadow:none; }
.learning-page [data-learning-form] button { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; min-height:44px; padding:0; border:0; border-radius:50%; background:#245b48; color:white; cursor:pointer; }
.learning-page [data-learning-form] button:hover { background:#174432; }
.learning-page [data-learning-form] button:disabled { opacity:.45; cursor:wait; }
.learning-page [data-learning-form] button:focus-visible { outline:3px solid var(--portal-gold); outline-offset:3px; }
.learning-page [data-learning-status] { flex-shrink:0; margin:8px 4px 0; color:var(--portal-muted); font-size:12px; }
.learning-page [data-learning-status]:empty { margin:0; }
@media(max-width:800px) {
 .portal-page [data-agent-page="messages"] .portal-main { padding:18px 14px 12px; }
 .learning-chat-header { padding-bottom:14px; }
 .learning-chat-bubble { max-width:90%; }
 .portal-page .portal-main [data-learning-form] textarea { min-height:44px; }
}

.agent-response-details { margin-top: 16px; border-top: 1px solid #dce5df; padding-top: 8px; font-size: .85rem; color: #52675c; }
.agent-response-details > summary { cursor: pointer; width: fit-content; font-size: .82rem; }
.agent-response-details > summary:focus-visible { outline: 2px solid #38765b; outline-offset: 4px; }
.agent-response-details[open] > summary { margin-bottom: 12px; }
/* Clear hierarchy: explorer context, primary action, compact history, account. */
.portal-left .portal-section-label { margin:0 0 6px; color:var(--portal-muted); font:700 11px/1.5 system-ui; letter-spacing:.08em; text-transform:uppercase; }
.portal-left .portal-explorer-link { display:block; padding:8px 12px; border-radius:8px; color:var(--portal-ink); text-decoration:none; font:600 16px/1.4 system-ui; overflow-wrap:anywhere; }
.portal-left .portal-explorer-link[aria-current=page] { background:var(--portal-selected); }
.portal-left .agent-new-conversation { flex-shrink:0; margin:4px 0 8px; min-height:46px; justify-content:flex-start; padding:12px 16px; color:#fff; background:#174b40; border-color:#174b40; font:700 15px/1.3 system-ui; }
.portal-left .agent-new-conversation:hover { background:#236453; }
.portal-left .portal-history-heading { margin:0; padding-top:14px; border-top:1px solid var(--portal-line); }
.portal-left .agent-conversation-tab { padding:8px 10px; border-radius:6px; background:transparent; }
.portal-left .agent-conversation-tab strong { font:400 13px/1.4 system-ui; }
.portal-left .agent-conversation-tab small { font:400 11px/1.3 system-ui; }
.portal-left .agent-conversation-tab[aria-current=page] { background:#fff8; box-shadow:inset 2px 0 #174b40; }
.portal-history-toggle { display:block; min-height:36px; padding:8px 10px; border:0; background:transparent; color:#174b40; font:600 12px/1.4 system-ui; cursor:pointer; box-shadow:none; }
.portal-account-links { display:grid; gap:2px; }
.portal-account-name { margin:0 0 6px; color:var(--portal-muted); font:600 12px/1.4 system-ui; }
.portal-account-links a,.portal-account-links .nav-action { display:block; padding:6px 0; color:var(--portal-ink); background:transparent; border:0; text-decoration:none; font:500 13px/1.4 system-ui; box-shadow:none; }
.portal-left .portal-switcher { max-height:22dvh; overflow-y:auto; flex-shrink:0; }

/* Keep the divider outside the sidebar's clipped scrolling content. */
.portal-shell { position:relative; }
.portal-sidebar-resizer { position:absolute; top:0; bottom:0; left:calc(var(--portal-nav-width,280px) - 5px); width:10px; z-index:3; cursor:col-resize; touch-action:none; }
.portal-sidebar-resizer::after { content:""; position:absolute; top:0; bottom:0; left:4px; width:2px; background:var(--portal-line); }
.portal-sidebar-resizer:hover::after,.portal-sidebar-resizer:focus-visible::after,.portal-resizing .portal-sidebar-resizer::after { background:var(--portal-gold); }
.portal-sidebar-resizer:focus-visible { outline:2px solid var(--portal-gold); outline-offset:-2px; }
.portal-resizing,.portal-resizing * { cursor:col-resize !important; user-select:none !important; }
.portal-sidebar-collapsed .portal-sidebar-resizer { display:none; }
@media (max-width:800px) { .portal-sidebar-resizer { display:none; } }