
:root{--bg:#dce5ea;--paper:#f9fbfc;--p2:#edf3f5;--ink:#17242d;--muted:#647680;--line:#c4d0d7;--a:#176f78;--a2:#355f7d;--good:#2e7654;--warn:#a56a2d;--bad:#a1454f;--shadow:0 16px 42px rgba(22,39,51,.12);--grid:rgba(50,80,100,.06)}
body[data-theme=light]{--bg:#f4f7f8;--paper:#fff;--p2:#f2f6f8}body[data-theme=dark]{--bg:#11181e;--paper:#182229;--p2:#202c34;--ink:#eef4f6;--muted:#a8b5bc;--line:#354650;--a:#72c8ca;--a2:#85bdd4;--good:#7ac99f;--warn:#e1aa66;--bad:#ee9098;--shadow:0 16px 42px rgba(0,0,0,.3);--grid:rgba(150,210,225,.05)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Georgia,"Times New Roman",serif}button,input,textarea,select{font:inherit}button{background:var(--a);color:#fff;border:1px solid var(--a);border-radius:9px;padding:.62rem .78rem;cursor:pointer}.quiet{background:transparent;color:var(--ink);border-color:var(--line)}input,textarea,select{background:var(--p2);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:.6rem}textarea{width:100%;resize:vertical}.topbar{display:flex;justify-content:space-between;align-items:end;gap:1rem;padding:1rem 1.3rem;background:var(--paper);border-bottom:1px solid var(--line)}.topbar h1{margin:.15rem 0;font-size:1.45rem}.top-actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.eyebrow{font-family:Arial,sans-serif;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--a);font-weight:700}.pill{font-family:Arial,sans-serif;font-size:.61rem;border:1px solid var(--line);border-radius:999px;padding:.35rem .5rem;color:var(--muted);background:var(--p2)}.boundary{padding:.48rem 1.3rem;background:color-mix(in srgb,var(--warn) 8%,var(--paper));border-bottom:1px solid var(--line);font-size:.84rem}.view{display:none}.view.active{display:block}.entry-main,.composer-main{max-width:1760px;margin:auto;padding:1rem 1.3rem 3rem}.hero{margin:.35rem 0 1rem}.hero h2{margin:.15rem 0;font-size:1.75rem}.hero p,.muted{color:var(--muted);line-height:1.45}.panel{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:1rem}.panel-head{display:flex;justify-content:space-between;gap:1rem;align-items:start}.panel-head h3{margin:.15rem 0}.domain-tabs{display:flex;gap:.45rem;margin-bottom:.8rem}.domain-tabs button{background:var(--paper);color:var(--ink);border-color:var(--line)}.domain-tabs button.active{background:var(--a);color:#fff}.entry-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.workflow-cards{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.workflow-card{background:var(--p2);color:var(--ink);border-color:var(--line);text-align:left;min-height:130px}.workflow-card b{display:block;margin:.18rem 0}.workflow-card span{display:block;color:var(--muted);font-size:.82rem;line-height:1.4}.row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.7rem}.row.no-top{margin-top:0}.ontology-entry{margin-top:1rem}.compact-list{display:flex!important;flex-wrap:wrap;gap:.4rem;max-height:none!important}.definition-card{margin-top:.7rem;border:1px solid var(--line);background:var(--p2);border-radius:9px;padding:.75rem;line-height:1.45}
.intent-shell{position:sticky;top:0;z-index:100;background:var(--paper);border-bottom:1px solid var(--line);padding:.72rem 1.3rem;box-shadow:0 8px 18px rgba(0,0,0,.08)}.intent-top{display:flex;justify-content:space-between;gap:1rem;align-items:center}.intent-title{font-weight:700}.intent-ribbon{display:flex;align-items:flex-start;gap:.28rem;overflow:auto;padding:.7rem 0 .5rem}.ribbon-node{min-width:165px;max-width:215px;border:1px solid var(--line);background:var(--p2);border-radius:10px;padding:.55rem;cursor:pointer}.ribbon-node.pass{border-color:var(--good)}.ribbon-node.unresolved{border-color:var(--warn);background:color-mix(in srgb,var(--warn) 8%,var(--paper))}.ribbon-node.wall{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 8%,var(--paper))}.ribbon-node:hover,.ribbon-node.selected{outline:2px solid color-mix(in srgb,var(--a) 28%,transparent)}.ribbon-status{font-family:Arial,sans-serif;font-size:.53rem;text-transform:uppercase;color:var(--muted);line-height:1.25}.ribbon-node b{display:block;font-size:.82rem;margin:.2rem 0}.ribbon-terms{display:flex;gap:.25rem;flex-wrap:wrap}.ribbon-term{font-family:Arial,sans-serif;font-size:.52rem;border:1px solid var(--line);border-radius:999px;padding:.2rem .3rem;color:var(--a);background:var(--paper)}.ribbon-arrow{align-self:center;color:var(--muted);font-size:1.3rem;padding-top:1.25rem}.branch-stack{display:flex;flex-direction:column;gap:.25rem;min-width:180px}.branch-label{font-family:Arial,sans-serif;font-size:.55rem;text-transform:uppercase;color:var(--a2)}.inquiry-line{display:flex;align-items:center;gap:.7rem;border-top:1px solid var(--line);padding-top:.45rem;font-size:.82rem;color:var(--muted)}.ask-inline{display:grid;grid-template-columns:minmax(280px,1fr) auto;gap:.35rem;flex:1}
.composer-grid{display:grid;grid-template-columns:285px minmax(0,1fr) 330px;gap:.8rem;align-items:start}.ontology-panel,.inspector-panel{position:sticky;top:145px;max-height:calc(100vh - 160px);overflow:auto}.ontology-panel input{width:100%;margin:.5rem 0}.ontology-list{display:flex;flex-direction:column;gap:.35rem;max-height:650px;overflow:auto}.ontology-item{border:1px solid var(--line);background:var(--p2);border-radius:8px;padding:.5rem .58rem;cursor:pointer}.ontology-item:hover{border-color:var(--a)}.ontology-item b{display:block}.ontology-item small{display:block;color:var(--muted);font-size:.7rem;margin-top:.15rem}.center-panel{min-height:760px}.center-head{display:flex;justify-content:space-between;align-items:start;gap:1rem}.center-head h2{margin:.15rem 0}.surface-tabs{display:flex;gap:.35rem;flex-wrap:wrap;margin:.8rem 0;border-bottom:1px solid var(--line);padding-bottom:.6rem}.surface-tabs button{background:var(--p2);color:var(--ink);border-color:var(--line)}.surface-tabs button.active{background:var(--a);color:#fff}.inspector-body{line-height:1.5}.divider{height:1px;background:var(--line);margin:1rem 0}.guide-message,.answer-box{padding:.6rem;background:var(--p2);border:1px solid var(--line);border-radius:8px;color:var(--muted);line-height:1.4}.question-list{display:flex;flex-direction:column;gap:.3rem;margin-top:.6rem}.question-list button{background:var(--p2);color:var(--ink);border-color:var(--line);text-align:left;font-size:.78rem}.ask-row{display:grid;grid-template-columns:1fr auto;gap:.35rem;margin-top:.6rem}.prebuild-summary{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.callout{border:1px solid var(--line);background:var(--p2);border-radius:9px;padding:.75rem}
.flow{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}.flow-node{min-width:155px;max-width:220px;border:1px solid var(--line);background:var(--p2);border-radius:9px;padding:.65rem;cursor:pointer}.flow-node small{display:block;color:var(--muted);font-family:Arial,sans-serif;font-size:.57rem;margin-top:.25rem}.flow-arrow{color:var(--muted)}.branch-map{display:flex;flex-direction:column;gap:.7rem}.branch-row{display:grid;grid-template-columns:220px 65px minmax(220px,1fr);gap:.5rem;align-items:center}.branch-box{border:1px solid var(--line);background:var(--p2);border-radius:9px;padding:.65rem;cursor:pointer}.branch-box.wall{border-color:var(--bad)}.gov-label{font-family:Arial,sans-serif;font-size:.57rem;text-transform:uppercase;color:var(--a);font-weight:700}
.language-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.term-card{border:1px solid var(--line);background:var(--p2);border-radius:9px;padding:.65rem;cursor:pointer}.term-card p{color:var(--muted);font-size:.84rem}.bom-table{width:100%;border-collapse:collapse;font-family:Arial,sans-serif;font-size:.78rem}.bom-table th,.bom-table td{border-bottom:1px solid var(--line);padding:.55rem;text-align:left;vertical-align:top}.bom-table th{color:var(--muted);font-size:.68rem;text-transform:uppercase}.bom-status{font-size:.58rem;border:1px solid var(--line);border-radius:999px;padding:.22rem .35rem}.bom-status.unresolved{border-color:var(--warn)}.bom-status.declared{border-color:var(--good)}
.cross-head{display:flex;justify-content:space-between;gap:.6rem}.cross-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:.8rem}.cross-grid-wrap{overflow:auto;padding:.4rem}.cross-grid{display:grid;grid-template-columns:repeat(18,28px);grid-auto-rows:28px;gap:1px;width:max-content;background:var(--line);border:1px solid var(--line)}.cross-cell{width:28px;height:28px;background:var(--paper);position:relative;display:grid;place-items:center;font-family:Arial,sans-serif;font-size:.82rem}.cross-cell.block{background:var(--ink)}.cross-cell.active{outline:2px solid var(--a);z-index:2}.cell-num{position:absolute;left:2px;top:1px;font-size:.46rem;color:var(--muted)}.clue-panel{display:flex;flex-direction:column;gap:.6rem}.clue{border:1px solid var(--line);background:var(--p2);border-radius:8px;padding:.48rem;cursor:pointer;font-size:.82rem}.clue.active{border-color:var(--a)}.answer-status{font-family:Arial,sans-serif;font-size:.56rem;color:var(--muted);text-transform:uppercase}.word-bank{display:flex;flex-wrap:wrap;gap:.3rem}.word-chip{font-family:Arial,sans-serif;font-size:.64rem;border:1px solid var(--line);background:var(--p2);border-radius:999px;padding:.3rem .4rem}.cross-controls{display:flex;gap:.4rem;flex-wrap:wrap;margin:.6rem 0}.lesson{margin-top:.7rem;border-left:4px solid var(--a);padding:.65rem .75rem;background:color-mix(in srgb,var(--a) 7%,var(--paper));line-height:1.45}
.puzzle-top{display:flex;justify-content:space-between;gap:.8rem}.puzzle-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:.8rem}.puzzle-board{height:620px;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px),var(--p2);background-size:28px 28px}.piece,.socket{position:absolute;width:150px;height:150px;transform:translate(-50%,-50%);touch-action:none;user-select:none}.piece{cursor:grab;filter:drop-shadow(0 12px 16px rgba(0,0,0,.2))}.piece.dragging{z-index:10;filter:drop-shadow(0 20px 22px rgba(0,0,0,.3)) brightness(1.08)}.piece.locked{cursor:default}.socket{opacity:.14;pointer-events:none}.piece text{font-family:Arial,sans-serif;font-weight:700;font-size:8.4px;fill:var(--ink);text-anchor:middle;pointer-events:none}.piece .sub{font-size:6px;fill:var(--muted)}.focus-box{border:1px solid var(--warn);background:color-mix(in srgb,var(--warn) 8%,var(--paper));border-radius:9px;padding:.6rem}
#editOverlay{position:fixed;inset:0;background:rgba(0,0,0,.42);display:grid;place-items:center;z-index:300}.edit-card{width:min(760px,92vw);background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:1rem}.edit-card textarea{min-height:180px}.hidden{display:none!important}#toast{position:fixed;right:1rem;bottom:1rem;background:var(--ink);color:var(--paper);padding:.7rem .85rem;border-radius:9px;opacity:0;transition:.18s;pointer-events:none;z-index:400}#toast.show{opacity:1}
@media(max-width:1220px){.composer-grid{grid-template-columns:245px 1fr}.inspector-panel{grid-column:1/-1;position:static;max-height:none}.entry-grid,.cross-layout,.puzzle-wrap{grid-template-columns:1fr}}@media(max-width:820px){.topbar,.intent-top{flex-direction:column;align-items:start}.entry-grid,.workflow-cards,.composer-grid,.language-grid,.prebuild-summary{grid-template-columns:1fr}.ontology-panel{position:static;max-height:none}.intent-shell{position:static}.branch-row{grid-template-columns:1fr}.inquiry-line{align-items:stretch;flex-direction:column}.ask-inline{grid-template-columns:1fr auto}}


/* UI-006: ribbon lifecycle + independent workspace scrolling */
body.postbuild .composer-main{padding-top:.65rem}
.postbuild-bar{position:sticky;top:0;z-index:110;background:var(--paper);border-bottom:1px solid var(--line);padding:.52rem 1.3rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;box-shadow:0 5px 14px rgba(0,0,0,.06)}
.postbuild-summary{display:flex;align-items:center;gap:1rem;min-width:0}.postbuild-summary b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:620px}
.postbuild-counts{display:flex;gap:.35rem;flex-wrap:wrap}.count-chip{font-family:Arial,sans-serif;font-size:.6rem;border:1px solid var(--line);border-radius:999px;padding:.25rem .4rem;color:var(--muted);background:var(--p2)}.count-chip.warn{border-color:var(--warn)}
.postbuild-actions{display:flex;gap:.4rem;flex-wrap:wrap}
.workflow-drawer{position:fixed;inset:0;background:rgba(0,0,0,.36);z-index:350;display:grid;place-items:start center;padding-top:5vh}
.drawer-card{width:min(1500px,96vw);max-height:82vh;overflow:auto;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:1rem}
.drawer-head{display:flex;justify-content:space-between;align-items:start;gap:1rem}.drawer-head h3{margin:.15rem 0}.drawer-ribbon{max-height:60vh}
body.postbuild .ontology-panel,body.postbuild .inspector-panel{position:sticky;top:70px;max-height:calc(100vh - 84px);overflow:auto}
body.postbuild .center-panel{min-height:calc(100vh - 90px)}
body.postbuild .composer-grid{grid-template-columns:260px minmax(0,1fr) 315px}
body.postbuild .surface-tabs{position:sticky;top:61px;z-index:35;background:var(--paper);padding-top:.5rem}
.inspector-tabs{display:grid;grid-template-columns:1fr 1fr;gap:.35rem;margin-bottom:.75rem;position:sticky;top:0;background:var(--paper);padding-bottom:.45rem;z-index:5}
.inspector-tabs button{background:var(--p2);color:var(--ink);border-color:var(--line)}.inspector-tabs button.active{background:var(--a);color:white;border-color:var(--a)}
.inspector-pane{display:none}.inspector-pane.active{display:block}
.question-list button.selected-question{border-color:var(--a);box-shadow:0 0 0 2px color-mix(in srgb,var(--a) 12%,transparent)}
#answerBox,#inspectorTitle{scroll-margin-top:1rem}
body.postbuild .cross-layout{grid-template-columns:minmax(0,1.35fr) 320px}
body.postbuild .cross-grid{grid-template-columns:repeat(18,30px);grid-auto-rows:30px}
body.postbuild .cross-cell{width:30px;height:30px}
body.postbuild .puzzle-board{height:680px}
@media(max-width:1220px){body.postbuild .composer-grid{grid-template-columns:220px minmax(0,1fr)}body.postbuild .inspector-panel{grid-column:1/-1;position:static;max-height:none}.postbuild-bar{position:static}body.postbuild .surface-tabs{position:static}}
@media(max-width:820px){.postbuild-bar{flex-direction:column;align-items:flex-start}.postbuild-summary{align-items:flex-start;flex-direction:column}.postbuild-summary b{max-width:90vw}}


/* UI-007: explicit hover-preview / click-pin interaction */
.context-statebar{display:flex;justify-content:space-between;align-items:center;gap:.4rem;margin-bottom:.45rem;position:sticky;top:38px;background:var(--paper);z-index:4;padding:.2rem 0}
.context-mode{font-family:Arial,sans-serif;font-size:.56rem;letter-spacing:.06em;border:1px solid var(--line);border-radius:999px;padding:.25rem .4rem;color:var(--muted);background:var(--p2)}
.context-mode.pinned{border-color:var(--warn);color:var(--warn)}
button.tiny{padding:.28rem .42rem;font-size:.68rem}
.interaction-guide{border:1px solid var(--a);background:color-mix(in srgb,var(--a) 6%,var(--paper));border-radius:9px;padding:.65rem .75rem;margin:.55rem 0 .8rem;line-height:1.4}
.interaction-guide b{color:var(--a)}
.term-card.pinned,.ontology-item.pinned,.clue.pinned,.bom-table tr.pinned{outline:2px solid var(--warn);outline-offset:1px}
.term-card{position:relative}.pin-label{font-family:Arial,sans-serif;font-size:.54rem;border:1px solid var(--warn);border-radius:999px;padding:.2rem .3rem;color:var(--warn);float:right}
.local-tip{font-family:Arial,sans-serif;font-size:.64rem;color:var(--muted)}
.surface-intro{border:1px solid var(--line);background:var(--p2);border-radius:9px;padding:.65rem .75rem;margin-bottom:.7rem;line-height:1.4}

/* CrossGrid explicit answer controls */
.selected-clue-box{border:1px solid var(--a);background:color-mix(in srgb,var(--a) 5%,var(--paper));border-radius:10px;padding:.7rem;margin-bottom:.65rem}
.selected-clue-box h4{margin:.1rem 0 .35rem}.selected-clue-meta{font-family:Arial,sans-serif;font-size:.62rem;color:var(--muted);text-transform:uppercase}
.cross-answer-entry{display:grid;grid-template-columns:1fr auto;gap:.4rem;margin:.5rem 0}.cross-answer-entry input{width:100%}
.choice-list{display:grid;grid-template-columns:1fr 1fr;gap:.35rem}.choice-list button{background:var(--p2);color:var(--ink);border-color:var(--line);text-align:left;font-size:.76rem;padding:.48rem}
.choice-list button:hover{border-color:var(--a)}.choice-feedback{margin-top:.45rem;min-height:2.2rem;color:var(--muted);font-size:.8rem;line-height:1.35}
.cross-instruction{margin:.5rem 0;border-left:4px solid var(--a);padding:.55rem .7rem;background:color-mix(in srgb,var(--a) 5%,var(--paper))}

/* Jigsaw self-contained guidance */
.workflow-reminder{border:1px solid var(--line);background:var(--p2);border-radius:10px;padding:.65rem .75rem;margin:.5rem 0 .7rem}
.workflow-reminder .mini-flow{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.4rem}
.mini-flow span{font-family:Arial,sans-serif;font-size:.58rem;border:1px solid var(--line);border-radius:999px;padding:.23rem .34rem;color:var(--muted);background:var(--paper)}
.puzzle-progress{display:flex;justify-content:space-between;align-items:center;gap:.5rem;flex-wrap:wrap;margin:.55rem 0}
.progress-track{height:8px;background:var(--p2);border:1px solid var(--line);border-radius:999px;overflow:hidden;min-width:180px;flex:1}
.progress-fill{height:100%;background:var(--a);width:0}
.guide-next{border:1px solid var(--warn);background:color-mix(in srgb,var(--warn) 7%,var(--paper));border-radius:9px;padding:.6rem;margin:.55rem 0}
.piece.suggested svg{filter:drop-shadow(0 0 12px color-mix(in srgb,var(--warn) 75%,transparent)) brightness(1.08)}


/* UI-008: real-estate, local pinning, anchored branch context, CrossGrid feedback, Jigsaw provenance/reference */
.ontology-rail-label{display:none;font-family:Arial,sans-serif;text-transform:uppercase;letter-spacing:.09em;font-size:.58rem;font-weight:700;color:var(--a);writing-mode:vertical-rl;transform:rotate(180deg);align-items:center;gap:.5rem;cursor:default;height:100%;padding:.4rem 0}
.ontology-rail-label small{color:var(--muted);font-size:.48rem;font-weight:400}
body.postbuild .composer-grid{grid-template-columns:46px minmax(0,1fr) 315px}
body.postbuild .ontology-panel{width:46px;min-width:46px;padding:.45rem;overflow:hidden;z-index:70;transition:width .16s ease,padding .16s ease,box-shadow .16s ease;background:var(--paper)}
body.postbuild .ontology-panel .ontology-rail-label{display:flex}
body.postbuild .ontology-panel .ontology-panel-content{opacity:0;pointer-events:none;width:250px;position:absolute;left:14px;top:14px;transition:opacity .12s ease}
body.postbuild .ontology-panel:hover,body.postbuild .ontology-panel:focus-within{width:284px;padding:1rem;overflow:auto;box-shadow:var(--shadow)}
body.postbuild .ontology-panel:hover .ontology-rail-label,body.postbuild .ontology-panel:focus-within .ontology-rail-label{display:none}
body.postbuild .ontology-panel:hover .ontology-panel-content,body.postbuild .ontology-panel:focus-within .ontology-panel-content{opacity:1;pointer-events:auto;position:relative;left:auto;top:auto;width:auto}
.ontology-item.active-workflow-term{border-color:var(--a);background:color-mix(in srgb,var(--a) 7%,var(--p2))}.active-tag{font-family:Arial,sans-serif;font-size:.48rem;border:1px solid var(--a);color:var(--a);border-radius:999px;padding:.12rem .25rem;margin-left:.3rem;vertical-align:middle}
.local-pin-row{display:flex;justify-content:space-between;align-items:center;gap:.45rem;margin-top:.5rem}.local-pin-btn,.term-pin-btn{font-family:Arial,sans-serif;font-size:.62rem;padding:.3rem .42rem}.term-pin-btn.pinned,.local-pin-btn.pinned{background:var(--warn);border-color:var(--warn);color:white}
.term-card{position:relative}.term-card .term-card-actions{display:flex;justify-content:flex-end;margin-top:.45rem}
.branch-box{position:relative}.branch-term-row{display:flex;gap:.28rem;flex-wrap:wrap;margin-top:.45rem}.branch-term-chip{font-family:Arial,sans-serif;font-size:.58rem;padding:.25rem .34rem;background:var(--paper);color:var(--a);border-color:var(--line)}.branch-term-chip.selected{border-color:var(--warn);background:color-mix(in srgb,var(--warn) 10%,var(--paper))}.branch-object-actions{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.48rem}
.anchor-context{border-top:1px solid var(--line);margin-top:.65rem;padding-top:.6rem}.anchor-term-list{display:flex;gap:.3rem;flex-wrap:wrap;margin:.45rem 0}.anchor-term-list button{background:var(--p2);color:var(--ink);border-color:var(--line);font-size:.68rem;padding:.35rem .45rem}.anchor-term-list button.active{background:var(--a);border-color:var(--a);color:white}.anchor-term-detail{border:1px solid var(--line);border-radius:9px;padding:.65rem;background:var(--p2);margin-top:.55rem}.voice-btn{font-family:Arial,sans-serif;font-size:.63rem;padding:.31rem .45rem;background:transparent;color:var(--ink);border-color:var(--line)}
.cross-cell.filled-flash{animation:gridFlash 1.15s ease}.cross-cell.solved-letter{font-weight:700;background:color-mix(in srgb,var(--good) 12%,var(--paper))}@keyframes gridFlash{0%,100%{box-shadow:none}35%{box-shadow:inset 0 0 0 3px var(--good);background:color-mix(in srgb,var(--good) 24%,var(--paper))}}
.word-bank{max-height:170px;overflow:auto;padding:.35rem;border:1px solid var(--line);border-radius:8px;background:var(--paper)}.word-chip.active-answer{border-color:var(--a);color:var(--a);font-weight:700}.word-bank-note{font-size:.73rem;color:var(--muted);line-height:1.35;margin:.25rem 0 .45rem}.grid-populated-note{color:var(--good);font-weight:700}
.jigsaw-origin{border:1px solid var(--line);background:var(--p2);border-radius:10px;padding:.7rem;margin:.65rem 0}.jigsaw-origin-head{display:flex;justify-content:space-between;align-items:start;gap:.6rem}.jigsaw-origin h4{margin:.1rem 0}.origin-parts{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.5rem}.origin-part{background:var(--paper);color:var(--ink);border-color:var(--line);font-size:.68rem;padding:.4rem .5rem;text-align:left}.origin-part b{display:block}.origin-part small{display:block;color:var(--muted);font-size:.57rem}.origin-part:hover{border-color:var(--a)}
.puzzle-board-column{min-width:0}.puzzle-board-tools{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.45rem;padding:.45rem .55rem;border:1px solid var(--line);border-radius:9px;background:var(--p2)}.puzzle-board-tools p{margin:0;color:var(--muted);font-size:.76rem}.puzzle-board.reference-mode #pieces{opacity:.12}.reference-layer{position:absolute;inset:0;pointer-events:none;z-index:20}.reference-piece{position:absolute;width:150px;height:150px;transform:translate(-50%,-50%);filter:drop-shadow(0 8px 12px rgba(0,0,0,.18))}.reference-banner{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:30;background:var(--ink);color:var(--paper);border-radius:999px;padding:.38rem .65rem;font-family:Arial,sans-serif;font-size:.62rem;pointer-events:none}
.guide-next .voice-btn{margin-left:.3rem}.guided-audio-note{font-size:.7rem;color:var(--muted);margin-top:.35rem}
@media(max-width:1220px){body.postbuild .composer-grid{grid-template-columns:42px minmax(0,1fr)}body.postbuild .ontology-panel{width:42px;min-width:42px}.jigsaw-origin-head{flex-direction:column}.puzzle-board-tools{align-items:flex-start;flex-direction:column}}


/* UI-009 — local reactions, website-index ontology, more game real estate */
.composer-grid,
body.postbuild .composer-grid{
  grid-template-columns:minmax(0,1fr) 315px !important;
}

/* Ontology behaves like the website index: edge rail, overlay only, no grid column. */
.ontology-panel,
body.postbuild .ontology-panel{
  position:fixed !important;
  left:8px;
  top:154px;
  width:34px !important;
  min-width:34px !important;
  height:min(670px,calc(100vh - 172px));
  max-height:calc(100vh - 172px) !important;
  padding:.35rem !important;
  overflow:hidden !important;
  z-index:180;
  background:var(--paper);
  box-shadow:0 8px 22px rgba(0,0,0,.10);
  transition:width .16s ease,padding .16s ease,box-shadow .16s ease;
}
body.postbuild .ontology-panel{top:70px;height:calc(100vh - 84px);max-height:calc(100vh - 84px)!important}
.ontology-panel .ontology-rail-label{display:flex !important}
.ontology-panel .ontology-panel-content{
  opacity:0 !important;
  pointer-events:none !important;
  position:absolute !important;
  left:14px !important;
  top:14px !important;
  width:270px !important;
}
.ontology-panel:hover,
.ontology-panel:focus-within,
.ontology-panel.index-open{
  width:300px !important;
  padding:1rem !important;
  overflow:auto !important;
  box-shadow:var(--shadow);
}
.ontology-panel:hover .ontology-rail-label,
.ontology-panel:focus-within .ontology-rail-label,
.ontology-panel.index-open .ontology-rail-label{display:none !important}
.ontology-panel:hover .ontology-panel-content,
.ontology-panel:focus-within .ontology-panel-content,
.ontology-panel.index-open .ontology-panel-content{
  opacity:1 !important;
  pointer-events:auto !important;
  position:relative !important;
  left:auto !important;
  top:auto !important;
  width:auto !important;
}

/* The main workspace uses the recovered width. */
.composer-main{padding-left:3.25rem}
.center-panel{min-width:0}

/* Pre-build ribbon ontology terms react locally. */
.ribbon-term{
  cursor:help;
  position:relative;
}
.ribbon-term:hover{border-color:var(--a);background:color-mix(in srgb,var(--a) 8%,var(--paper))}
.ribbon-term-popover{
  position:fixed;
  z-index:320;
  width:min(370px,calc(100vw - 32px));
  max-height:min(460px,70vh);
  overflow:auto;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:13px;
  box-shadow:0 20px 44px rgba(0,0,0,.22);
  padding:.85rem 1rem;
  line-height:1.42;
}
.ribbon-term-popover h4{margin:.05rem 1.4rem .35rem 0}
.ribbon-term-popover p{margin:.45rem 0}
.ribbon-term-popover .popover-kicker{
  font-family:Arial,sans-serif;font-size:.58rem;text-transform:uppercase;
  letter-spacing:.08em;color:var(--a);font-weight:700
}
.popover-close{
  position:absolute;right:.45rem;top:.4rem;width:28px;height:28px;padding:0;
  border-radius:999px;background:var(--p2);color:var(--ink);border-color:var(--line)
}
.ribbon-term-popover .popover-note{
  border-left:3px solid var(--a);padding:.45rem .55rem;background:var(--p2);border-radius:5px
}

/* Candidate term bank is an input surface, not text to copy/paste. */
.word-chip{
  cursor:pointer;
  background:var(--p2);
  color:var(--ink);
}
button.word-chip:hover{border-color:var(--a);transform:translateY(-1px)}
.word-bank-note strong{color:var(--ink)}
.bank-loaded{
  margin-top:.35rem;padding:.38rem .48rem;border-radius:7px;
  background:color-mix(in srgb,var(--a) 8%,var(--paper));border:1px solid var(--line);
  font-size:.74rem
}

/* Voice is sparse: one optional explanation at a difficult transition, not everywhere. */
.voice-sparse{display:inline-flex;align-items:center;gap:.35rem;margin-left:.4rem}

/* Jigsaw challenge: temporary reference and mixed piece bundle. */
.puzzle-board-tools .peek-note{font-size:.72rem;color:var(--muted);margin:.15rem 0 0}
.reference-layer{opacity:0;transition:opacity .12s ease}
.reference-layer.peek-visible{opacity:1;background:color-mix(in srgb,var(--paper) 82%,transparent)}
.reference-layer.peek-visible .reference-piece{display:block}
.reference-piece{display:none}
.reference-banner{white-space:nowrap}
.piece{transform:translate(-50%,-50%) rotate(var(--rot,0deg)) !important;transition:filter .12s ease,transform .12s ease}
.piece.dragging{transform:translate(-50%,-50%) rotate(0deg) scale(1.02) !important}
.socket{opacity:.035 !important;transition:opacity .12s ease,filter .12s ease}
.socket.hot{opacity:.24 !important;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--a) 42%,transparent))}
.bundle-note{
  position:absolute;left:12px;bottom:10px;z-index:2;font-family:Arial,sans-serif;font-size:.58rem;
  color:var(--muted);background:color-mix(in srgb,var(--paper) 88%,transparent);padding:.3rem .42rem;border-radius:7px
}

@media(max-width:1220px){
  .composer-grid,body.postbuild .composer-grid{grid-template-columns:minmax(0,1fr)!important}
  .inspector-panel,body.postbuild .inspector-panel{grid-column:auto!important;position:static!important;max-height:none!important}
  .ontology-panel,body.postbuild .ontology-panel{top:84px}
}
@media(max-width:820px){
  .composer-main{padding-left:2.7rem}
  .ontology-panel,body.postbuild .ontology-panel{left:4px;width:30px!important;min-width:30px!important}
  .ontology-panel:hover,.ontology-panel:focus-within,.ontology-panel.index-open{width:min(290px,88vw)!important}
}


/* UI-010 — candidate BOM semantics + precise Jigsaw interaction */
.clarification-card{margin:.8rem 0;border:2px solid var(--bad);background:color-mix(in srgb,var(--bad) 6%,var(--paper));border-radius:12px;padding:.85rem}
.clarification-head{display:flex;justify-content:space-between;gap:.75rem;align-items:start}.clarification-head h3{margin:.15rem 0}
.status-dot{font-family:Arial,sans-serif;font-size:.6rem;border-radius:999px;padding:.3rem .45rem;border:1px solid currentColor;font-weight:700;white-space:nowrap}.status-dot.red{color:var(--bad)}
.auth-choice-row{display:flex;gap:.4rem;flex-wrap:wrap;margin:.55rem 0}.auth-choice-result{padding:.55rem .65rem;border-radius:8px;background:var(--p2);border:1px solid var(--line);line-height:1.4}

.bom-legend{display:flex;gap:.45rem;flex-wrap:wrap;align-items:center;margin:.6rem 0;padding:.55rem;border:1px solid var(--line);background:var(--p2);border-radius:9px}.bom-legend p{width:100%;margin:.15rem 0 0;color:var(--muted);font-size:.78rem}.legend-item{font-family:Arial,sans-serif;font-size:.6rem;border:1px solid currentColor;border-radius:999px;padding:.3rem .42rem}.legend-item.green{color:var(--good)}.legend-item.yellow{color:var(--warn)}.legend-item.red{color:var(--bad)}
.bom-status.green{color:var(--good);border-color:var(--good);background:color-mix(in srgb,var(--good) 8%,var(--paper))}.bom-status.yellow{color:var(--warn);border-color:var(--warn);background:color-mix(in srgb,var(--warn) 9%,var(--paper))}.bom-status.red{color:var(--bad);border-color:var(--bad);background:color-mix(in srgb,var(--bad) 8%,var(--paper))}.bom-gov{display:block;color:var(--muted);font-size:.58rem;margin-top:.18rem}

/* Only the painted jigsaw silhouette owns pointer hit-testing. */
.piece{pointer-events:none !important}
.piece svg{pointer-events:none}
.piece .piece-hit{pointer-events:visiblePainted;cursor:grab}
.piece.locked .piece-hit{cursor:default}
.piece .piece-highlight,.piece text{pointer-events:none !important}
.piece.staged{z-index:45!important;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--a) 55%,transparent)) drop-shadow(0 18px 18px rgba(0,0,0,.24))}
.piece.staged .piece-hit{stroke-width:3}
.ready-badge{display:inline-block;font-family:Arial,sans-serif;font-size:.62rem;font-weight:700;color:var(--a);border:1px solid var(--a);background:color-mix(in srgb,var(--a) 8%,var(--paper));border-radius:999px;padding:.28rem .42rem;margin-bottom:.35rem}
.origin-part:focus,.origin-part:active{outline:2px solid color-mix(in srgb,var(--a) 35%,transparent)}


/* UI-011 — context status parity, stable ribbon clouds, workflow-linked CrossGrid, landscape Jigsaw */
.context-status{display:flex;flex-direction:column;gap:.12rem;margin:.2rem 0 .7rem;padding:.48rem .58rem;border:1px solid currentColor;border-radius:9px;font-family:Arial,sans-serif}
.context-status b{font-size:.66rem;letter-spacing:.04em}.context-status span{font-size:.67rem;line-height:1.3;color:var(--muted)}
.context-status.green{color:var(--good);background:color-mix(in srgb,var(--good) 8%,var(--paper))}
.context-status.yellow{color:var(--warn);background:color-mix(in srgb,var(--warn) 9%,var(--paper))}
.context-status.red{color:var(--bad);background:color-mix(in srgb,var(--bad) 8%,var(--paper))}
.context-status.neutral{color:var(--a);background:var(--p2)}

.ribbon-term-popover{width:min(340px,calc(100vw - 32px));max-height:min(390px,64vh)}
.ribbon-term-popover .popover-plain{font-size:.93rem;margin:.25rem 0 .5rem}
.ribbon-term-popover .popover-more{padding:.35rem .5rem;margin-top:.5rem}
.ribbon-term-popover .popover-detail{border-top:1px solid var(--line);margin-top:.55rem;padding-top:.35rem}
.ribbon-term-popover .popover-pinned-note{font-size:.72rem}

.cross-workflow-strip{display:grid;grid-template-columns:minmax(220px,.85fr) minmax(0,2fr);gap:.65rem;align-items:start;border:1px solid var(--line);background:var(--p2);border-radius:10px;padding:.6rem;margin:.5rem 0 .7rem}
.cross-workflow-strip p{margin:.25rem 0 0;color:var(--muted);font-size:.78rem;line-height:1.35}
.cross-workflow-terms{display:flex;flex-wrap:wrap;gap:.35rem}
.cross-workflow-term{background:var(--paper);color:var(--ink);border-color:var(--line);text-align:left;padding:.38rem .48rem}
.cross-workflow-term b{display:block;font-size:.73rem}.cross-workflow-term small{display:block;font-size:.57rem;color:var(--muted);margin-top:.08rem}
.cross-workflow-term.green{border-color:var(--good)}.cross-workflow-term.yellow{border-color:var(--warn)}.cross-workflow-term.red{border-color:var(--bad)}

.jigsaw-command-row{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:.55rem;align-items:stretch;margin:.5rem 0}
.jigsaw-command-row .guide-next{margin:0;height:100%}
.jigsaw-inline-status{border:1px solid var(--line);border-radius:9px;background:var(--p2);padding:.58rem .65rem;line-height:1.35;min-height:80px}
.jigsaw-inline-status p{margin:.25rem 0;color:var(--muted);font-size:.78rem}
.puzzle-wrap.landscape{display:block}
.puzzle-board.landscape-board{height:500px!important;min-height:500px;width:100%}
.puzzle-board-column{width:100%}

@media(max-width:1100px){.cross-workflow-strip,.jigsaw-command-row{grid-template-columns:1fr}.puzzle-board.landscape-board{height:540px!important}}


/* UI-012 — explicit Status value color emphasis */
.context-status{
  gap:.24rem !important;
  padding:.56rem .62rem !important;
}
.context-status .context-status-label{
  font-family:Arial,sans-serif;
  font-size:.54rem;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:700;
}
.context-status .context-status-value{
  display:inline-flex;
  align-self:flex-start;
  border:1px solid currentColor;
  border-radius:999px;
  padding:.28rem .46rem;
  font-family:Arial,sans-serif;
  font-size:.67rem;
  line-height:1;
  font-weight:800;
  letter-spacing:.025em;
}
.context-status .context-status-note{
  font-size:.67rem;
  line-height:1.35;
  color:var(--muted);
}
.context-inline-status{
  display:inline-flex;
  border:1px solid currentColor;
  border-radius:999px;
  padding:.24rem .38rem;
  font-family:Arial,sans-serif;
  font-size:.61rem;
  font-weight:800;
}
.context-inline-status.red{color:var(--bad);background:color-mix(in srgb,var(--bad) 8%,var(--paper))}
.context-inline-status.yellow{color:var(--warn);background:color-mix(in srgb,var(--warn) 9%,var(--paper))}
.context-inline-status.green{color:var(--good);background:color-mix(in srgb,var(--good) 8%,var(--paper))}
.context-inline-status.neutral{color:var(--a);background:var(--p2)}

/* CrossGrid workflow projection must be visibly populated on entry. */
.cross-workflow-terms:empty::before{
  content:"Loading workflow terms…";
  color:var(--muted);
  font-size:.72rem;
}
.cross-workflow-term{
  transition:transform .10s ease,box-shadow .10s ease,background .10s ease;
}
.cross-workflow-term:hover{
  transform:translateY(-1px);
  box-shadow:0 3px 9px rgba(0,0,0,.08);
}
.cross-workflow-term.red{background:color-mix(in srgb,var(--bad) 7%,var(--paper))}
.cross-workflow-term.yellow{background:color-mix(in srgb,var(--warn) 8%,var(--paper))}
.cross-workflow-term.green{background:color-mix(in srgb,var(--good) 7%,var(--paper))}
.bank-loaded{min-height:2.1em}

/* =========================================================
   POST-LAUNCH DISCOVERY CORRECTIVE 001
   Local ontology reaction + complete CrossGrid/Jigsaw loops
   ========================================================= */
.ontology-entry .definition-card{display:none!important}
.ontology-entry .ontology-list{max-height:none;overflow:visible;gap:.5rem}
.entry-ontology-browser{display:flex;flex-direction:column}
.entry-ontology-row{display:grid;grid-template-columns:minmax(180px,24%) minmax(0,1fr);gap:1rem;border:1px solid var(--line);background:var(--p2);border-radius:10px;padding:.68rem .8rem;cursor:pointer;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;outline:none}
.entry-ontology-row:hover,.entry-ontology-row:focus-visible{border-color:var(--a);box-shadow:0 0 0 2px color-mix(in srgb,var(--a) 16%,transparent)}
.entry-ontology-row.selected{border-color:var(--a);background:color-mix(in srgb,var(--a) 6%,var(--p2));box-shadow:0 0 0 2px color-mix(in srgb,var(--a) 13%,transparent)}
.entry-ontology-term{padding-right:.75rem;border-right:1px solid var(--line);align-self:stretch;display:flex;flex-direction:column;justify-content:flex-start;gap:.18rem}
.entry-ontology-term b{font-size:.98rem;line-height:1.2}
.entry-ontology-term span{font-size:.67rem;line-height:1.35;color:var(--muted);text-transform:uppercase;letter-spacing:.045em}
.entry-ontology-copy{min-width:0}
.entry-plain{font-weight:700;font-size:.88rem;line-height:1.35;margin-bottom:.18rem}
.entry-definition{font-size:.78rem;line-height:1.48;color:var(--muted)}
.entry-ontology-expanded{display:none;margin-top:.65rem;padding-top:.65rem;border-top:1px solid var(--line)}
.entry-ontology-row.selected .entry-ontology-expanded{display:block}
.entry-ontology-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem .85rem}
.entry-ontology-detail-grid>div{background:color-mix(in srgb,var(--paper) 72%,transparent);border:1px solid color-mix(in srgb,var(--line) 76%,transparent);border-radius:7px;padding:.5rem .56rem}
.detail-label{display:block;font-family:Arial,sans-serif;font-size:.56rem;line-height:1.15;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:.22rem}
.entry-ontology-detail-grid p{margin:0;font-size:.75rem;line-height:1.42}
.entry-related{margin-top:.55rem}
.entry-related>div{display:flex;flex-wrap:wrap;gap:.3rem}
.related-term-chip{font-family:Arial,sans-serif;font-size:.63rem;padding:.27rem .45rem;border-radius:999px;background:var(--paper);color:var(--ink);border:1px solid var(--line)}
.related-term-chip:hover,.related-term-chip:focus-visible{border-color:var(--a);color:var(--a)}

.learning-completion{margin-top:1rem;border:1px solid color-mix(in srgb,var(--a) 60%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--a) 8%,var(--paper)),var(--paper));border-radius:12px;padding:1rem 1.05rem;box-shadow:0 12px 32px rgba(0,0,0,.08)}
.learning-completion.hidden{display:none}
.learning-completion h3{margin:.18rem 0 .38rem}
.learning-completion>p{margin:.25rem 0 .7rem;line-height:1.5}
.completion-kicker{font-family:Arial,sans-serif;font-size:.61rem;letter-spacing:.085em;text-transform:uppercase;color:var(--a);font-weight:700}
.completion-relations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin:.75rem 0}
.completion-relations>div{border:1px solid var(--line);background:var(--p2);border-radius:8px;padding:.56rem .62rem}
.completion-relations b{display:block;font-size:.76rem;margin-bottom:.16rem}
.completion-relations span{display:block;color:var(--muted);font-size:.72rem;line-height:1.4}
.completion-next{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.75rem;padding:.7rem;border-radius:9px;background:color-mix(in srgb,var(--a) 7%,var(--p2));border:1px solid color-mix(in srgb,var(--a) 30%,var(--line))}
.completion-next p{margin:.18rem 0 0;color:var(--muted);font-size:.75rem;line-height:1.4}
.completion-boundary{margin-top:.7rem;padding-top:.55rem;border-top:1px solid var(--line);color:var(--muted);font-size:.68rem;line-height:1.4}
.completion-term-strip{display:flex;flex-wrap:wrap;gap:.3rem;margin:.65rem 0}
.completion-term-strip span{border:1px solid var(--line);background:var(--p2);border-radius:999px;padding:.25rem .42rem;font-size:.65rem}
.completion-actions{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem}
.guide-next:has(.completion-kicker){border-color:color-mix(in srgb,var(--a) 60%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--a) 8%,var(--p2)),var(--p2))}
.answer-status{font-weight:700}
.clue:has(.answer-status){transition:border-color .15s ease,background .15s ease}

@media(max-width:900px){
 .entry-ontology-row{grid-template-columns:1fr;gap:.45rem}
 .entry-ontology-term{border-right:0;border-bottom:1px solid var(--line);padding:0 0 .45rem}
 .entry-ontology-detail-grid,.completion-relations{grid-template-columns:1fr}
 .completion-next{align-items:stretch;flex-direction:column}
}
