/* KormimPtits v5.3: self-contained wide composition, calm typography and no overlap with navigation. */
:root{--v53-dark:#061b2a;--v53-ink:#f7fbfc;--v53-muted:#deebed;--v53-gold:#f2d49d}
/* Header occupies its own row instead of floating above the facade. */
.site-header{position:relative!important;inset:auto!important;height:90px!important;min-height:90px!important;background:#071d2d!important;border-bottom:1px solid rgba(214,232,239,.18)!important;padding:0 clamp(16px,2.3vw,42px)!important;z-index:90!important}
.site-header .top-nav{min-width:0}
.site-header .top-nav .nav-link{font-size:13px!important;color:#e4eef1!important}
.site-header .top-nav .nav-link.active{color:#ffe3ae!important}
.site-header .brand-text small{color:#e2edf1!important;font-size:11px!important}
/* Main house is fitted to the stage, not cut by viewport/menus. */
.experience{height:clamp(720px,calc(100svh - 90px),940px)!important;min-height:720px!important;background:#092538!important;overflow:hidden!important}
.scene{position:absolute!important;inset:0!important;background:#0b2839!important;overflow:hidden!important}
/* Photo-derived blurred surroundings eliminate the dead blue space beside the house. */
.scenery-backdrop{position:absolute!important;inset:-8%!important;z-index:0!important;opacity:.83!important;background:url('/static/residence_v5.webp') center 55%/cover no-repeat!important;filter:blur(57px) brightness(.58) saturate(.84)!important;transform:scale(1.13)!important;pointer-events:none!important}
.scene::before{z-index:2!important;pointer-events:none!important;background:linear-gradient(90deg,rgba(5,21,33,.63),rgba(5,21,33,.13) 24%,transparent 42%,transparent 61%,rgba(5,21,33,.17) 76%,rgba(5,21,33,.61)),linear-gradient(180deg,rgba(4,20,32,.1),transparent 66%,rgba(3,16,24,.56))!important}
.scene::after{z-index:2!important;pointer-events:none!important;background:radial-gradient(ellipse 55% 26% at 49% 89%,rgba(232,171,90,.13),transparent 100%)!important}
.scene-transform{left:47.1%!important;top:51.5%!important;height:min(83%,745px)!important;width:auto!important;aspect-ratio:728/613!important;max-width:none!important;min-width:0!important;transform:translate(-50%,-50%) scale(var(--zoom,1))!important;transform-origin:var(--origin-x,50%) var(--origin-y,50%)!important;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 3.4%,#000 96.6%,transparent 100%)!important;mask-image:linear-gradient(90deg,transparent 0%,#000 3.4%,#000 96.6%,transparent 100%)!important;filter:drop-shadow(0 22px 29px rgba(1,16,27,.36))!important}
.facade-photo{width:100%!important;height:100%!important;object-fit:fill!important;object-position:center center!important}
.scene[data-time=morning] .scenery-backdrop{filter:blur(57px) brightness(.7) saturate(.85)!important}
.scene[data-time=day] .scenery-backdrop{filter:blur(57px) brightness(.9) saturate(.78)!important}
.scene[data-time=evening] .scenery-backdrop{filter:blur(57px) brightness(.58) saturate(.84)!important}
.scene[data-time=night] .scenery-backdrop{filter:blur(57px) brightness(.3) saturate(.74)!important}
/* Sidebar and toolbar sit below the header, with predictable clearances. */
.hero{top:22px!important;left:clamp(18px,1.8vw,34px)!important;width:clamp(228px,16.4vw,272px)!important;padding:18px 17px!important;box-shadow:0 20px 40px rgba(0,13,23,.35)!important}
.hero .eyebrow{font-size:15px!important;font-weight:650!important}
.hero h1{font-size:12px!important;line-height:1.45!important;color:#e3edf0!important}
.hero .hero-stats{font-size:13px!important;color:#f3f9fa!important}
.hero .hero-stats strong{font-size:16px!important}
.house-explore{display:grid!important;place-items:center!important;font-size:0!important;line-height:0!important;white-space:nowrap!important;overflow:hidden!important;right:12px!important;bottom:12px!important;width:32px!important;height:32px!important}
.house-explore span{font-size:20px!important;line-height:1!important}
.floor-rail{top:211px!important;left:clamp(18px,1.8vw,34px)!important}
.scene-toolbar{top:22px!important;right:clamp(370px,25vw,475px)!important;max-width:calc(100vw - 520px)!important;gap:5px!important}
.scene-btn{min-height:34px!important}
.detail-panel{top:22px!important;right:clamp(17px,1.5vw,29px)!important;width:clamp(350px,24.8vw,420px)!important;height:calc(100% - 44px)!important;max-height:780px!important;box-shadow:0 24px 56px rgba(0,12,22,.45)!important}
.detail-panel h2{color:#fff!important;font-weight:650!important}
.detail-panel .detail-lead,.detail-panel .panel-note{color:#e2edf0!important;font-size:13px!important;line-height:1.65!important}
.detail-panel .panel-facts label{color:#cadce3!important}
.detail-panel .panel-facts b{color:#ffffff!important}
.detail-panel .view-counter{color:#d1e1e8!important}
.detail-panel .bird-preview img,.detail-panel .bird-preview video{object-fit:cover!important;object-position:center center!important}
.detail-panel .photo-label{color:#fff!important;background:rgba(5,21,33,.86)!important}
.scene-bottom{left:calc(47.1% - 233px)!important;transform:none!important;bottom:24px!important}
.time-bar{left:calc(47.1% + 100px)!important;transform:translateX(-10%)!important;bottom:24px!important}
.time-bar button{color:#e2edf0!important}
.house-neighbors{left:clamp(18px,1.8vw,34px)!important;transform:none!important;bottom:24px!important}
/* Photo cards: image centered, readable labels placed over a grounded dark gradient. */
.compact-shop{isolation:isolate!important}
.compact-shop img,.bird-preview img,.story-card img,.rank-card img{object-fit:cover!important;object-position:50% 50%!important}
.compact-share p,.compact-shop strong,.rank-name b,.rank-name small{color:#eaf3f5!important}
.rank-section .rank-empty{color:#d5e8ec!important;font-size:12px!important}
/* Empty sections and copy: readable on the cream background. */
.below,.atlas,.steps{color:#173a44!important;background:#f6f7f3!important}
.section-head h2{color:#173b44!important}
.section-head p,.below .panel-note,.atlas .panel-note,.steps p,.story-text,.story-meta,.result-item span{color:#3a5862!important}
.below .micro,.atlas .micro,.steps .micro{color:#8e5b18!important}
.story-card,.result-item,.steps-grid article{border-color:#cadbdc!important}
.search-area input{color:#183b44!important;border-color:#bdcfd1!important}
.search-area input::placeholder{color:#536a72!important}
.join-banner h3,.join-banner p{color:#f9fcfd!important}
.footer{color:#d8e7eb!important}
.footer>div,.footer-brand p{color:#d8e7eb!important}
.footer .footer-links button{color:#f4d8a6!important}
/* Screen changes: keep floor rail and time controls accessible without covering facade. */
@media(max-width:1320px){
  .site-header{height:78px!important;min-height:78px!important}
  .experience{height:clamp(710px,calc(100svh - 78px),900px)!important}
  .scene-transform{height:min(76%,715px)!important;left:49.5%!important}
  .hero{top:18px!important;left:16px!important;width:224px!important}
  .floor-rail{top:202px!important;left:16px!important}
  .scene-toolbar{top:18px!important;right:18px!important}
  .scene-bottom{left:calc(49.5% - 190px)!important}
  .time-bar{left:calc(49.5% + 65px)!important}
}
@media(max-width:1150px){
  .detail-panel{position:fixed!important;inset:auto 0 0 0!important;top:auto!important;right:0!important;width:100%!important;max-width:none!important;max-height:78dvh!important;height:auto!important}
  .scene-transform{height:min(71%,675px)!important;top:51%!important;left:50%!important}
  .scene-bottom{left:calc(50% - 185px)!important}
  .time-bar{left:calc(50% + 65px)!important}
}
@media(max-width:720px){
  .site-header{height:66px!important;min-height:66px!important}
  .experience{height:clamp(650px,89svh,820px)!important;min-height:650px!important}
  .scene-transform{width:min(98vw,600px)!important;height:auto!important;aspect-ratio:728/613!important;left:50%!important;top:53%!important}
  .hero{top:15px!important;left:12px!important;width:185px!important;padding:12px 13px!important}
  .floor-rail{top:162px!important;left:12px!important}
  .scene-toolbar{top:15px!important;right:10px!important}
  .scene-bottom{left:50%!important;transform:translateX(-50%)!important;bottom:15px!important}
  .time-bar{left:50%!important;transform:translateX(-50%)!important;bottom:65px!important}
  .detail-panel{max-height:76dvh!important}
  .below .micro,.atlas .micro,.steps .micro{font-size:11px!important}
}
