.project-dossier { --dossier-accent: #84e7d4; margin: 16px 0; padding: clamp(18px, 3vw, 30px); border: 1px solid #84e7d42e; border-radius: 22px; background: linear-gradient(145deg, #18343380, #151b2780); color: var(--text, #edf5f4); line-height: 1.6; overflow-wrap: anywhere; }
.project-dossier .dossier-eyebrow { font-size: 10px; font-weight: 700; letter-spacing: .17em; color: var(--dossier-accent); margin: 0 0 14px; }
.project-dossier h2 { font: 500 clamp(25px, 3vw, 36px)/1.12 Outfit, sans-serif; letter-spacing: -.035em; margin: 0 0 18px; text-wrap: balance; }
.project-dossier p { font-size: 15px; color: #c7d5d5; }
.project-dossier button { cursor: pointer; font: inherit; color: inherit; border: 1px solid #ffffff26; background: #ffffff08; border-radius: 12px; padding: 12px 15px; min-height: 44px; text-align: left; transition: background .15s, border-color .15s; }
.project-dossier button:hover { background: #84e7d415; border-color: #84e7d477; }
.project-dossier button:focus-visible, .project-dossier input:focus-visible, .project-dossier textarea:focus-visible, .project-dossier summary:focus-visible { outline: 2px solid var(--dossier-accent); outline-offset: 3px; }
.dossier-question { border: 0; border-top: 1px solid #ffffff18; padding: 24px 0 12px; margin: 24px 0; min-width: 0; }
.dossier-question legend { font-size: 20px; font-weight: 500; line-height: 1.35; padding: 0 0 8px; }
.dossier-question legend span { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #84e7d41c; color: var(--dossier-accent); font-size: 13px; margin-right: 9px; }
.dossier-question p { font-size: 13px; margin: 0 0 14px; }
.dossier-options { display: grid; gap: 8px; margin-bottom: 16px; }
.dossier-options button[aria-pressed=true] { background: #84e7d427; border-color: var(--dossier-accent); color: #b8fff1; }
.project-dossier label { display: block; font-size: 13px; color: #c7d5d5; }
.project-dossier input, .project-dossier textarea { box-sizing: border-box; display: block; width: 100%; margin: 8px 0; padding: 13px; border-radius: 12px; border: 1px solid #ffffff26; background: #09111466; color: #f1faf7; font: 15px/1.5 Outfit, sans-serif; }
.project-dossier textarea { min-height: 100px; resize: vertical; }
.project-dossier .dossier-primary { width: 100%; background: var(--dossier-accent); color: #092722; font-weight: 600; display: flex; justify-content: space-between; }
.project-task-ledger { margin: 22px 0; border-top: 1px solid #ffffff18; padding-top: 16px; }
.project-task-ledger summary { cursor: pointer; font-size: 15px; font-weight: 600; }
.project-task-ledger ul { padding-left: 18px; }
.project-task-ledger li { margin: 12px 0; font-size: 13px; }
.dossier-thought { border-top: 1px solid #ffffff18; padding-top: 20px; }
.dossier-thought small { display: block; color: #adbdc0; margin: 10px 0; line-height: 1.5; }
.dossier-failure { padding: 16px; border-radius: 14px; border: 1px solid #ecc78b55; background: #ecc78b0d; }
.dossier-failure strong { color: #f3d29d; }
@media (prefers-reduced-motion: reduce) { .project-dossier button { transition: none; } }
.dossier-selection {
    padding: 20px;
    margin: 12px 0;
    border: 1px solid rgba(60, 210, 196, .35);
    border-radius: 16px;
    background: rgba(60, 210, 196, .06);
    overflow-wrap: anywhere;
}
.dossier-selection strong { font-size: 1.2rem; line-height: 1.5; }
.dossier-selection p { margin: 8px 0; }
.dossier-selection small { opacity: .8; }
.dossier-selection details { margin-top: 12px; }
.dossier-selection code { display: block; white-space: pre-wrap; padding-top: 10px; }

/* Studio adaptation of the lobby's channel-based conversation widget.
   Ledger is a destination, not another message in the conversation. */
#panelRight {
    width: 460px; min-width: 0; height: 680px;
    max-width: calc(100vw - 32px); max-height: calc(100dvh - 100px);
    border-radius: 26px; border-color: #c8b7ff30;
    background: radial-gradient(ellipse at 0 0, #51377842, transparent 52%),
        radial-gradient(ellipse at 100% 100%, #224f5140, transparent 55%), #12121ef5;
    box-shadow: 0 24px 90px #0007, 0 0 60px #9371ef12;
    color: #f4f1fa;
}
#panelRight.companion-expanded { width: 720px; height: 800px; }
#panelRight [hidden] { display: none !important; }
#panelRight .chat-header { min-height: 78px; padding: 18px 22px; gap: 12px; border-bottom: 0; }
#panelRight .chat-header .logo { width: 38px !important; height: 38px !important; border-radius: 14px !important; box-shadow: 0 0 24px #a679ee38; }
#panelRight .chat-title { font: 500 18px/1.3 Outfit, sans-serif; letter-spacing: -.02em; }
#panelRight .chat-title small { display: block; color: #b5a7ca; font: 600 9px/1.8 Outfit, sans-serif; letter-spacing: .16em; }
#panelRight .chat-status { font-size: 11px; color: #c3d6d3; }
#panelRight .panel-close-btn { width: 30px; height: 32px; flex-shrink: 0; }
.companion-tabs { display: flex; gap: 22px; margin: 0 22px; border-bottom: 1px solid #ffffff12; flex-shrink: 0; }
.companion-tabs button { position: relative; background: none; border: 0; padding: 8px 0 15px; color: #a8a4b9; cursor: pointer; font: 500 14px Outfit, sans-serif; }
.companion-tabs button[aria-selected=true] { color: #f5eefc; }
.companion-tabs button[aria-selected=true]::after { content: ''; position: absolute; height: 3px; border-radius: 3px; left: 0; right: 0; bottom: -1px; background: linear-gradient(90deg,#b8a0ff,#efa9cf); }
.companion-tabs button span { display: inline-grid; place-items: center; min-width: 19px; height: 19px; margin-left: 5px; border-radius: 7px; background: #c7b2ff18; font-size: 10px; color: #d0bfff; }
#panelRight .chat-messages { padding: 24px 22px; gap: 25px; min-height: 0; scroll-behavior: smooth; }
#panelRight .msg { gap: 0; }
#panelRight .msg-avatar { display: none; }
#panelRight .msg-name { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: #b3a3d0; margin-bottom: 9px; }
#panelRight .msg-content { font: 400 16px/1.7 Outfit, sans-serif; color: #ece7f3; white-space: pre-wrap; }
#panelRight .msg-content:empty { display: none; }
#panelRight .msg.user { margin-left: 30px; }
#panelRight .msg.user .msg-body { padding: 15px 18px; border-radius: 19px 19px 5px 19px; background: linear-gradient(120deg,#7560b329,#ac5e8a20); border: 1px solid #bb94ec1f; }
#panelRight .msg.user .msg-name { color: #cabbdc; }
#panelRight .msg.user .msg-content { font-size: 15px; }
#panelRight .msg.system .msg-content { color: #b8b3c6; font-size: 13px; }
.companion-more summary { cursor: pointer; list-style: none; }
.companion-more summary::marker { content: ''; }
.companion-more summary span { display: block; color: #cab4fc; font-size: 12px; margin-top: 5px; }
.companion-more[open] summary span { display: none; }
.companion-full-text { padding-top: 15px; margin-top: 10px; border-top: 1px solid #ffffff15; white-space: pre-wrap; }
#panelRight .chat-input-area { padding: 14px 18px 18px; border-top: 1px solid #ffffff10; }
#panelRight .chat-input-wrapper { border-radius: 18px; border: 1px solid #c4a4f82b; background: #ffffff06; padding: 8px; }
#panelRight .chat-input { font: 400 16px/1.5 Outfit,sans-serif; color: #f4f0f8; }
#panelRight .chat-input::placeholder { color: #aaa0ba; }
#panelRight .send-btn { background: linear-gradient(135deg,#c5a4ff,#f4afd1); color: #25172f; border-radius: 12px; width: 38px; height: 38px; }
#panelRight .building-indicator { margin: 0 22px; border-radius: 12px; color: #c8f0e4; }
#panelRight .project-dossier { margin: 4px 0; padding: 0; border: 0; border-radius: 0; background: none; }
#panelRight .project-dossier h2 { font: 400 33px/1.14 Georgia,serif; color: #f6edf7; letter-spacing: -.04em; }
#panelRight .project-dossier > p:not(.dossier-eyebrow) { font-size: 14px; color: #b9b1c6; }
#panelRight .dossier-question { margin: 25px 0 14px; padding-top: 18px; }
#panelRight .dossier-question legend { font: 500 23px/1.35 Outfit,sans-serif; color: #f3edf8; letter-spacing: -.02em; }
#panelRight .dossier-question p { color: #a9a0b8; }
#panelRight .question-reason { margin: 4px 0 16px; }
#panelRight .question-reason summary { cursor: pointer; color: #b9a4d5; font-size: 12px; }
#panelRight .dossier-options { gap: 10px; }
#panelRight .dossier-options button { font-size: 16px; font-weight: 400; line-height: 1.5; padding: 16px 18px; border-color: #c6b2ec20; border-radius: 16px; background: #ffffff04; }
#panelRight .dossier-options button:hover { background: #b899ed12; border-color: #baa0e660; transform: translateY(-1px); }
#panelRight .dossier-options button[aria-pressed=true] { border-color: #bca0ed; background: #b899ed24; color: #f0e4ff; }
#panelRight .dossier-primary { background: linear-gradient(100deg,#c7aff2,#aedfd2); color: #211c2d; border: 0; border-radius: 14px; }
.companion-project { flex: 1; overflow-y: auto; min-height: 0; padding: 28px 24px; }
.companion-eyebrow { font: 600 10px/1.6 Outfit,sans-serif; letter-spacing: .16em; color: #bcabd6; margin: 0 0 18px; }
.companion-eyebrow span { float: right; color: #a9e1d0; letter-spacing: .03em; }
.companion-project h2 { font: 400 42px/1.08 Georgia,serif; letter-spacing: -.04em; margin: 0 0 24px; color: #f9f1fa; }
.companion-project h2 em { color: #cfb9f1; font-weight: 400; }
.companion-project p { font: 400 15px/1.65 Outfit,sans-serif; color: #beb5cc; }
.companion-progress { display: flex; align-items: center; gap: 18px; }
.companion-progress strong { font: 400 36px/1 Outfit,sans-serif; color: #eae1f7; }
.companion-progress strong span { color: #8f819f; font-size: 22px; }
.companion-progress p { margin: 0; line-height: 1.4; font-size: 13px; color: #e0d6e9; }
.companion-progress p span { color: #a79bb8; font-size: 12px; }
.companion-project progress { display: block; width: 100%; height: 4px; margin: 20px 0 30px; appearance: none; border: 0; border-radius: 5px; overflow: hidden; background: #ffffff10; }
.companion-project progress::-webkit-progress-bar { background: #ffffff10; }
.companion-project progress::-webkit-progress-value { background: linear-gradient(90deg,#b8a0ed,#9edbcd); border-radius: 5px; }
.companion-project progress::-moz-progress-bar { background: #b8a0ed; }
.companion-section-heading { display: flex; justify-content: space-between; align-items: center; margin: 25px 0 14px; }
.companion-section-heading h3 { margin: 0; font-size: 18px; font-weight: 500; }
.companion-section-heading > span { color: #9f92af; font-size: 11px; }
.companion-task { border-bottom: 1px solid #ffffff10; padding: 14px 0; }
.companion-task summary { cursor: pointer; display: flex; gap: 10px; align-items: center; font: 500 16px/1.4 Outfit,sans-serif; list-style: none; }
.companion-task summary > span:nth-child(2) { flex: 1; }
.companion-task summary small { color: #e9c5a2; font-size: 11px; font-weight: 400; flex-shrink: 0; }
.task-dot { height: 7px; width: 7px; border: 1px solid #dcb892; border-radius: 50%; flex-shrink: 0; }
.companion-task.is-done .task-dot { border-color: #89bcad; background: #89bcad; }
.companion-task.is-done summary small { color: #9fcebd; }
.companion-task p.task-evidence { font-size: 12px; color: #a196b2; }
.companion-task code { color: #8e819d; font: 10px/1.5 'JetBrains Mono',monospace; overflow-wrap: anywhere; }
.companion-attention { padding: 18px; border: 1px solid #e7bf9030; border-radius: 16px; background: #e7bf9008; margin-bottom: 22px; }
.companion-attention > span { font-size: 9px; letter-spacing: .14em; color: #d7b990; }
.companion-attention h3 { font: 400 22px/1.3 Georgia,serif; color: #efd9bb; margin: 9px 0; }
.companion-attention summary { color: #d7b990; cursor: pointer; font-size: 12px; }
.companion-brief > summary,.companion-decisions > summary,.companion-project .dossier-thought > summary { cursor: pointer; font-size: 14px; color: #d1c4df; padding: 16px 0; }
.companion-decisions { margin-top: 18px; border-top: 1px solid #ffffff12; }
.companion-decisions summary span { color: #a69aba; margin-left: 8px; }
.companion-decisions ul { padding: 0; list-style: none; }
.companion-decisions li { border-left: 2px solid #a594bd40; padding-left: 15px; margin: 18px 0; }
.companion-decisions li > span { font-size: 12px; color: #a69ab7; }
.companion-project .dossier-thought { padding: 0; margin-top: 15px; }
.companion-project .dossier-thought label { display: block; font-size: 13px; color: #d5c7e6; margin-top: 5px; }
.companion-project textarea { width: 100%; min-height: 100px; box-sizing: border-box; margin-top: 10px; border: 1px solid #ffffff20; background: #ffffff05; color: #f4edf8; border-radius: 14px; padding: 14px; font: 15px/1.5 Outfit,sans-serif; resize: vertical; }
.companion-project .dossier-thought p { font-size: 12px; }
.companion-project .dossier-thought button { border: 1px solid #bd9eeb40; border-radius: 10px; padding: 11px 16px; background: #bd9eeb15; color: #e3d1fa; font: 500 14px Outfit,sans-serif; cursor: pointer; }
.companion-note-status { display: block; margin-top: 9px; color: #a2d6c5; font-size: 12px; }
#panelRight :is(button,summary,textarea,input):focus-visible { outline: 2px solid #b6e9d8; outline-offset: 3px; }
@media (max-width: 600px) {
    #panelRight, #panelRight.companion-expanded { width: calc(100vw - 20px); max-width: calc(100vw - 20px); right: 10px; bottom: 74px; max-height: calc(100dvh - 94px); border-radius: 22px; }
    #panelRight .chat-header { padding: 14px 16px; gap: 8px; }
    #panelRight .chat-title { font-size: 16px; }
    #panelRight .chat-status { font-size: 10px; }
    #panelRight .chat-messages { padding: 20px 18px; }
}
@media (prefers-reduced-motion: reduce) {
    #panelRight, #panelRight *, #panelRight *::after { animation: none !important; transition: none !important; scroll-behavior: auto; }
}
/* Client-facing work updates; source/contract details live in the dossier. */
#panelRight .companion-work { padding: 22px 4px; }
#panelRight .companion-work h2, #panelRight .companion-component h2 { font: 34px/1.15 Georgia, serif; color: #f7f3ec; margin: 12px 0 20px; }
#panelRight .companion-work-card { margin: 14px 0; padding: 20px; border: 1px solid #ffffff18; border-left: 3px solid #e9bb72; border-radius: 16px; background: #ffffff05; }
#panelRight .companion-work-card.is-done { border-left-color: #80d9c1; }
#panelRight .companion-work-card h3 { font-size: 21px; line-height: 1.3; margin: 10px 0; color: #f5f2eb; }
#panelRight .companion-work-card p, #panelRight .companion-component p { font-size: 15px; line-height: 1.6; color: #bdc9cc; }
#panelRight .companion-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
#panelRight .companion-work button, #panelRight .companion-component button { border: 1px solid #91d6c744; background: #91d6c70d; color: #b9efe0; padding: 10px 13px; border-radius: 10px; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1.4; }
#panelRight .companion-conversation-history > summary { cursor: pointer; color: #a4b6bd; padding: 12px 0; font-size: 13px; }
#panelRight .companion-work button:hover, #panelRight .companion-component button:hover { background: #91d6c725; }
#panelRight .companion-work button:focus-visible, #panelRight .companion-component button:focus-visible { outline: 2px solid #b9efe0; outline-offset: 3px; }
#panelRight .companion-update-note, #panelRight .companion-action-status { font-size: 13px; line-height: 1.6; color: #a4b6bd; }
#panelRight .companion-component { padding: 24px; }
#panelRight .companion-source { margin-top: 16px; padding: 12px; border: 1px solid #ffffff20; border-radius: 10px; }
#panelRight .companion-source pre { max-height: 320px; overflow: auto; font-size: 12px; white-space: pre; }
#panelRight .msg.user { margin-left: 35px; }
#panelRight .msg.user .msg-name { text-align: right; color: #dce7ee; }
#panelRight .msg.assistant .msg-name { color: #98dec9; letter-spacing: .03em; }
.companion-hierarchy ul { list-style: none; margin: 12px 0; padding-left: 14px; border-left: 1px solid #8ddac633; }
.companion-hierarchy > ul { padding-left: 0; border: 0; }
.companion-element { margin: 9px 0; padding: 10px; background: #ffffff04; border: 1px solid #ffffff13; border-radius: 10px; }
.companion-element > summary { cursor: pointer; font-size: 15px; color: #e9f4f0; }
.companion-element > summary small { display: inline-block; margin-left: 8px; font-size: 11px; color: #93cdbc; }
.companion-element > summary:focus-visible { outline: 2px solid #93cdbc; outline-offset: 4px; }
#panelRight .companion-work-card:not(.is-done) { background: #45341e; border-color: #dba35477; border-left-color: #f0bf72; }
#panelRight .companion-work-card.is-done { background: #18332f; border-color: #76cbb333; }
#panelRight .companion-work button[data-companion-action="finish"] { background: #f0bf72; color: #271b0b; border-color: #f0bf72; font-size: 15px; padding: 12px 18px; }
#panelRight .companion-work button:disabled { opacity: .55; cursor: wait; }
#panelRight .companion-technical { margin-top: 14px; color: #aabbb7; font-size: 12px; }
#componentsList .sidebar-component-folder { margin: 4px 0; }
#componentsList .sidebar-component-folder > summary { cursor: pointer; padding: 2px 6px; color: #e6f3ee; border-radius: 7px; background: #6bc9b50d; font-size: 13px; }
#componentsList .sidebar-component-folder small { float: right; color: #90b8aa; font-size: 10px; }
#componentsList .sidebar-component-folder ul { list-style: none; padding-left: 8px; margin: 2px 0 4px 7px; border-left: 1px solid #8dcbb32b; }
#componentsList .sidebar-component-folder li { padding: 0; }
#componentsList .sidebar-component-folder li summary { cursor: pointer; }
#componentsList .sidebar-component-folder button { display: inline-flex; align-items: center; gap: 6px; vertical-align: middle; width: calc(100% - 18px); min-height: 32px; color: #c5d9d0; border: 0; background: transparent; text-align: left; padding: 5px 4px; font: inherit; font-size: 12px; cursor: pointer; max-width: 100%; }
#componentsList .sidebar-component-folder button span { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#componentsList .sidebar-component-folder button small { float: none; flex: none; max-width: 38%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: .7; font-size: 9px; }
#componentsList .sidebar-component-folder > summary button { color: #e6f3ee; font-weight: 600; font-size: 13px; }
#componentsList .sidebar-element-leaf { padding-left: 18px !important; }
#componentsList .sidebar-element-leaf > button { width: 100%; }
#componentsList .sidebar-component-folder button:hover { background: #92d7bf17; border-radius: 5px; }
#componentsList .sidebar-component-folder button:focus-visible, #componentsList .sidebar-component-folder summary:focus-visible { outline: 2px solid #92d7bf; }
#componentsList .sidebar-map-note { color: #9babaa; font-size: 11px; padding: 4px 12px; }
#componentsList .sidebar-purpose { margin: 4px 12px 8px; color: #9babaa; font-size: 11px; }
#componentsList .sidebar-purpose > summary { padding: 6px 0; cursor: pointer; }
#sidebarElementInspector { position: fixed; left: min(300px, 18vw); top: 90px; width: min(590px, calc(100vw - 40px)); max-height: calc(100dvh - 120px); overflow: auto; z-index: 1500; padding: 22px; box-sizing: border-box; border: 1px solid #78cdb566; border-radius: 18px; background: #162324; color: #edf7f2; box-shadow: 0 20px 70px #0009; }
#sidebarElementInspector header { display:flex; justify-content:space-between; align-items:start; gap:16px; }
#sidebarElementInspector h2 { margin:6px 0; font-size:23px; }
#sidebarElementInspector small, #sidebarElementInspector p { color:#a7c4bd; font-size:13px; line-height:1.5; }
#sidebarElementInspector button { background:#ffffff08; border:1px solid #ffffff22; border-radius:8px; padding:9px 12px; color:inherit; cursor:pointer; }
#sidebarElementInspector button[aria-pressed=true] { background:#70c7ac; color:#102b23; }
#sidebarElementInspector nav { display:flex; gap:6px; flex-wrap:wrap; }
#sidebarElementInspector pre { overflow:auto; max-height:42vh; background:#0b1718; padding:16px; border-radius:9px; font-size:13px; }
#sidebarElementInspector [hidden] { display:none; }
#sidebarElementInspector button:focus-visible { outline:2px solid #b0f6df; outline-offset:2px; }
#sidebarElementHighlight { pointer-events:none; z-index:1400; outline:3px solid #30d4ba; outline-offset:3px; box-shadow:0 0 0 7px #30d4ba22; border-radius:5px; }
@media(max-width:650px) { #sidebarElementInspector { left:20px; top:65px; } }

/* Keep the semantic navigator legible without covering the command surface. */
#sidebarElementInspector { top: 64px; bottom: 104px; max-height: calc(100dvh - 168px); height: fit-content; width: min(480px, calc(100vw - 40px)); padding: 18px; }
#sidebarElementInspector button[data-close-element] { border: 0; background: transparent; padding: 0 4px; font-size: 26px; line-height: 1; color: #a7c4bd; }
#sidebarElementInspector .source-context { margin: 8px 0 14px; font-size: 12px; color: #a7c4bd; }
#sidebarElementInspector .source-context summary { cursor: pointer; }
#sidebarElementInspector textarea { display: block; box-sizing: border-box; width: 100%; height: clamp(120px, 28vh, 320px); resize: vertical; border: 1px solid #8dcbb32b; border-radius: 8px; background: #0b1718; color: #e2eee8; padding: 12px; margin-bottom: 12px; font: 12px/1.6 Consolas, monospace; tab-size: 2; }
#sidebarElementInspector button[data-save-source] { background: #70c7ac; color: #102b23; font-weight: 600; }
#sidebarElementInspector button:disabled { opacity: .4; cursor: default; }
#sidebarElementInspector [data-source-status]:empty { display: none; }
.semantic-overview { padding: 10px 8px 12px; border-bottom: 1px solid #8dcbb324; margin-bottom: 8px; }
.semantic-overview p { font-size: 12px; line-height: 1.6; color: #bed2cb; margin: 8px 0; }
.semantic-status { display: inline-block; color: #a5e6d0; background: #69cbae14; border: 1px solid #69cbae33; padding: 3px 7px; border-radius: 20px; font-size: 10px; }
.semantic-overview dl { margin: 8px 0; }
.semantic-overview dt { color: #96b6aa; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; margin-top: 10px; }
.semantic-overview dd { margin: 3px 0; display: flex; gap: 4px; flex-wrap: wrap; font-size: 11px; color: #91a59c; }
#componentsList .semantic-overview dd button { width: auto; min-height: 28px; padding: 4px 7px; border-radius: 7px; background: #8dcbb312; }
#componentsList .semantic-overview > small { float: none; display: block; font-size: 10px; line-height: 1.5; color: #849b91; }