/* Section characters are part of the layout, never a floating obstruction. */
.section-guide{--guide-accent:#abdace;--guide-art-width:176px;--guide-scene-width:220px;position:relative;display:grid;grid-template-columns:var(--guide-scene-width) minmax(0,1fr);align-items:center;gap:28px;margin:22px 0 28px;padding:26px 28px;border:1px solid #b0d9e733;border-radius:24px;background:linear-gradient(110deg,#b0dfee13,#9b9ac105 72%),#152332b0;color:#e4edf2;isolation:isolate;overflow:hidden;box-shadow:inset 0 1px #ffffff12,0 12px 28px #04111d0c;transition:border-color .2s ease,box-shadow .2s ease}
.section-guide[hidden]{display:none}.section-guide:before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(480px circle at var(--pointer-x,15%) var(--pointer-y,0%),#c9eafb20,transparent 70%);opacity:.65;pointer-events:none}
.guide-scene{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate;padding:18px 0 5px;align-self:stretch;min-height:260px}.guide-aura{position:absolute;z-index:-1;inset:8% -2% 18%;border:1px solid #c9dfee25;border-radius:49% 49% 43% 43%;background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--guide-accent),transparent 87%),transparent 70%);transform:rotate(-9deg)}.guide-aura:after{content:'';position:absolute;inset:10% -8%;border:1px solid #b9d8ed18;border-radius:50%;transform:rotate(23deg)}
.guide-portrait{display:block;position:relative;width:var(--guide-art-width);height:calc(var(--guide-art-width)*1.2);flex-shrink:0;padding:0!important;background-size:400% 200%;border-radius:72px 72px 32px 32px;border:1px solid #dce8f34f!important;background-color:#233348;box-shadow:0 12px 28px #050b1b55,0 0 28px color-mix(in srgb,var(--guide-accent),transparent 92%);transition:transform .22s ease,filter .22s ease;cursor:pointer}
.guide-spark{position:absolute;right:2%;top:13%;font-size:28px;color:var(--guide-accent);pointer-events:none}.guide-touch-label{font-size:10px;color:#b4c8d6;letter-spacing:1px;margin-top:15px;line-height:1.8}.guide-body{min-width:0}.guide-identity{display:flex;flex-direction:column;gap:5px;min-width:0}.guide-label{color:#a9c6d1;font-size:9px;letter-spacing:1.6px;font-weight:700}.guide-identity strong{font-size:21px;letter-spacing:.3px;line-height:1.5}.guide-identity small{font-size:12px;color:#adc1cd;line-height:1.7}.guide-context{margin:13px 0 10px!important;max-width:820px;font-size:13px!important;line-height:1.8!important;color:#c5d6df!important}
.guide-speech{position:relative;min-height:53px;margin:10px 0 15px!important;padding:12px 15px!important;border-radius:3px 13px 13px;border:1px solid #b9d7e329;background:#08162348;color:#e2edf4!important;font-size:13px!important;line-height:1.8!important;overflow-wrap:anywhere}.guide-speech:before{content:'';position:absolute;left:-5px;top:12px;width:8px;height:8px;background:#192b39;border-left:1px solid #b9d7e329;border-bottom:1px solid #b9d7e329;transform:rotate(45deg)}
.guide-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.guide-primary,.guide-tip{min-height:44px;padding:11px 15px!important;border:1px solid #b9dacc48!important;border-radius:11px!important;background:#b2ddce18!important;color:#d4eee3!important;font-size:12px!important;font-weight:650;cursor:pointer;transition:background .18s ease,transform .18s ease;white-space:normal;line-height:1.6}.guide-primary:hover{background:#b2ddce30!important}.guide-tip{background:transparent!important;color:#c8d3e8!important;border-color:#b5c4df33!important}.guide-tip:hover{background:#b8cde21c!important}.guide-primary:active,.guide-tip:active{transform:translateY(1px)}
.guide-details{min-width:0;margin-top:3px}.guide-details summary{display:inline-flex;align-items:center;min-height:44px;padding:7px 0;color:#b6c9da;cursor:pointer;font-size:11px;list-style:none}.guide-details summary:after{content:'＋';margin-left:10px}.guide-details[open] summary:after{content:'−'}.guide-details ol{margin:1px 0 12px;padding:0 0 0 20px}.guide-details li{padding:5px 0;font-size:12px;line-height:1.9;color:#bccfd9}.guide-boundary{font-size:10px!important;color:#9bb0be!important;margin:0 0 12px!important;line-height:1.7!important}.guide-primary:focus-visible,.guide-tip:focus-visible,.guide-details summary:focus-visible{outline:2px solid #c7eadf;outline-offset:4px;border-radius:8px}
html[data-character-size="compact"] .section-guide{--guide-art-width:116px;--guide-scene-width:150px;gap:23px}html[data-character-size="compact"] .guide-scene{min-height:210px}html[data-character-size="large"] .section-guide{--guide-art-width:226px;--guide-scene-width:270px}html[data-character-size="large"] .guide-scene{min-height:320px}
.tool-card,.skill-card,.utility-tile,.cast-card,.race-link,.discovery-card{position:relative;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.tool-card:focus-within,.skill-card:focus-within,.race-link:focus-within,.discovery-card:focus-within{box-shadow:0 0 0 2px #b6d7d557}.utility-tile:focus-visible,.cast-card:focus-visible{outline:2px solid #b6ded8;outline-offset:4px}
@media (hover:hover) and (pointer: fine){body:not(.motion-paused):not(.page-hidden) .depth-pointing:not(.section-guide){transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-3px);box-shadow:0 12px 26px #04111c22,inset 0 0 0 1px #c9eaf231;background-image:radial-gradient(450px circle at var(--pointer-x,50%) var(--pointer-y,50%),#ccebf30b,transparent 60%)}.section-guide:hover{border-color:#b9dde84d;box-shadow:0 14px 34px #04111d20}.section-guide:hover .guide-portrait{transform:translateY(-2px) rotate(-2deg)}.guide-primary:hover{transform:translateY(-1px)}}

@media(hover:hover) and (pointer:fine){.section-guide:hover{border-color:#b9dde84d;box-shadow:0 14px 34px #04111d20}}
@media(max-width:1100px){.section-guide{--guide-art-width:156px;--guide-scene-width:180px;gap:20px;padding:24px 22px}html[data-character-size="large"] .section-guide{--guide-art-width:196px;--guide-scene-width:220px}.guide-identity strong{font-size:19px}}
@media(max-width:650px){.section-guide,html[data-character-size="compact"] .section-guide,html[data-character-size="large"] .section-guide{display:flex;flex-direction:column;align-items:stretch;gap:18px;padding:19px 18px;margin:18px 0 22px;border-radius:20px;--guide-art-width:148px}.guide-scene,html[data-character-size="large"] .guide-scene,html[data-character-size="compact"] .guide-scene{align-self:center;min-height:0;width:210px;max-width:100%;padding:8px 0 0}.guide-scene:before{content:'✦';position:absolute;left:4%;top:32%;font-size:15px;color:var(--guide-accent);opacity:.7}.guide-aura{inset:0 -2% 16%}.guide-spark{right:0;top:16%}.guide-touch-label{margin-top:10px}.guide-identity strong{font-size:18px}.guide-identity small{font-size:12px}.guide-label{font-size:8px;letter-spacing:1.3px}.guide-context{font-size:12px!important}.guide-speech{font-size:12px!important}.guide-actions{gap:8px}.guide-primary,.guide-tip{padding:10px 12px!important;font-size:11px!important}.guide-footer .character-controls{gap:7px 10px}.guide-boundary{font-size:10px!important}html[data-character-size="large"] .section-guide{--guide-art-width:184px}html[data-character-size="compact"] .section-guide{--guide-art-width:112px}}
@media(max-width:320px){.section-guide,html[data-character-size] .section-guide{padding:17px 14px}.guide-identity strong{font-size:16px}.character-size-control{gap:7px}.character-controls{gap:6px}.guide-speech{padding:10px 12px!important}}
@media(prefers-reduced-motion:reduce){.section-guide,.guide-portrait,.guide-primary,.guide-tip,.tool-card,.skill-card,.utility-tile,.cast-card,.race-link,.discovery-card{transition:none!important;transform:none!important}}
.motion-paused .guide-portrait,.motion-paused .depth-pointing,.page-hidden .depth-pointing{transform:none!important;transition:none!important}
