.family-badge,.family-house,.family-aura{object-fit:contain;display:block}.family-badge{width:54px;height:54px}.family-house{width:160px;height:160px}.family-aura{position:absolute;inset:-12%;width:124%;height:124%;pointer-events:none;z-index:0}.family-sprite{position:relative;display:grid;place-items:center}.family-sprite>.mascot{position:relative;z-index:1}.family-card-badge{position:absolute;right:8px;top:5px;width:42px;height:42px}.library-card .owned-mark{right:auto;left:10px;top:34px}.research-lock{font-size:12px;color:#667d8e}.research-lessons{margin:25px 0;display:grid;grid-template-columns:1fr 1fr;gap:18px}.research-lesson{display:flex;align-items:center;gap:18px;padding:18px 24px;text-align:left;background:linear-gradient(135deg,#ffffffea,#e5f4fae6);border:1px solid #b5ceda;border-radius:18px;color:#284b65}.research-lesson .family-house{width:104px;height:104px}.research-lesson strong{display:block;font-size:23px}.research-lesson small{display:block;font-size:14px;line-height:1.7}.research-lesson:hover{border-color:#608fa8;background:#f6fcff}.family-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:24px 0}.family-gallery-card{position:relative;border:1px solid color-mix(in srgb,var(--family-color),white 56%);border-radius:20px;background:linear-gradient(160deg,#fffefef5,color-mix(in srgb,var(--family-color) 9%,white));padding:15px;text-align:center;overflow:hidden}.family-gallery-card>.family-badge{position:absolute;right:12px;top:12px;width:48px;height:48px}.family-gallery-card>.family-house{margin:0 auto;width:160px;height:155px}.family-gallery-card h2{font-size:19px;margin:6px 0}.family-gallery-card p{font-size:14px;margin:4px 0;color:#496276}.family-friends{display:flex;justify-content:center;gap:6px;margin:14px 0}.family-friends button{background:transparent;border:0;padding:0;color:#30485a}.family-friends .family-sprite{width:55px;height:58px}.family-friends .mascot{width:50px;height:50px}.family-friends small{font-size:13px}.family-intro{display:flex;justify-content:space-between;align-items:center;gap:14px}.family-note{font-size:14px;line-height:1.7;color:#43667b;max-width:900px}.family-doors{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.family-doors button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;background:linear-gradient(160deg,#ffffff,color-mix(in srgb,var(--family-color) 12%,white));border-color:color-mix(in srgb,var(--family-color),white 44%);padding:14px 8px;color:#294d64}.family-doors .family-house{width:130px;height:130px}.family-doors .family-badge{position:absolute;right:7px;top:7px;width:35px;height:35px}.family-doors kbd{position:absolute;left:8px;top:8px}.family-doors strong{font-size:16px}.family-doors small{font-size:14px}.classroom-scene .enemy-visual>.family-sprite{width:100%;height:100%}.classroom-scene .enemy-visual .family-aura{filter:drop-shadow(0 2px 5px #ffffffc7)}.classroom-scene .enemy-visual .mascot{width:100%;height:100%}.village-overview{background:#f6fbffdc;padding:20px;border:1px solid #b8d4e0;border-radius:22px;margin:20px 0}.village-focus{display:flex;align-items:center;justify-content:center;gap:25px;padding:10px 20px;min-height:205px}.village-focus>.family-house{width:210px;height:195px}.village-focus .family-sprite{width:160px;height:160px}.village-focus .mascot{width:140px;height:140px}.village-focus h2{margin:6px 0;font-size:26px}.village-focus p{margin:8px 0;font-size:16px;color:#436479}.village-focus .family-badge{float:left;margin-right:10px;width:45px;height:45px}.village-address-link{background:#ffffffb8;border:1px solid #b3cad7;padding:9px 16px;border-radius:12px;font-size:14px;color:#34546a}.periodic-scroll{overflow-x:auto;max-width:100%;padding:6px 0 12px;overscroll-behavior-x:contain}.periodic-village{display:grid;grid-template-columns:32px repeat(18,minmax(48px,1fr));grid-template-rows:25px repeat(7,84px) 84px 84px;gap:4px;min-width:1020px;position:relative}.village-col,.village-row,.series-label{display:flex;align-items:center;justify-content:center;gap:2px;font-weight:700;color:#527187;font-size:14px}.village-row{flex-direction:column}.village-col small,.village-row small{font-size:12px;font-weight:400}.series-label{font-size:13px;align-self:center}.village-house{position:relative;display:flex;align-items:center;flex-direction:column;justify-content:flex-end;padding:2px 0 4px;gap:1px;border:1px solid color-mix(in srgb,var(--family-color),white 68%);border-radius:9px;background:linear-gradient(180deg,#ffffff36,color-mix(in srgb,var(--family-color) 10%,white));color:#29475d;transition:background .15s,box-shadow .15s}.village-house .family-house{width:100%;height:54px;max-width:61px}.village-house strong{font-size:15px;line-height:1}.village-house small{font-size:12px;white-space:nowrap;line-height:1.25;letter-spacing:-.06em}.village-house:hover,.village-house.selected{border-color:var(--family-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--family-color),white 25%);background:color-mix(in srgb,var(--family-color) 20%,white)}.village-house.selected:after{content:'';position:absolute;inset:0;border:2px solid #b38935;border-radius:8px;pointer-events:none}.village-legend{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}.village-legend button{display:flex;align-items:center;gap:5px;border:1px solid #c3d3dc;background:#ffffffe3;border-radius:20px;padding:4px 10px;color:#3e596c;font-size:14px}.village-legend .family-badge{width:26px;height:26px}.placement-grid{grid-template-rows:25px repeat(7,62px) 62px 62px;min-width:940px;gap:3px}.placement-grid .family-house{height:50px}.placement-grid .village-house{justify-content:center}.placement-grid .family-hint{background:color-mix(in srgb,var(--family-color) 24%,white);border-color:var(--family-color);box-shadow:0 0 5px color-mix(in srgb,var(--family-color) 30%,transparent)}.slot-dot{width:4px;height:4px;border-radius:50%;background:#7091a7}.empty-slot{display:block;width:75%;height:72%;border:1px dashed #b7cbd7;border-radius:5px;background:#f7fbfe}.blank-village .village-house{background:#edf5fa;border-color:#c8d9e2;box-shadow:none}.placement-hint{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:8px}.placement-hint p{font-size:16px;margin:0}.placement-hint .family-badge{width:40px;height:40px}.address-card{background:#f8fcffe8 url('assets/lab/address-frame.png') center/100% 100% no-repeat;padding:29px 22px;border-radius:17px;border:1px solid #c4d7e1;margin:15px 0}.address-top{display:flex;align-items:center;gap:9px}.address-top>div{flex:1;text-align:left}.address-top h3{font-size:19px;margin:3px 0;color:#304d62}.address-top small{font-size:12px;color:#58738a}.address-top p{font-size:14px;margin:2px 0}.address-top strong{display:block;font-size:15px}.address-top>.family-house{width:94px;height:105px}.mini-map{padding:9px 6px 0;overflow:hidden}.mini-map .periodic-village{min-width:0;width:100%;grid-template-columns:8px repeat(18,1fr);grid-template-rows:5px repeat(9,9px);gap:2px}.mini-cell{border-radius:2px;background:color-mix(in srgb,var(--family-color) 25%,white);border:1px solid #d0dce3}.mini-cell.selected{background:var(--family-color);border-color:#3d5465;box-shadow:0 0 4px var(--family-color);transform:scale(1.4);z-index:2}.mastery-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:12px 0}.mastery-strip span{font-size:13px;border-radius:15px;padding:5px 9px;background:#edf2f6;color:#758794}.mastery-strip .earned{background:#dfeff3;color:#2e6573}.unlock-picture{position:fixed;z-index:100;left:50%;top:43%;width:230px;height:250px;transform:translate(-50%,-50%);display:grid;place-items:center;pointer-events:none}.unlock-picture>img{position:absolute;width:100%;height:100%;object-fit:contain}.unlock-picture>.family-badge{width:92px;height:92px}.unlock-picture>strong{position:absolute;bottom:7px;background:#fffef9ee;padding:7px 14px;border-radius:18px;border:1px solid #c5a769;color:#496379;font-size:16px;white-space:nowrap}.unlock-picture{animation:unlock-illustration 1.4s ease-out both}@keyframes unlock-illustration{0%{opacity:0;scale:.55}18%,72%{opacity:1;scale:1}100%{opacity:0;scale:1.13}}.detail-art.family-sprite{width:210px;height:210px;margin:auto}.detail-art.family-sprite>.family-aura{inset:-5%;width:110%;height:110%}.detail-art.family-sprite .mascot{width:185px;height:185px}.study-art .family-badge{margin:8px auto}.study-art .family-sprite{width:245px;height:245px;margin:auto}.study-art .family-sprite .mascot{width:220px;height:220px}.family-study-home{margin:auto;max-width:270px}.family-study-home .family-house{width:210px;height:170px;margin:auto}.family-study-home .address-card{padding:19px}.stage-card[data-value="3"],.stage-card[data-value="4"]{border-color:#a2c1d2}.stage-card .stage-mini-art{width:53px;height:44px;object-fit:contain;position:absolute;right:4px;top:6px}.stage-card{position:relative}.stage-card .stage-no{position:relative;z-index:1}.family-badge-locked{font-size:12px;display:block;color:#6c8394;margin:8px 0}.village-start-actions{display:flex;gap:10px;flex-wrap:wrap}.family-toolbar{display:flex;flex-wrap:wrap;gap:8px}.family-toolbar button{padding:8px 12px;border:1px solid #b4cdd9;border-radius:11px;background:#f8fcff;color:#2e5a70;font-size:14px}
@media(max-width:950px){.family-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.family-doors .family-house{width:105px;height:105px}.research-lessons{gap:10px}.research-lesson{padding:12px;gap:10px}.research-lesson strong{font-size:19px}}
@media(max-width:760px){.family-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.family-gallery-card{padding:10px}.family-gallery-card>.family-house{width:130px;height:126px}.family-gallery-card>.family-badge{width:36px;height:36px;right:4px;top:5px}.family-gallery-card h2{font-size:16px}.family-gallery-card p{font-size:13px}.family-friends{gap:2px}.family-friends .family-sprite{width:43px;height:45px}.family-friends .mascot{width:40px;height:40px}.family-intro{align-items:flex-start;flex-direction:column}.research-lessons{grid-template-columns:1fr}.research-lesson .family-house{width:78px;height:78px}.family-doors{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.family-doors .family-house{width:106px;height:102px}.family-doors button{padding:8px 6px}.village-overview{padding:10px;border-radius:15px}.village-focus{gap:10px;flex-wrap:wrap;padding:6px;min-height:0}.village-focus>.family-house{width:130px;height:125px}.village-focus .family-sprite{width:105px;height:105px}.village-focus .mascot{width:90px;height:90px}.village-focus>div:last-child{width:100%;text-align:center}.village-focus .family-badge{float:none;margin:auto}.village-focus h2{font-size:22px}.village-focus p{font-size:14px}.address-card{padding:25px 14px}.address-top>.family-house{width:76px;height:88px}.address-top>.family-badge{width:40px;height:40px}.address-top h3{font-size:17px}.village-legend button{font-size:13px;padding:3px 7px}.placement-hint p{font-size:14px}.stage-card .stage-mini-art{width:42px;height:35px}.topbar nav{gap:2px}.topbar nav button{padding:7px 9px;font-size:12px}.topbar{flex-wrap:wrap;height:auto;min-height:70px;gap:7px;padding-top:9px;padding-bottom:9px}.topbar .brand{margin-right:auto}.topbar nav{order:3;width:100%;justify-content:center}.topbar .icon-btn{margin-left:0}.mini-map .periodic-village{grid-template-rows:4px repeat(9,8px);gap:1px}.family-study-home .address-card{padding:19px 9px}.family-gallery-card>.family-house{max-width:100%}}
.family-aura{inset:-12%;width:124%;height:124%;mask-image:radial-gradient(circle at center,transparent 0 28%,#000 31%)}.detail-art.family-sprite>.family-aura{inset:-5%;width:110%;height:110%}
.village-focus>div:last-child{min-width:230px}.village-focus h2{white-space:nowrap}.village-focus .family-badge{float:none;margin:0 0 4px}
.address-card{background:#f8fcffe8;padding:10px 15px 20px}
.address-top{background:url('assets/lab/address-frame.png') center/100% 100% no-repeat;padding:112px 65px 112px;min-height:326px;justify-content:center}
.address-top>div{min-width:108px;flex:0 1 auto}.address-top>.family-house{width:72px;height:87px;flex-shrink:0}.address-top>.family-badge{width:42px;height:42px;flex-shrink:0}.address-top h3{white-space:nowrap;font-size:17px}.address-top strong{white-space:nowrap;font-size:14px}.address-card .mini-map{padding-top:0}
@media(max-width:760px){.village-focus .family-badge{margin:0 auto}.village-focus>div:last-child{min-width:0}.address-card{padding:6px 8px 15px}.address-top{padding:90px 30px 90px;min-height:260px;gap:6px}.address-top>.family-house{width:48px;height:60px}.address-top>.family-badge{width:32px;height:32px}.address-top h3{font-size:15px}.address-top strong{font-size:13px}.address-top p{font-size:13px}.address-top>div{min-width:100px}.study-story .address-top{padding:90px 55px;min-height:275px}}
.series-entry{font-size:12px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#657e94;background:#e8eaf77a;border:1px dashed #b6c1d9;border-radius:8px}.series-entry small{font-size:12px;line-height:1.4}
.address-top{padding:82px 70px 90px;min-height:0}.address-top p{margin:2px 0}.address-top strong{line-height:1.5}.address-top>div{min-width:108px}
@media(max-width:760px){.address-top,.study-story .address-top{padding:72px 30px 76px;min-height:0}.address-top>div{min-width:95px}.address-top small{font-size:12px}.address-top p{font-size:12px;line-height:1.35}.address-top>.family-house{width:48px;height:65px}.address-top strong{font-size:12px}}
@media(prefers-reduced-motion:reduce){.unlock-picture{animation:none}.mini-cell.selected{transform:none}}