/* Encounters share one stone ledge under the courtyard, with the game's actual small light. */
.courtyard-life { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.15fr) minmax(0,1.15fr); gap:28px; padding:24px 20px; border:1px solid #516267; border-top:0; background:#10242d; }
.courtyard-life>div { min-width:0; }
.courtyard-life h2,.season-waystones legend,.resident-meeting summary { margin:0 0 12px; padding:0; font:18px/1.4 var(--reading-font,system-ui,sans-serif); color:#ebddbd; }
.life-greeting { min-height:44px; border:1px solid #709190; border-radius:7px; background:#163c42; color:#d2f4e7; padding:8px 15px; font:16px/1.5 var(--reading-font,system-ui,sans-serif); cursor:pointer; }
.life-greeting span { color:#8de5d6; }
.life-response { margin:12px 0 0; font:14px/1.65 var(--reading-font,system-ui,sans-serif); color:#b6c9c7; overflow-wrap:break-word; }
:lang(ko) .life-response { word-break:keep-all; }
.resident-response strong { display:block; color:#efd3a4; margin-bottom:3px; font-weight:400; }
.resident-meeting summary { cursor:pointer; min-height:44px; padding:8px 0; margin:-8px 0 4px; }
.resident-choices { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; padding:8px 0 0; }
.resident-choice { min-width:0; min-height:76px; padding:3px 2px 7px; background:#0c1c24; border:1px solid #38575b; border-radius:6px; color:#cbd5cd; cursor:pointer; font:12px/1.4 var(--reading-font,system-ui,sans-serif); overflow-wrap:anywhere; }
.resident-portrait { display:block; width:42px; height:42px; margin:auto; background-size:800% 100%; background-repeat:no-repeat; }
.resident-choice[aria-pressed=true] { border-color:#dec08b; background:#22343a; color:#ffe3ac; }
.resident-choice[aria-pressed=true] .resident-portrait { animation:resident-hello .7s ease-out; }
.season-waystones { margin:0; padding:0; border:0; min-width:0; }
.season-waystones legend { float:none; }
.waystone-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.waystone { --season-color:#d9b1c6; min-height:76px; padding:8px 4px 6px; color:#cbd5cd; border:1px solid #39545a; background:#0b1e28; border-radius:6px; cursor:pointer; font:14px/1.4 var(--reading-font,system-ui,sans-serif); }
.waystone-summer { --season-color:#f0d279; }.waystone-autumn { --season-color:#e5a76e; }.waystone-winter { --season-color:#c2e9ec; }
.waystone-carving { position:relative; display:block; margin:0 auto 5px; width:23px; height:31px; border:1px solid #6c8b8a; border-radius:8px 8px 2px 2px; background:linear-gradient(110deg,#3b565d,#1b3038); box-shadow:inset -3px 0 0 #10242c; }
.waystone-carving::before { content:''; position:absolute; left:7px; top:8px; width:7px; height:11px; border:1px solid var(--season-color); border-radius:50% 50% 15% 50%; transform:rotate(35deg); opacity:.7; }
.waystone-summer .waystone-carving::before { height:7px; border-radius:50%; transform:none; top:10px; }
.waystone-autumn .waystone-carving::before { border-radius:0 75% 0 75%; transform:rotate(15deg); }
.waystone-winter .waystone-carving::before { border-radius:0; height:8px; transform:rotate(45deg); }
.waystone[aria-pressed=true] { color:var(--season-color); border-color:var(--season-color); background:#1c3239; }
.waystone[aria-pressed=true] .waystone-carving::before { opacity:1; box-shadow:0 0 9px var(--season-color); }
.season-links { display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; margin-top:8px; }
.life-story-link,.season-reset { display:inline-flex; align-items:center; min-height:44px; padding:4px 0; font:14px/1.5 var(--reading-font,system-ui,sans-serif); }
.life-story-link { color:#f1d29e; text-decoration:underline; text-underline-offset:4px; }
.season-reset { background:none; border:0; color:#a6bdbc; cursor:pointer; text-decoration:underline; text-underline-offset:4px; }
.courtyard-life button:focus-visible,.resident-meeting summary:focus-visible,.life-story-link:focus-visible,.world-familiar:focus-visible { outline:3px solid #a6f5e3; outline-offset:4px; }
.world-familiar { position:absolute; z-index:4; left:31%; top:54%; transform:translate(-50%,-50%); width:64px; height:92px; padding:0; border:0; border-radius:50%; background:transparent; cursor:pointer; }
.familiar-orbit { display:block; width:54px; height:88.5px; margin:auto; }
.familiar-sprite { display:block; width:100%; height:100%; background:url('/assets/world/small-light-idle.webp') 0 0 / 6400% 100% no-repeat; animation:familiar-idle 3s steps(64) infinite; image-rendering:pixelated; filter:drop-shadow(0 0 8px #80e8d855); }
.familiar-spark { position:absolute; inset:25% 5%; border:1px solid #b5ffee; border-radius:50%; opacity:0; pointer-events:none; }
.is-greeting .familiar-orbit { animation:familiar-hello 2.4s ease-in-out; }
.is-greeting .familiar-spark { animation:familiar-spark 1.3s ease-out; }
.reader-title-group { display:flex; align-items:center; min-width:0; gap:8px; }
.reader-title-group h2 { min-width:0; }
.reader-familiar-slot { position:relative; flex:none; width:44px; height:44px; }
.reader-familiar-slot .world-familiar { position:relative; left:auto; top:auto; transform:none; width:44px; height:44px; }
.reader-familiar-slot .familiar-orbit { width:27px; height:44px; }
.familiar-caption { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.courtyard-walker { pointer-events:auto; cursor:pointer; }
.resident-talking .courtyard-walker:not(.is-greeted) { opacity:0 !important; animation-play-state:paused; pointer-events:none; }
.courtyard-walker.is-greeted { display:block; animation:none; opacity:1; left:var(--x2); top:var(--y2); }
.is-greeted .walker-facing { animation:none; transform:scaleX(var(--facing)); }
.is-greeted .walker-motion { display:none; }
.is-greeted .walker-rest { animation:none; opacity:1; }
.is-greeted .walker-idle { animation:resident-hello .7s ease-out,courtyard-idle 1.6s steps(8) infinite; }
.is-greeted .courtyard-bubble { display:block; animation:none; opacity:1; }
.season-weather { position:absolute; inset:0; z-index:2; overflow:hidden; pointer-events:none; opacity:0; transition:opacity .7s; }
[data-season=spring] .season-weather,[data-season=summer] .season-weather,[data-season=autumn] .season-weather,[data-season=winter] .season-weather { opacity:1; }
.season-weather i { position:absolute; left:var(--x); top:-12px; width:6px; height:9px; opacity:0; background:#e7b9c9; border-radius:80% 10% 70% 20%; animation:season-fall calc(9s + var(--i)*.23s) linear infinite; animation-delay:calc(var(--i)*-.61s); }
[data-season=summer] .season-weather { background:linear-gradient(120deg,transparent 20%,#e6c06a0b 43%,transparent 60%); }
[data-season=summer] .season-weather i { width:3px; height:3px; border-radius:50%; background:#f7d98c; box-shadow:0 0 8px #f7d98c88; animation-name:season-summer; }
[data-season=autumn] .season-weather i { width:8px; height:5px; border-radius:0 75% 0 75%; background:#dda166; }
[data-season=winter] .season-weather i { width:3px; height:3px; border-radius:50%; background:#e4f6fb; animation-duration:calc(12s + var(--i)*.19s); }
.life-still .season-weather { display:none; }
.familiar-still .familiar-sprite,.familiar-still .familiar-orbit,.familiar-still .familiar-spark,.life-still .is-greeted .walker-idle { animation:none; }
@keyframes familiar-idle { to { background-position:101.5873016% 0; } }
@keyframes familiar-hello { 20% { transform:translate(12px,-12px) rotate(8deg); } 45% { transform:translate(22px,-3px) rotate(-5deg); } 70% { transform:translate(4px,3px); } 100% { transform:none; } }
@keyframes familiar-spark { 20% { opacity:.6; transform:scale(.7); } 100% { opacity:0; transform:scale(1.6); } }
@keyframes resident-hello { 30% { transform:translateY(-5px) rotate(-3deg); } 65% { transform:translateY(0) rotate(3deg); } 100% { transform:none; } }
@keyframes season-fall { 5% { opacity:0; } 12%,85% { opacity:.85; } 100% { top:105%; opacity:0; transform:translateX(48px) rotate(190deg); } }
@keyframes season-summer { 15%,75% { opacity:.7; } 100% { top:105%; opacity:0; transform:translateX(-24px); } }
@media(max-width:900px) { .courtyard-life { gap:18px; padding-inline:16px; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); } .season-encounter { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 24px; }.season-encounter .season-waystones { grid-row:1/3; }.season-encounter .life-response { align-self:end; }.season-links { margin-top:0; } }
@media(max-width:599px) { .courtyard-life { grid-template-columns:1fr; gap:22px; padding:22px 18px; }.courtyard-life>div+div { border-top:1px solid #3b545a; padding-top:20px; }.season-encounter { display:block; grid-column:auto; }.resident-choices { gap:8px; }.resident-choice { min-height:80px; font-size:13px; }.world-familiar { left:32%; top:48%; }.life-response { font-size:15px; }.reader-title-group { gap:4px; }.reader-title-group h2 { font-size:15px; line-height:1.3; overflow-wrap:anywhere; }.season-links { margin-top:8px; } }
@media(prefers-reduced-motion:reduce) { .familiar-sprite,.is-greeting .familiar-orbit,.is-greeting .familiar-spark,.is-greeted .walker-idle,.resident-choice[aria-pressed=true] .resident-portrait { animation:none; }.season-weather { display:none; } }