/* Prototype 3: a walkable stage with readable conversations and a full-size book. */
#conversation{z-index:70}
#conversation-link{position:fixed;inset:0;width:100vw;height:100dvh;z-index:69;pointer-events:none;overflow:visible}
#conversation-link path{fill:none;stroke:#edd09b;stroke-width:2.5;filter:drop-shadow(0 2px 3px #182d3b)}
#conversation-link circle{fill:#edd09b;stroke:#304b58;stroke-width:2}
#conversation:not(.spellbook){width:min(510px,calc(100vw - 32px));border-radius:20px;max-height:calc(100dvh - 220px)}
#conversation:not(.spellbook) .conversation-layout{max-height:calc(100dvh - 330px)}
.object-label:hover,.object-label:focus-visible{border-color:#b9e4ee;background:#426c7a}
.object-label.npc-label{max-width:135px;font-size:10px}
.object-label.stair-label{max-width:135px;overflow-wrap:anywhere;font-size:10px;padding:6px 8px}
#crosshair{position:fixed;left:50%;top:50%;width:5px;height:5px;border:1px solid #ead4a8;border-radius:50%;transform:translate(-50%,-50%);z-index:7;pointer-events:none;background:#223b4933}
.spellbook .doc-text{color:#314c59;font-size:16px;line-height:1.9;max-width:78ch}
@media(max-width:760px){.spellbook .doc-text{font-size:14px}}
@media(max-width:760px){#world-actions button{font-size:9px;padding:9px 8px}}
body:has(#conversation[open]) #object-labels,body:has(#conversation.spellbook[open]) #nearby-hint{visibility:hidden}
body:has(#conversation[open]) #rich-tooltip{visibility:hidden}
.edge-shade{background:linear-gradient(180deg,#182b4266,transparent 25%,transparent 80%,#182b4255)}
.world-header{background:#253d49ed}.breadcrumbs{background:#314b57df}
#nearby-hint{position:fixed;z-index:10;bottom:78px;left:50%;transform:translateX(-50%);padding:9px 18px;border:1px solid #dbc39877;border-radius:24px;background:#243c48e8;color:#f3dfb9;font-size:12px;max-width:92vw;text-align:center;pointer-events:none}
.object-label{font-size:11px;background:#2a4451e6;border-radius:7px;max-width:190px;white-space:normal;text-align:center;padding:7px 11px;box-shadow:0 4px 16px #14263333}
.object-label.near{background:#ead1a0;color:#283d46;border-color:#ffedc9}
#conversation:not(.spellbook){position:fixed;inset:145px 22px auto auto;margin:0;width:min(640px,calc(100vw - 44px));border-radius:20px 20px 20px 4px;max-height:calc(100dvh - 250px);border:2px solid #d8c293;background:#304c59}
#conversation:not(.spellbook) .conversation-layout{display:block;min-height:0;max-height:calc(100dvh - 354px);overflow:auto}
#conversation:not(.spellbook) .conversation-layout aside{padding:12px 22px;border:0;background:#29434e}
#conversation:not(.spellbook) .conversation-layout .answer{overflow:visible;padding:20px 25px}
#conversation:not(.spellbook) .conversation-header{padding:17px 24px;background:#3a5662}
.conversation-header .overline{font-size:10px;letter-spacing:1px;color:#e2c79b}
.topic-note{margin:0;font-size:11px;color:#bdd0ca}
#conversation:not(.spellbook):has(.topic-note) aside{display:none}
#conversation.spellbook{position:fixed;inset:3dvh 3vw;margin:0;width:94vw;height:94dvh;max-width:none;max-height:none;border:8px solid #766047;border-radius:15px;background:#ede3c9;color:#253e4b;box-shadow:0 0 0 100vmax #152937ba,0 20px 80px #122838}
.spellbook .conversation-header{background:#ded0ac;color:#294452;padding:15px 27px;border-bottom:1px solid #a7926d}
.spellbook .conversation-header h2{font-family:Georgia,serif;font-size:30px;margin:2px 0}
.spellbook .conversation-header button{color:#354e59}.spellbook .overline{color:#6d644b}.spellbook #page-count{font:12px Consolas,monospace;color:#666550}
#book-pages{display:flex;align-items:center;gap:20px;justify-content:space-between;height:48px;padding:0 25px;background:#d9c9a1;border-bottom:1px solid #a7926d}
#book-pages button{padding:7px 14px;background:#355160;color:#f2e3bd;border-radius:3px;font-size:12px}#book-pages button:disabled{opacity:.4;cursor:default}#book-topic{font:12px Consolas,monospace}
.spellbook .conversation-layout{grid-template-columns:280px 1fr;height:calc(94dvh - 154px);max-height:none;min-height:0}
.spellbook .conversation-layout aside{background:#e1d5b6;border-right:3px solid #b29d78;padding:16px;box-shadow:inset -8px 0 14px #7f6b4d22}
.spellbook .conversation-layout .answer{padding:24px 34px;background:linear-gradient(90deg,#cab98f33,#f4ebd5 4%,#eee3c8);overflow:auto}
.spellbook #questions button{color:#344e58;border-color:#9b8b6e66;padding:10px}.spellbook #questions button:hover,.spellbook #questions button[aria-current]{background:#c9b98f;color:#253c45}
.spellbook #desk-context{color:#695c45}.spellbook #desk-context select{background:#f1e7ce;color:#314854;border-color:#a59778}
.spellbook .answer h3{font-family:Georgia,serif;font-size:28px}.spellbook .answer p{color:#41525a}.spellbook .query-code{background:#f7efdb;border:1px solid #aa9873;color:#233d4a;font-size:14px;line-height:1.75;box-shadow:inset 3px 0 #ac8c53}
.spellbook .source-note{color:#7a6344}.spellbook .page-turn{animation:turn-leaf .38s ease-out;transform-origin:left center}
@keyframes turn-leaf{from{transform:perspective(1200px) rotateY(-12deg);opacity:.3}to{transform:none;opacity:1}}
#directory-items .search-result{text-align:left;font:12px 'Segoe UI',sans-serif;border:1px solid #a2bcba40;padding:11px 13px;background:#314c57}
@media(max-width:760px){#nearby-hint{bottom:88px;font-size:10px;padding:8px 12px}.object-label{font-size:9px;max-width:120px;padding:5px 7px}#conversation:not(.spellbook){inset:125px 10px auto;width:calc(100vw - 20px);max-height:calc(100dvh - 230px)}#conversation:not(.spellbook) .conversation-layout{max-height:calc(100dvh - 330px)}#conversation.spellbook{inset:1dvh 2vw;width:96vw;height:98dvh;border-width:4px}.spellbook .conversation-header{padding:12px 16px}.spellbook .conversation-header h2{font-size:22px}.spellbook .conversation-layout{display:flex;flex-direction:column;height:calc(98dvh - 150px);overflow:hidden}.spellbook .conversation-layout aside{max-height:145px;flex-shrink:0;border-right:0;border-bottom:1px solid #a59778;padding:10px}.spellbook .conversation-layout .answer{padding:18px;overflow:auto;flex:1;min-height:0}.spellbook #questions{display:flex;flex-direction:column}.spellbook #questions button{padding:7px;font-size:11px}.spellbook #desk-context{margin-bottom:8px}.spellbook #desk-context select{display:inline;width:auto;margin:0 0 0 8px;padding:4px}.spellbook .query-code{font-size:12px;padding:12px}.spellbook .answer h3{font-size:23px}#book-pages{padding:0 12px;gap:6px}#book-pages button{font-size:10px;padding:8px}.brand small{display:none}}
@media(prefers-reduced-motion:reduce){.spellbook .page-turn{animation:none}}
.place,.breadcrumbs{display:none}
#speaker-portrait{width:78px;height:auto;aspect-ratio:4/5;object-fit:cover;flex:none;border:1px solid #d8c293;border-radius:10px;background:#42606d}
#touch-controls{display:none;position:fixed;right:12px;bottom:130px;z-index:22;text-align:center;touch-action:none}
#touch-controls button{min-width:35px;height:35px;margin:2px;background:#294754e8;border:1px solid #a6c3c5;border-radius:7px;color:#eaddbc;font-size:16px;touch-action:none}
#touch-interact{font-size:10px!important}
#directory-items .result-action{display:block;margin-top:8px;color:#f0d39e;font:11px 'Segoe UI',sans-serif}
#directory-items .result-preview{font:12px/1.6 'Segoe UI',sans-serif;color:#c5d8cf;margin:5px 0}
@media(max-width:760px){#touch-controls{display:block}#speaker-portrait{width:54px;height:auto;aspect-ratio:4/5;}.conversation-header{gap:12px!important}.object-label{max-width:150px;font-size:9px}}

/* Stable reading surface: header remains visible while answers scroll independently. */
#conversation:not(.spellbook){display:flex;flex-direction:column;max-height:calc(100dvh - 190px)}
#conversation:not(.spellbook):not([open]){display:none}
#conversation:not(.spellbook) .conversation-header{flex:none}
#conversation:not(.spellbook) .conversation-layout{display:flex;flex-direction:column;min-height:0;overflow:hidden;max-height:calc(100dvh - 320px)}
#conversation:not(.spellbook) .conversation-layout aside{flex:none;max-height:140px;overflow:auto}
#conversation:not(.spellbook) .conversation-layout .answer{overflow:auto;min-height:0;overscroll-behavior:contain;padding:22px 28px}
#conversation:not(.spellbook) .doc-text{font-size:16px;line-height:1.85;max-width:66ch}
#conversation .answer{scrollbar-gutter:stable}
#close-conversation{min-width:40px;min-height:40px;flex:none}
#directory-items .search-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.search-actions button{padding:9px 12px;border:1px solid #d6bd8b66;background:#d9c197;color:#223e46;border-radius:4px;font-size:12px}
.search-actions button+button{background:#3a5966;color:#f0e4c8}
.result-title{font-weight:600;font-size:14px;line-height:1.5}
@media(max-width:760px){#conversation:not(.spellbook){max-height:calc(100dvh - 190px)}#conversation:not(.spellbook) .conversation-layout{max-height:calc(100dvh - 300px)}#conversation:not(.spellbook) .conversation-layout .answer{padding:18px 20px}#conversation:not(.spellbook) .doc-text{font-size:15px}#conversation:not(.spellbook) .conversation-header{padding:12px 16px}}
