/* The treehouse uses one aligned layout for both lighting variants. */
body[data-view=about]{overflow:hidden}
@media (orientation:portrait), (min-height:501px){
  .immersive-stage.treehouse-room{
    width:min(100%,calc((100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * .52662));
    width:min(100%,calc((100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * .52662));
  }
}
.treehouse-room .illustrated-title{left:22%;top:7.1%;width:54%;height:5%;display:grid;place-items:center;font-size:clamp(18px,5.8cqw,28px);letter-spacing:2px;line-height:1.3}
.treehouse-object{position:absolute;z-index:4;display:flex;align-items:center;justify-content:center;flex-direction:column;min-width:44px;min-height:44px;padding:0;background:transparent;border:0;color:#70482c;touch-action:manipulation}
.treehouse-object .object-caption{display:block;position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;padding:3px 7px;border:1px solid #b48353;border-radius:6px;background:#ffe8bccc;box-shadow:0 2px 0 #91633833;font-weight:650;font-size:clamp(10px,3cqw,14px);line-height:1.4;text-shadow:0 1px #fff4d8;pointer-events:none}
.treehouse-object:hover .object-caption,.treehouse-object:focus-visible .object-caption{background:#fff0ce}
.treehouse-questions{left:21%;top:58.7%;width:23%;height:10.7%}
.treehouse-answers{left:45%;top:59.7%;width:30%;height:10.2%}
.treehouse-cabinet{left:53.5%;top:22%;width:35%;height:15.4%}
.treehouse-key{left:77%;top:37.6%;width:18%;height:5.6%}
.treehouse-key .object-caption{left:69%;bottom:4%;font-size:clamp(9px,2.8cqw,13px)}
.treehouse-bookshelf{position:absolute;z-index:4;left:15.8%;top:24.8%;width:35.6%;height:29.7%;pointer-events:none}
.treehouse-bookshelf img{display:block;width:100%;height:100%;filter:drop-shadow(2px 4px 4px #6d421935)}
.treehouse-profile-books{position:absolute;display:grid;grid-template-columns:repeat(2,minmax(44px,1fr));gap:2px;left:47%;top:13%;width:69%;height:39%;transform:translateX(-50%);pointer-events:auto}
.treehouse-profile-books .treehouse-profile{position:relative;color:#4a3325;font-family:inherit;font-size:clamp(12px,3.7cqw,18px);font-weight:750;letter-spacing:.08em;text-shadow:0 1px #fff1c599}
.treehouse-profile:hover,.treehouse-profile:focus-visible{background:#fff0c333;border-radius:5px}
html[data-theme=night] .treehouse-bookshelf img{filter:brightness(.81) saturate(.86) drop-shadow(2px 4px 4px #35201250)}
html[data-theme=night] .treehouse-profile-books .treehouse-profile{color:#332218;text-shadow:0 1px #ffe5a66b}

.immersive-stage[data-scene=about] .town-character.chii{left:6.5%;top:41.8%;width:26.4%;height:17.4%;--pose-ratio:445 / 530}
.immersive-stage[data-scene=about] .town-character.hachi{left:34%;top:40.9%;width:26.6%;height:14.6%}
.immersive-stage[data-scene=about] .town-character.usagi{left:60.5%;top:43.5%;width:34.5%;height:13.8%;--pose-ratio:550 / 440}
.treehouse-room .scene-residents .sprite{position:relative;background-size:100% 100%;background-position:center;transform-origin:center bottom}
.treehouse-room .town-character:is(.chii,.usagi) .resident-motion{position:absolute;inset:0}
.treehouse-room .town-character:is(.chii,.usagi) .sprite{
  position:absolute;
  inset:auto 0 0;
  height:auto;
  aspect-ratio:var(--pose-ratio);
  background-size:contain;
  background-position:center bottom;
}
.treehouse-room .chii .sprite{background-image:url('/static/assets/treehouse/circle-chii.webp');--eye-a:50%;--eye-b:77%;--eye-a-y:43%;--eye-b-y:37%;--eye-width:15%;--eye-height:13%;--fur:#f9f5f2;--blink-delay:-1s}
.treehouse-room .hachi .sprite{background-image:url('/static/assets/treehouse/circle-hachi.webp');--eye-a:32%;--eye-b:61%;--eye-a-y:49%;--eye-b-y:54%;--eye-width:15%;--eye-height:14%;--fur:#f9f5f2;--blink-delay:-4s}
.treehouse-room .usagi .sprite{background-image:url('/static/assets/treehouse/circle-usagi.webp');--eye-a:17%;--eye-b:34%;--eye-a-y:57%;--eye-b-y:63%;--eye-width:10%;--eye-height:15%;--fur:#ffe7a8;--blink-delay:-7s}
html[data-theme=night] .treehouse-room .scene-residents .sprite{filter:drop-shadow(0 3px 2px #47251447) brightness(.95) sepia(.08)}
.treehouse-room .sprite.pose-idle{animation:treehouse-lean 11s ease-in-out infinite var(--blink-delay)}
.treehouse-room .town-character:is(.chii,.usagi) .sprite.pose-idle{animation-name:treehouse-tilt}
.treehouse-room .sprite.pose-idle::before,.treehouse-room .sprite.pose-idle::after{content:'';position:absolute;left:var(--eye-a);top:var(--eye-a-y);width:var(--eye-width);height:var(--eye-height);transform:translate(-50%,-50%);border-radius:50%;border-bottom:2px solid #3a2116;background:var(--fur);opacity:0;pointer-events:none;animation:treehouse-blink 11s steps(1,end) infinite var(--blink-delay)}
.treehouse-room .sprite.pose-idle::after{left:var(--eye-b);top:var(--eye-b-y)}
@keyframes treehouse-blink{0%,39%,100%{opacity:0}37%{opacity:1}}
@keyframes treehouse-lean{0%,26%,53%,100%{transform:none}39%{transform:rotate(-1.7deg) scaleY(.985)}}
@keyframes treehouse-tilt{0%,26%,53%,100%{transform:none}39%{transform:rotate(-1.7deg)}}
@media(prefers-reduced-motion:reduce){.treehouse-room .sprite.pose-idle,.treehouse-room .sprite.pose-idle::before,.treehouse-room .sprite.pose-idle::after{animation:none}}
#modal[data-scene=about]{width:min(720px,calc(100% - 20px));border-radius:18px 18px 8px 8px}
#modal[data-scene=about] #modal-content{background:radial-gradient(ellipse at 100% 100%,#e3e6c544,transparent 55%),repeating-linear-gradient(0deg,transparent 0 31px,#dbc79c20 32px),#fff4dc}
.treehouse-pages{max-width:100%;overflow-wrap:anywhere}
.question-slips{display:flex;flex-direction:column;gap:12px}
.question-slip{display:flex;align-items:center;gap:12px;text-align:left;width:100%;min-height:76px;padding:12px 14px;background:#fffaf0;border:1px solid #dfc79f;border-radius:6px 12px 12px 6px;color:#725034;box-shadow:2px 3px 0 #b58e5b20}
.question-slip.ready{border-color:#b6b580;background:#f8f7e5}
.question-slip>span:nth-child(2){flex:1;min-width:0}.question-slip b{display:block;font-size:15px;font-weight:600;line-height:1.7}.question-slip small{display:block;margin-top:4px;color:#9d825e;font-size:11px}.slip-flower{font-size:24px;color:#d0a178}.question-slip>span:last-child{color:#ac875b;font-size:22px}
.question-create{margin:22px auto 0;display:flex;gap:8px;justify-content:center;align-items:center}
.treehouse-empty{min-height:190px;display:flex;align-items:center;justify-content:center;text-align:center;color:#a28c6e;font-size:14px;line-height:1.9;padding:22px}
.answer-question{font-family:ui-rounded,'PingFang SC',sans-serif;font-size:clamp(18px,5vw,25px);line-height:1.8;color:#765034;text-align:center;padding:10px 4px 15px;margin:0}
.answer-progress{display:flex;justify-content:center;gap:8px;margin:4px 0 22px;flex-wrap:wrap}.answer-progress>span{font-size:11px;padding:5px 9px;color:#aa9578;background:#f7ead3;border:1px dashed #d5bd97;border-radius:20px}.answer-progress>span.answered{color:#6a7d51;border-color:#b9c094;background:#eff0dc}.answer-progress i{font-style:normal;margin-right:4px}
.answer-form .field textarea{min-height:190px;background:repeating-linear-gradient(transparent 0 30px,#d8c39933 31px),#fffaf0!important;line-height:31px;resize:vertical}
.answer-form-actions{display:flex;gap:10px;position:sticky;bottom:-20px;background:#fff3ddf5;padding:12px 0 4px}.answer-form-actions>.button{flex:1;min-width:0;font-size:14px}
.draft-status{color:#859064;font-size:11px;min-height:18px;margin:8px 0}.answer-form .form-error{font-size:12px}.answer-form .field-note{font-size:11px;line-height:1.8}
.folded-card-pair{display:flex;justify-content:center;gap:16px;min-height:130px;align-items:center;padding:10px 0 15px}
.folded-card-pair>span{position:relative;display:grid;place-items:center;height:94px;width:42%;max-width:180px;background:linear-gradient(150deg,#fffaf1 49.5%,#e9cfad 50%,#fff0d7 51%);border:1px solid #bc9471;border-radius:4px;transform:rotate(-5deg);font-size:15px;color:#9e705d;box-shadow:2px 5px 1px #c9a87e33}
.folded-card-pair>span+span{transform:rotate(5deg);color:#78845f;background:linear-gradient(150deg,#fffaf1 49.5%,#d0d5ad 50%,#f3f0dc 51%)}
.folded-card-pair>span:after{content:'♡';position:absolute;bottom:13px;font-size:19px;background:#eac5b4;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;color:#a6745d}.folded-card-pair>span+span:after{background:#d4dcb9;color:#8a966c}
.answer-wait{text-align:center;font-size:14px;color:#a18a69;line-height:1.8}.reveal-button{display:block;margin:20px auto;font-size:17px!important;background:#bf9677!important;color:#fff9eb!important;letter-spacing:2px;padding:12px 24px!important}
.own-answer{margin:20px 0;border-top:1px dashed #d7bd96;padding-top:12px;color:#8c7455;font-size:13px}.own-answer summary{min-height:44px;cursor:pointer;display:list-item;line-height:44px}.own-answer p{white-space:pre-wrap;line-height:1.9;padding:4px 12px;background:#fffaf044}
.paired-answer-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0;align-items:start;perspective:1000px}
.answer-card{position:relative;min-width:0;min-height:210px;padding:24px 14px 22px;border:1px solid #d8b59e;border-radius:5px 13px 7px 5px;background:repeating-linear-gradient(transparent 0 29px,#d6b9a333 30px),#fff6ec;box-shadow:3px 5px 0 #b78e6a20;transform-origin:left center;animation:answer-unfold .6s cubic-bezier(.2,.7,.2,1) both}
.answer-card.haohao{background:repeating-linear-gradient(transparent 0 29px,#bfcca633 30px),#f9f8e8;border-color:#bcc49d;transform-origin:right center}.answer-card h3{text-align:center;font-size:17px;font-weight:600;margin:5px 0 16px;color:#966b58}.answer-card.haohao h3{color:#7e8b5e}.answer-card p{font-size:14px;line-height:30px;white-space:pre-wrap;overflow-wrap:anywhere;margin:0}.answer-card-seal{position:absolute;top:-14px;left:calc(50% - 14px);width:28px;height:28px;background:#efcdb8;color:#b88564;border-radius:50%;display:grid;place-items:center}.haohao .answer-card-seal{background:#dde1bb;color:#95a274}
.profile-book-heading{display:flex;align-items:center;justify-content:center;gap:15px;margin:6px 0 24px}.profile-book-heading h3{font-size:23px;color:#80613f;font-weight:600}.profile-book-heading .avatar{width:58px;height:58px;font-size:25px}.resident-details dt{color:#9b815f;font-size:12px;margin-top:20px}.resident-details dd{margin:7px 0 0;font-size:15px;white-space:pre-wrap;line-height:1.9}.treehouse-management{display:flex;flex-direction:column;gap:12px}.treehouse-management .button{width:100%;font-size:14px;justify-content:center}.treehouse-management .field-note{font-size:11px;line-height:1.8;margin:0 0 8px}.treehouse-management .text-button{align-self:center;min-height:44px}
@keyframes answer-unfold{from{opacity:0;transform:rotateY(-70deg) scale(.96)}to{opacity:1;transform:rotateY(0) scale(1)}}
@media(max-width:375px){.paired-answer-cards{gap:9px}.answer-card{padding:22px 10px 18px}.answer-card p{font-size:13px}.question-slip{gap:9px;padding:12px}.question-slip b{font-size:14px}}
@media(prefers-reduced-motion:reduce){.answer-card{animation:none}}

.treehouse-legal{position:absolute;z-index:31;left:3%;right:3%;bottom:0;font-size:8px}.treehouse-legal .site-footer{padding:0 0 1px;gap:5px;font-size:8px;color:#8d6a40}.treehouse-legal .site-footer a{min-height:0}
.music-source-notes section{padding:10px 0 20px;margin-bottom:16px;border-bottom:1px dashed #d6bd96}.music-source-notes h3{font-size:16px;font-weight:600;color:#7f5b37;margin-bottom:10px}.music-source-notes p{font-size:13px;line-height:1.9;color:#927553;margin:6px 0}.music-source-notes a{display:inline-flex;min-height:44px;align-items:center;margin-right:16px;font-size:12px;color:#758151;text-decoration:underline;text-underline-offset:3px}
