/* ══════════════════════════════════════════════════════════════════════
   fam/assets/fam-nav.css — 🏠260924 가정용 화면 재배치(fam/js/fam-nav.js 짝 · 가정용 셸 /fam/ 전용 · ⛔기관용 무관)
   · 부모 = 그린(#16B364 계열) · 아이 = 핑크(#FF6B9D 계열) · 단색(핑크→그린 그라데이션 금지) · 새 배경에 보라 없음
   · 금빛은 «kicker 알약·점·카드 윗선» 에만 · 선 아이콘 24px · 굵기 1.8 · Pretendard(셸 글꼴 그대로)
   · 다크모드 없음(셸 meta + light only 짝) · ⛔prefers-reduced-motion 가드 넣지 마라(불가침 3)
   ══════════════════════════════════════════════════════════════════════ */
#fn-tabs,#fn-kid{display:none}
:root{--fn-rail:96px;--fn-p:#16B364;--fn-p-ink:#087d49;--fn-p-bg:#edf8f1;--fn-c:#FF6B9D;--fn-c-ink:#C2185B;--fn-c-bg:#FFF2F6;--fn-gold:#E8B84B}

/* ── 공통: 칸이 켜지면 떠 있는 대화 버튼은 탭으로 옮긴다 · 대화 창은 탭 위로 ── */
body.fn-on #fchat-open{display:none!important}
body.fn-on #fchat{z-index:200}
body.playing #fn-tabs{display:none!important}

/* ── 부모 · 데스크톱/태블릿 좌측 메뉴: 아이 선택 아래 네 칸 + 리워드 · 기록 목록은 «보고서» 칸으로 ── */
.fn-side{display:flex;flex-direction:column;gap:2px;margin:14px 0 6px;padding:0 2px;flex:none}
.fn-side .sb-sep{margin:8px 10px 6px}
.fn-side [data-fn="reward"] .sb-lb::after{content:'';display:inline-block;width:6px;height:6px;margin-left:8px;border-radius:50%;background:var(--fn-gold);vertical-align:middle}
body.fn-on #sb .fh-child-menu [data-sd="kid-home"]{display:none!important}   /* 우리 아이 홈 = «데일리» 칸 — 같은 판이 두 번 켜지지 않게 */
body.fn-on #sb .fh-heading,body.fn-on #sb .fh-search,body.fn-on #sb .fh-filters,body.fn-on #sb #fh-notice,body.fn-on #sb #fh-list,body.fn-on #sb .fh-more{display:none!important}

/* ── 아이 · 데스크톱/태블릿 왼쪽 레일 ── */
body.fn-on.fmode-child #tb-burger{display:none!important}   /* 부모 서랍(☰)은 아이 모드에서 열 것이 없다 */
body.fn-on.fmode-child:not(.fn-phone){--side-w:var(--fn-rail)}
body.fn-on.fmode-child:not(.fn-phone) #stage{margin-left:var(--fn-rail)!important}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs{display:flex;flex-direction:column;align-items:stretch;gap:6px;position:fixed;z-index:60;left:0;top:var(--top-h);bottom:0;width:var(--fn-rail);padding:18px 10px calc(18px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.78);border-right:1px solid #F6D9E4;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:6px 0 30px rgba(194,24,91,.05);animation:fn-rail-in .55s cubic-bezier(.16,.8,.24,1) both}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:76px;padding:10px 4px;border:1px solid transparent;border-radius:18px;background:none;color:#8b7f86;
  font:inherit;font-size:12px;font-weight:800;line-height:1.25;letter-spacing:-.02em;text-align:center;word-break:keep-all;cursor:pointer;transition:background .25s,color .25s,transform .25s cubic-bezier(.16,.8,.24,1)}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button:hover{background:#FFF7FA;color:var(--fn-c-ink);transform:translateY(-1px)}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button[aria-current=page]{background:var(--fn-c-bg);border-color:rgba(255,107,157,.45);color:var(--fn-c-ink);box-shadow:0 8px 20px -10px rgba(194,24,91,.45)}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button svg{width:28px;height:28px}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button[aria-current=page] svg{stroke-width:2.2}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs .fn-common{margin-top:auto;position:relative}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs .fn-common::before{content:'';position:absolute;left:14px;right:14px;top:-10px;height:1px;background:linear-gradient(90deg,transparent,#F3CFDD,transparent)}
/* 가로로 누운 폰·낮은 창 — 레일 칸을 줄이고 넘치면 스크롤 */
@media(max-height:600px){
  body.fn-on.fmode-child:not(.fn-phone) #fn-tabs{gap:2px;padding:8px 8px calc(8px + env(safe-area-inset-bottom));overflow-y:auto}
  body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button{min-height:52px;gap:3px;padding:6px 2px;font-size:10.5px}
  body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button svg{width:22px;height:22px}
  body.fn-on.fmode-child:not(.fn-phone) #fn-tabs .fn-common::before{top:-2px}
}
@keyframes fn-rail-in{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}

/* ── 폰 세로: 두 모드 모두 하단 탭 5칸 · 옛 탭·아이 고르기는 숨김 ── */
body.fn-on.fn-phone #fm-tabs,body.fn-on.fn-phone #fm-kid{display:none!important}
body.fn-on.fn-phone #fn-tabs{display:flex;position:fixed;z-index:180;left:0;right:0;bottom:0;height:calc(72px + env(safe-area-inset-bottom));padding:7px 6px calc(7px + env(safe-area-inset-bottom));
  background:#fffffff5;border-top:1px solid #e3ece6;box-shadow:0 -8px 25px #31583608;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
body.fn-on.fn-phone #fn-tabs button{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:0;border-radius:14px;background:none;color:#82908a;
  font:inherit;font-size:11px;font-weight:750;line-height:1.2;letter-spacing:-.03em;text-align:center;word-break:keep-all;cursor:pointer;padding:4px 2px;position:relative}
body.fn-on.fn-phone #fn-tabs button svg{width:24px;height:24px;flex:none}
body.fn-on.fn-phone #fn-tabs button[aria-current=page]{color:var(--fn-p-ink)}
body.fn-on.fn-phone #fn-tabs button[aria-current=page] svg{stroke-width:2.3}
body.fn-on.fn-phone #fn-tabs button[aria-current=page]::before{content:'';position:absolute;top:-7px;left:28%;right:28%;height:3px;border-radius:0 0 3px 3px;background:var(--fn-p)}
body.fn-on.fn-phone.fmode-child #fn-tabs{border-top-color:#F6D9E4}
body.fn-on.fn-phone.fmode-child #fn-tabs button[aria-current=page]{color:var(--fn-c-ink)}
body.fn-on.fn-phone.fmode-child #fn-tabs button[aria-current=page]::before{background:var(--fn-c)}
body.fn-on.fn-phone #fn-tabs .fn-common svg{color:#b8923a}
/* 🏠260929 이사님 — 폰 세로 아이 하단 탭이 너무 많다 → «조앤과 힐링이»는 설정 창으로(짝 fam-nav.js openSheet) · 데스크톱·태블릿 왼쪽 레일은 그대로 */
body.fn-on.fn-phone.fmode-child #fn-tabs button[data-fn="c-friends"]{display:none}
body.fn-on.fn-phone.fmode-child #stage{padding-bottom:104px!important}
/* 폰 부모 윗줄 — 아이 알약(아이 목록 + 계정) */
body.fn-on.fn-phone:not(.fmode-child) #fn-kid:not([hidden]){display:inline-flex;align-items:center;gap:7px;min-width:0;max-width:190px;min-height:40px;padding:4px 10px 4px 4px;border:1px solid #d6e7dc;border-radius:22px;background:#edf7f0;color:#215837;font:inherit;font-size:13px;cursor:pointer}
#fn-kid .fp-avatar{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:#fff;color:#16835a;font-size:13px;font-weight:900;overflow:hidden}
#fn-kid .fp-avatar img{width:100%;height:100%;object-fit:cover}
#fn-kid b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:800}
#fn-kid svg{flex:none;width:16px;height:16px}
body:has(#fmode-toggle:not([hidden])) #fn-kid{max-width:140px!important}
.fn-sheet{display:grid;gap:16px;text-align:left}
.fn-sheet-kids{display:grid;gap:8px}
.fn-sk{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:9px 14px 9px 10px;border:1px solid #e1ebe5;border-radius:16px;background:#fff;color:#1f3a2c;font:inherit;font-size:16px;cursor:pointer;text-align:left}
.fn-sk.on{border-color:var(--fn-p);background:var(--fn-p-bg)}
.fn-sk b{flex:1;font-weight:800}
.fn-sk svg{width:20px;height:20px;color:var(--fn-p-ink)}
.fn-sk .fp-avatar{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;background:#f1f7f3;color:#16835a;font-weight:900;overflow:hidden}
.fn-sk .fp-avatar img{width:100%;height:100%;object-fit:cover}
.fn-sk.fn-add{justify-content:center;min-height:48px;color:#3a7a56;font-size:14px;font-weight:800;border-style:dashed;background:#f8fbf9}
.fn-sheet-acct{display:grid;gap:6px;padding-top:14px;border-top:1px solid #eef3ef}
.fn-sheet-acct button{min-height:48px;border:0;border-radius:12px;background:#f7faf8;color:#254c36;text-align:left;padding:12px 14px;font:inherit;font-size:15px;cursor:pointer}
.fn-sheet-acct [data-ma="logout"]{color:#B04755;background:#fff6f7}

/* ── 데일리 자리(코덱스 몫 · #fn-daily 에 FAM_DAILY.mount) ── */
.fn-daily{position:relative;margin:0 0 22px;border-radius:24px;overflow:hidden;animation:fn-up .6s cubic-bezier(.16,.8,.24,1) both}
.fn-daily-in{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:132px;padding:22px 26px;border:1.5px dashed #BFE3CD;border-radius:24px;
  background:radial-gradient(120% 140% at 100% 0%,#E3F7EA 0%,rgba(227,247,234,0) 55%),linear-gradient(135deg,#F4FCF7,#FFFFFF 70%)}
.fn-daily-in>svg{position:absolute;right:26px;top:50%;width:64px;height:64px;margin-top:-32px;color:#16B364;opacity:.9;animation:fn-spin 24s linear infinite}
.fn-daily-in b{font-size:22px;font-weight:900;letter-spacing:-.03em;color:#0d1a14}
.fn-daily-in p{margin:0;font-size:14px;font-weight:600;color:#6f8579}
.fn-kicker{display:inline-flex;align-items:center;min-height:24px;padding:3px 10px;border-radius:999px;background:linear-gradient(135deg,#FFE6A3,#F6CF6A);color:#6b4e0f;font-size:11px;font-weight:900;letter-spacing:.14em}
.fn-daily[data-mode="child"] .fn-daily-in{min-height:220px;justify-content:center;border-color:#F7B8CD;background:radial-gradient(120% 140% at 100% 0%,#FFE3EE 0%,rgba(255,227,238,0) 55%),linear-gradient(135deg,#FFF6F9,#FFFFFF 70%)}
.fn-daily[data-mode="child"] .fn-daily-in>svg{color:#FF6B9D;width:92px;height:92px;margin-top:-46px}
.fn-daily[data-mode="child"] .fn-daily-in b{font-size:28px}
.fn-daily[data-mode] .fn-daily-in>svg+b{margin-top:6px}
@keyframes fn-spin{to{transform:rotate(360deg)}}
@keyframes fn-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ── 자리 판(부모 AI 대화 · 리워드 컬렉션 · 사회정서학습 아래) ── */
.fn-soon{display:flex;flex-direction:column;align-items:center;gap:8px;padding:34px 18px 30px;text-align:center;animation:fn-up .6s cubic-bezier(.16,.8,.24,1) both}
.fn-soon-ic{display:grid;place-items:center;width:72px;height:72px;border-radius:24px;background:var(--fn-p-bg);color:var(--fn-p);box-shadow:inset 0 0 0 1px rgba(22,179,100,.18)}
.fn-soon-ic svg{width:34px;height:34px}
.fn-soon b{font-size:20px;font-weight:900;color:#0d1a14;letter-spacing:-.03em}
.fn-soon p{margin:0;font-size:14px;font-weight:600;color:#6f8579}
body.fmode-child .fn-soon-ic{background:var(--fn-c-bg);color:var(--fn-c);box-shadow:inset 0 0 0 1px rgba(255,107,157,.25)}
.fn-soon.fn-mini{flex-direction:row;justify-content:center;padding:14px;border:1.5px dashed #F3CBD9;border-radius:18px;margin-top:16px;animation-delay:.18s}
.fn-soon.fn-mini .fn-soon-ic{width:40px;height:40px;border-radius:14px}
.fn-soon.fn-mini .fn-soon-ic svg{width:22px;height:22px}
.fn-vault{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:min(420px,100%);margin-top:20px}
.fn-vault i{display:grid;place-items:center;aspect-ratio:1;border-radius:18px;background:linear-gradient(#fff,#fbfaf6);border:1px solid #efe7d2;border-top:2px solid var(--fn-gold);color:#d9c9a0;animation:fn-up .6s cubic-bezier(.16,.8,.24,1) both}
.fn-vault i:nth-child(2){animation-delay:.05s}.fn-vault i:nth-child(3){animation-delay:.1s}.fn-vault i:nth-child(4){animation-delay:.15s}.fn-vault i:nth-child(5){animation-delay:.2s}.fn-vault i:nth-child(6){animation-delay:.25s}
.fn-vault svg{width:34%;height:34%;opacity:.8}

/* ── 사회정서학습: 게임 카드 ── */
.fn-games{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.fn-game{position:relative;display:block;padding:0;border:0;border-radius:22px;overflow:hidden;aspect-ratio:16/9;background:#10263a;cursor:pointer;text-align:left;box-shadow:0 18px 40px -22px rgba(13,26,20,.55);
  transform:translateZ(0);transition:transform .45s cubic-bezier(.16,.8,.24,1),box-shadow .45s;animation:fn-up .6s cubic-bezier(.16,.8,.24,1) both}
.fn-game:nth-child(2){animation-delay:.08s}
.fn-game img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.16,.8,.24,1)}
.fn-game::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(4,18,12,.72))}
.fn-game:hover{transform:translateY(-4px);box-shadow:0 26px 50px -24px rgba(13,26,20,.6)}
.fn-game:hover img{transform:scale(1.06)}
.fn-game-tx{position:absolute;z-index:1;left:18px;right:78px;bottom:16px;color:#fff}
.fn-game-tx b{display:block;font-size:19px;font-weight:900;letter-spacing:-.03em;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.fn-play{position:absolute;z-index:1;right:16px;bottom:14px;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#3DF08C,#0EC766);color:#03301A;box-shadow:0 10px 22px -8px rgba(8,140,72,.6),0 0 22px -4px rgba(30,235,125,.6)}
.fn-play svg{width:22px;height:22px;margin-left:3px}

/* ── 우리아이로그: 시간순 줄 ── */
.fn-log{position:relative;display:flex;flex-direction:column;gap:8px;text-align:left}
.fn-log-day{margin:14px 0 2px;font-size:12.5px;font-weight:800;color:#7c9188;letter-spacing:.02em}
.fn-log-day:first-child{margin-top:0}
.fn-log-row{display:flex;align-items:flex-start;gap:12px;width:100%;padding:13px 14px;border:1px solid #e4ece6;border-radius:16px;background:#fff;color:inherit;font:inherit;text-align:left;animation:fn-up .5s cubic-bezier(.16,.8,.24,1) both}
button.fn-log-row{cursor:pointer;transition:border-color .2s,transform .25s}
button.fn-log-row:hover{border-color:#bfe0cc;transform:translateY(-1px)}
.fn-log-ic{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px;background:var(--fn-p-bg);color:var(--fn-p-ink)}
.fn-log-ic svg{width:21px;height:21px}
.fn-k-letter .fn-log-ic{background:#FFF2F6;color:#C2185B}
.fn-k-weekly .fn-log-ic,.fn-k-final .fn-log-ic{background:#F3F6F4;color:#3f4f46}
.fn-k-ob .fn-log-ic{background:#FFF8E6;color:#9a7417}
.fn-log-tx{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.fn-log-tx strong{font-size:15.5px;font-weight:800;color:#0d1a14;line-height:1.45;word-break:keep-all}
.fn-log-tx small{font-size:12.5px;color:#7c9188;font-weight:600}
.fn-log-tx .quote{margin-top:8px;padding:12px 14px;font-size:14.5px}
.fn-log .fh-empty{padding:40px 10px;font-size:13px}
.fn-log .fh-empty b{font-size:15px}
.fn-log .fh-empty>svg{width:36px;height:36px}

/* ── 보고서(데스크톱 · 폰은 fam-surfaces.css 그대로) ── */
body.fn-on:not(.fn-phone) .fm-records{text-align:left}
body.fn-on:not(.fn-phone) .fm-record-filters{display:flex;gap:6px;margin:0 0 14px}
body.fn-on:not(.fn-phone) .fm-record-filters button{min-height:38px;padding:7px 16px;border:1px solid #e1e8e0;border-radius:999px;background:#fff;color:#5d7466;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
body.fn-on:not(.fn-phone) .fm-record-filters button[aria-pressed=true]{color:#fff;background:#277b56;border-color:#277b56}
body.fn-on:not(.fn-phone) .fm-record-count{display:flex;justify-content:space-between;align-items:center;margin:0 2px 10px;font-size:12.5px;color:#7c9188;font-weight:700}
body.fn-on:not(.fn-phone) .fm-record-count button{border:0;background:none;color:#277b56;font:inherit;font-weight:800;cursor:pointer}
body.fn-on:not(.fn-phone) .fm-records .fh-row{gap:14px;margin:0 0 10px;padding:14px 16px;border:1px solid #e4ece6;background:#fff;border-radius:16px;min-height:74px}
body.fn-on:not(.fn-phone) .fm-records .fh-row:hover{border-color:#bfe0cc}
body.fn-on:not(.fn-phone) .fm-records .fh-row strong{font-size:15.5px;color:#0d1a14;font-weight:800}
body.fn-on:not(.fn-phone) .fm-records .fh-row small{font-size:12.5px;line-height:1.6}
body.fn-on:not(.fn-phone) .fm-record-icon{display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:12px;background:#eef4e9;color:#568066}
body.fn-on:not(.fn-phone) .fm-record-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6}
body.fn-on:not(.fn-phone) .fm-record-icon.letter{background:#FFF2F6;color:#C2185B}

@media(max-width:600px) and (orientation:portrait){
  body.fw-worlds .fn-daily{margin:0 22px 20px}   /* 폰 여행 판 안쪽 여백(fw-heading·fw-track 22px)과 맞춘다 */
  .fn-games{grid-template-columns:1fr;gap:14px}
  .fn-daily-in{padding:20px 20px;min-height:118px}
  .fn-daily-in>svg{right:18px;width:52px;height:52px;margin-top:-26px}
  .fn-daily[data-mode="child"] .fn-daily-in>svg{width:70px;height:70px;margin-top:-35px}
}

/* 🏠260926 아케이드 잠금 안내 — 보라 없음 · 앱 초록/금 */
.fn-arcade-lock{margin:14px 0 18px;padding:16px 18px;border-radius:18px;background:#fff8e8;border:1px solid #efd9a4}.fn-arcade-lock p{margin:0 0 10px;font-weight:800;color:#5b4a1c;line-height:1.5;word-break:keep-all}.fn-arcade-lock .fn-need{display:flex;gap:10px;flex-wrap:wrap}.fn-arcade-lock button{border:1px solid #d9e6d0;background:#fff;border-radius:14px;padding:10px 14px;font-weight:700;color:#35584a;cursor:pointer;min-height:44px}.fn-arcade-lock button.ok{background:#e9f8ef;border-color:#9fdcb6;color:#1d7a4a}.fn-games.is-locked .fn-game{filter:grayscale(.55);opacity:.6}
/* 🏠260929 우리 가족 에메른 메뉴(c-emern·p-emern) — 폰 세로 하단 탭엔 안 넣는다(이사님 「하단 메뉴가 너무 많아」 · 설정 창·데일리 칸에서 들어간다) · 아이콘 = 에메른 얼굴 그림 */
body.fn-on.fn-phone #fn-tabs button[data-fn="c-emern"],body.fn-on.fn-phone #fn-tabs button[data-fn="p-emern"]{display:none}
.fh-icon.fh-emern{display:inline-block;overflow:hidden;border-radius:30%;background:#fff5f9;flex:none}
.fh-icon.fh-emern img{display:block;width:100%;height:100%;object-fit:cover}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs .fh-icon.fh-emern{width:48px;height:48px}
@media(max-height:650px) and (min-width:601px){body.fn-on.fmode-child:not(.fn-phone) #fn-tabs .fh-icon.fh-emern{width:35px;height:35px}}
/* 🏠260929 우리 가족 에메른 판 — 방을 넓게(노트북 = 판 폭 전부로 두 칸 배치 · 폰 = 카드 여백 거의 없이) · 짝 fam-nav.js go(c-emern·p-emern) */
body.fn-emern-page #duo.duo.wide{width:100%!important;max-width:100%!important}
body.fn-emern-page #sheet.sheet.wide{padding:14px!important;width:100%!important;max-width:100%!important}
body.fn-emern-page.fn-phone #stage{padding-left:4px!important;padding-right:4px!important}
body.fn-emern-page.fn-phone #sheet.sheet.wide{padding:6px!important}