/* 清新版皮膚 v2：使用手繪 UI 素材（assets/ui、assets/icon）
   配色：奶油白底、薄荷綠、淡紫、天空藍，少量暖黃橘；深海軍藍描邊 */
:root{
  --navy:#2d3a66;--navy2:#55628f;--mint:#5aa583;--mint-soft:#dff0e6;--lilac:#a98fd8;--sky:#9cc7ea;--sun:#f3b13d;
  --cream:#fff8e6;--card:#fffdf4;--mute:#7d8597;--warn:#d26a5e;--ink:var(--navy);--line:#cfe3d6;--accent:var(--mint);
  --hand:"Klee One","Yuanti TC","Hiragino Maru Gothic ProN","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  --ui-btn:url(../assets/ui/ui_btn.png);--ui-btnp:url(../assets/ui/ui_btn_primary.png);
}
html,body{color:var(--navy);font-family:var(--hand);background:linear-gradient(160deg,#e3f2ea,#eef0fa 55%,#fbf1e2)}
#app{background:var(--cream)}
@media(min-width:640px){#app{margin:18px auto;min-height:calc(100% - 36px);border-radius:22px;box-shadow:0 0 0 6px #fff,0 12px 40px rgba(45,58,102,.18)}}
h1,h2,h3,h4{font-family:var(--hand)}
.ico{display:block;flex:none;object-fit:contain}

/* ===== 按鈕：九宮格（圓角固定 24px、不論高度都不變形；圖畫在 border-image-width，不佔排版空間） ===== */
button{font-family:var(--hand);font-weight:600;color:var(--navy);background:none;border:0 solid transparent;border-radius:0;
  border-image:var(--ui-btn) 90 91 fill/24px stretch;padding:12px 26px 13px;min-height:48px;line-height:1.35;transition:transform .08s,filter .15s}
button:hover:not(:disabled){filter:brightness(1.03)}
button:active:not(:disabled){transform:translateY(2px)}
button:disabled{opacity:.45;filter:grayscale(.4)}
button.primary{background:none;border-color:transparent;border-image:var(--ui-btnp) 100 100 fill/24px stretch;color:#5b3a10;text-shadow:0 1px 0 rgba(255,255,255,.5)}
button.primary:hover:not(:disabled){filter:brightness(1.04)}

/* ===== 頂部列 ===== */
.topbar{position:relative;background:none;border-style:solid;border-width:0 52px;border-radius:0;
  border-image:url(../assets/ui/ui_topbar.png) 0 160 0 160 fill/0 52px 0 52px stretch;height:72px;padding:0 0 0 26px}
.tb2{display:grid;grid-template-columns:auto 1fr;gap:4px;align-items:center}
.tb2 .badge2{position:absolute;left:-58px;top:-6px;width:80px;height:82px;background:url(../assets/ui/ui_badge.png) center/100% 100% no-repeat;
  display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:12px;line-height:1.05;color:var(--navy);z-index:2}
.badge2 small{font-size:.62rem;color:var(--mute)}
.badge2 b{font-size:1.1rem}
.age2{display:flex;flex-direction:column;line-height:1.15;white-space:nowrap}
.age2 b{font-size:1.1rem}
.age2 span{font-size:.7rem;color:var(--mute)}
.rs{display:flex;flex-direction:row;justify-content:flex-end;gap:4px;min-width:0}
.rs div{display:flex;align-items:center;gap:3px;background:#fff;border-radius:999px;padding:2px 7px 2px 3px;box-shadow:inset 0 0 0 1.5px rgba(90,165,131,.5)}
.rs div b{font-size:.78rem;white-space:nowrap}
.rs .ico{width:18px;height:18px}
.tb2 .tog{position:absolute;left:50%;bottom:-16px;transform:translateX(-50%);min-height:0;height:24px;padding:0 18px;border-image-width:12px;font-size:.7rem;line-height:22px;z-index:2}
.tb2 .tog:active:not(:disabled){transform:translateX(-50%) translateY(2px)}

/* 展開面板 */
.card,.panel{background:var(--card);border:2px solid #b8dcc6;border-radius:18px;box-shadow:0 3px 0 rgba(45,58,102,.12)}
.panel{margin-top:22px}
.panel h2{font-size:.9rem;color:var(--mint);margin:0 0 6px}
.bar{grid-template-columns:70px 1fr 40px}
.bar>span:first-child{display:flex;align-items:center;gap:4px}
.bar .track{height:10px;background:#eef3ee;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(45,58,102,.12)}
.bar .fill{background:linear-gradient(90deg,#8fd0ae,var(--mint));border-radius:999px}
.bar.mood .fill{background:linear-gradient(90deg,#ffd98a,var(--sun))}
.bar.fam .fill{background:linear-gradient(90deg,#f7b8cb,#e98aa8)}
.bar .num{color:var(--mute)}

/* ===== 場景 ===== */
.stage::after,.portrait::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -24px 26px -18px rgba(45,58,102,.18)}
.stage .datetag,.stage .bgn{color:#fff;text-shadow:0 1px 3px rgba(45,58,102,.6);font-weight:600}

/* ===== 對話框（九宮格）＋緞帶名牌 ===== */
.dialog{background:none;border-style:solid;border-width:40px;border-radius:0;border-image:url(../assets/ui/ui_dialog.png) 100 fill/40px stretch;
  padding:0;min-height:150px;box-shadow:none;overflow:visible;margin-top:22px}
.dialog .txt{margin:-18px -16px -16px;line-height:1.75;font-size:1.02rem;color:var(--navy)}
.dialog .who{position:absolute;left:-26px;top:-62px;min-width:96px;height:38px;padding:0 4px 2px;border-style:solid;border-width:0 26px;
  border-image:url(../assets/ui/ui_nameplate.png) 0 95 0 95 fill/0 26px 0 26px stretch;display:flex;align-items:center;justify-content:center;
  font-weight:600;color:#5b3a10;text-shadow:0 1px 0 rgba(255,255,255,.55);letter-spacing:.08em;background:none;z-index:2}
.dialog .who:empty{display:none}
.dialog .hint{right:-14px;bottom:-22px;color:var(--mint)}
.dialog.sys .txt{text-align:center;color:var(--navy2)}

/* 選項 */
.choices{gap:10px}
.choices button{text-align:center}

/* ===== 主畫面：底部按鈕列、右側圖示 ===== */
.dock{padding:14px 0 6px;gap:8px}
.dock button{padding:12px 14px 13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.95rem}
.dock i{font-size:.75rem;margin-left:2px}
.dock i{color:var(--mute)}
.dock .primary i{color:#7a5520}
.side button{min-height:0;width:58px;height:62px;padding:2px 0 0;border:0;border-image:none;background:rgba(255,255,255,.85);border-radius:20px;
  box-shadow:0 0 0 2px #fff,0 3px 8px rgba(45,58,102,.18)}
.side button span{font-size:.62rem;color:var(--navy2);font-weight:600}
.portrait .side img{position:static;transform:none;width:34px;height:34px;max-width:none;max-height:none}
.toast{background:var(--navy);font-family:var(--hand)}

/* ===== 底部抽屜（排程、外出、傳承點） ===== */
.modal{background:rgba(45,58,102,.38);backdrop-filter:blur(1px)}
/* 暫代：等專用的抽屜素材（上緣裝飾條）到位再換 */
.modal.sheet .box{background:var(--card);border:3px solid #b8dcc6;border-bottom:0;border-radius:24px 24px 0 0;padding:26px 16px 14px;box-shadow:0 -4px 18px rgba(45,58,102,.18);max-height:86vh}
.modal.sheet .box::before{display:block !important;content:"";position:absolute;top:9px;left:50%;width:46px;height:6px;margin-left:-23px;border-radius:99px;background:#cdbbec;transform:none}
.modal.sheet .box::after{display:none}
.modal .box h3{color:var(--navy);text-align:center;margin:0 0 6px;font-size:1.1rem}
.opt{text-align:left;margin:7px 0;padding:10px 24px 12px;min-height:56px}
.opt b{display:block;font-size:.98rem}
.opt small{color:var(--mute);font-weight:400;font-size:.72rem;line-height:1.35}
h4.cat{color:var(--mint);opacity:1;margin:12px 4px 0}
p.hintline{color:var(--navy2);opacity:.85;text-align:center}
.lrow button{min-height:34px;padding:4px 0;border-image-width:17px}

/* ===== 月結算：拍立得 ===== */
.modal .box.polaroid{background:#fff;border:0;border-radius:4px;padding:14px 14px 18px;max-width:380px;transform:rotate(-1.2deg);box-shadow:0 8px 24px rgba(45,58,102,.35);position:relative;overflow:visible}
.polaroid::before{content:"";position:absolute;top:-12px;left:50%;width:90px;height:24px;transform:translateX(-50%) rotate(2deg);
  background:repeating-linear-gradient(135deg,rgba(169,143,216,.7) 0 7px,rgba(255,255,255,.55) 7px 14px);box-shadow:0 1px 2px rgba(0,0,0,.15);z-index:2}
.pshot{position:relative;height:210px;overflow:hidden;border-radius:2px}
.pshot img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:100%;object-fit:contain;object-position:bottom}
.pcap{display:flex;justify-content:space-between;align-items:baseline;padding:12px 4px 4px}
.pcap b{font-size:1.15rem;color:var(--navy)}.pcap span{color:var(--mute);font-size:.9rem}
.polaroid .log{padding:4px;font-size:.95rem;line-height:1.9}
.polaroid .log hr{display:block;border:0;border-top:1.5px dashed #b8dcc6;margin:6px 0}
.polaroid .log br+i{display:block;color:var(--navy2)}
.polaroid .pact{text-align:right;margin-top:10px}
.up{color:#3f8f66}.down{color:var(--warn)}

/* ===== 標題 ===== */
.title{position:relative;overflow:hidden;gap:0;justify-content:flex-start;padding-top:3vh;display:flex;flex-direction:column;align-items:center;text-align:center;min-height:90vh}
.logo{text-align:center;z-index:2;width:100%}
.tframe{width:100%;max-width:420px;margin:0 auto;aspect-ratio:1000/358;background:url(../assets/ui/ui_title.png) center/100% 100% no-repeat;display:flex;align-items:center;justify-content:center;padding-top:8%}
.title h1{font-size:1.75rem;letter-spacing:.08em;margin:0;color:var(--navy);text-shadow:0 2px 0 #fff;border:0;padding:0}
.title p{color:var(--navy2);margin-top:2px}
.polaroid-t{position:relative;background:#fff;padding:10px;margin:18px 0 8px;box-shadow:0 6px 18px rgba(45,58,102,.25);transform:rotate(2.5deg);border-radius:4px}
.polaroid-t .title-ch{display:block;height:34vh;max-height:320px;background:linear-gradient(#fbf3dc 0 62%,#cfe6d6 62%);object-fit:contain}
.polaroid-t span{display:block;text-align:center;padding-top:8px;color:var(--navy2);letter-spacing:.1em}
.title input{width:240px;height:46px;border-radius:999px;border:2px solid var(--mint);background:#fffdf4;font-family:var(--hand);font-size:1rem;color:var(--navy);text-align:center;margin-top:8px;outline:none}
.title button{min-width:220px;margin-top:10px}

/* ===== 結局 ===== */
.end{background:none;border-style:solid;border-width:96px 26px 26px;border-radius:0;border-image:url(../assets/ui/ui_sheet.png) 250 70 70 fill/96px 26px 26px stretch;padding:0 6px 6px;margin-top:6vh}
.end small{margin-top:-46px;color:var(--mint);font-weight:600}
.end hr{border:0;border-top:1.5px dashed #b8dcc6}

/* —— 版面規則（從舊皮膚保留）—— */
.dialog .who{position:absolute}
.side{position:absolute;right:10px;top:14px;display:flex;flex-direction:column;gap:12px;z-index:3}
.side button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.toast{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);color:#fff;padding:8px 18px;border-radius:999px;z-index:30;font-size:.9rem;animation:blink2 1.4s ease-out forwards}
@keyframes blink2{0%{opacity:0;transform:translate(-50%,8px)}12%{opacity:1;transform:translate(-50%,0)}80%{opacity:1}100%{opacity:0}}
@keyframes blink{0%,100%{transform:translateY(0);opacity:1}50%{transform:translateY(3px);opacity:.45}}
.dialog .hint{position:absolute;animation:blink 1.1s ease-in-out infinite}
.modal.sheet .box{position:relative}
.stage .bgn{display:none}
/* 場景背景鋪滿整個畫面，上方狀態列與下方對話框直接浮在背景上 */
#app{background-color:var(--cream)}
.story .stage,.hm2 .portrait{background:none !important}
.stage::after,.portrait::after{display:none}

/* ===== v3：排程面板（專用素材）===== */
.modal.sheet .box{overflow:visible;max-height:none;padding-top:30px}
.modal.sheet .box::before{display:block !important;content:"";position:absolute;left:-4px;right:-4px;top:-34px;height:auto;aspect-ratio:1000/143;width:auto;margin:0;border-radius:0;
  background:url(../assets/ui/ui_sheet_top.png) center/100% 100% no-repeat;transform:none;pointer-events:none}
.modal.sheet .box h3{position:absolute;left:0;right:0;top:-12px;margin:0;font-size:.82rem;line-height:1;white-space:nowrap;z-index:2;color:var(--navy)}
#sl,#ls,#list,#lr{max-height:58vh;overflow:auto;padding:2px 2px 4px;margin:0 -4px}
/* 時段卡 */
.slotc{display:flex;align-items:center;gap:10px;width:100%;aspect-ratio:900/230;min-height:0;margin:6px 0;padding:0 18px 0 3.5%;text-align:left;
  border:0;border-image:none;background:url(../assets/ui/ui_slot.png) center/100% 100% no-repeat}
.slotc .sbadge{flex:none;width:17%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--navy2)}
.slotc .stx{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.slotc small{font-size:.7rem;color:var(--mute);font-weight:400}
.slotc b{font-size:1rem}
.slotc em{font-style:normal;font-size:.68rem;color:var(--navy2);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 活動選項卡 */
.actc{display:flex;align-items:center;gap:10px;width:100%;aspect-ratio:900/185;min-height:0;margin:5px 0;padding:0 16px 0 2.6%;text-align:left;
  border:0;border-image:none;background:url(../assets/ui/ui_actcard.png) center/100% 100% no-repeat}
.actc .asq{flex:none;height:62%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:10px;background-size:cover;background-position:center}
.actc .atx{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.actc b{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.actc b small{font-size:.66rem;color:var(--mute);font-weight:400;margin-left:2px}
.actc em{font-style:normal;font-size:.66rem;color:var(--navy2);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 分類小標籤 */
h4.cat{margin:12px 0 2px;opacity:1}
h4.cat span{display:inline-flex;align-items:center;height:28px;aspect-ratio:420/100;padding:0 0 0 22px;background:url(../assets/ui/ui_tab.png) center/100% 100% no-repeat;color:var(--navy);font-size:.78rem;letter-spacing:.1em}
/* 主畫面按鈕圖示 */
.dock button{display:flex;align-items:center;justify-content:center;gap:4px}
.dock button span{overflow:hidden;text-overflow:ellipsis;font-size:.85rem}
.dock .ico{width:24px;height:24px}

/* ===== 判定卡：靜態圖＋讀取條＋印章 ===== */
.actrun{align-items:center}
.arbox{width:100%;max-width:400px;background:var(--card);border:3px solid #b8dcc6;border-radius:22px;padding:14px 14px 12px;box-shadow:0 10px 30px rgba(45,58,102,.3)}
.arhead{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.artag{display:inline-flex;align-items:center;height:26px;aspect-ratio:420/100;padding-left:18px;background:url(../assets/ui/ui_tab.png) center/100% 100% no-repeat;font-size:.72rem;white-space:nowrap}
.arname{font-size:1.1rem}
.arpic{position:relative;aspect-ratio:3/2;border-radius:14px;overflow:hidden;cursor:pointer;background:#eef3ee}
.arph{position:absolute;inset:0}
.arch{position:absolute;left:50%;bottom:0;height:96%;transform:translateX(-50%)}
.aricon{position:absolute;right:10px;top:10px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.2))}
.arimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.arload{height:8px;border-radius:99px;background:#eef3ee;margin:12px 4px 6px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(45,58,102,.1)}
.arload i{display:block;height:100%;width:0;background:linear-gradient(90deg,#9fd8bb,var(--mint));border-radius:99px}
.arload.go i{animation:arfill 1.2s ease-in-out forwards}
@keyframes arfill{to{width:100%}}
.artip{text-align:center;font-size:.85rem;color:var(--navy2);margin:4px 0 8px;min-height:1.4em;line-height:1.6}
.aract{display:flex;justify-content:space-between;gap:10px}
.aract button{flex:1}
/* 印章 */
.stamp{position:absolute;left:50%;top:50%;width:132px;height:132px;margin:-66px 0 0 -66px;border-radius:50%;display:none;align-items:center;justify-content:center;
  font-size:1.5rem;font-weight:700;letter-spacing:.06em;transform:rotate(-14deg);background:rgba(255,253,244,.55);pointer-events:none}
.stamp.on{display:flex;animation:stampin .32s cubic-bezier(.2,1.6,.5,1) both}
.stamp.perfect{color:#e07b22;border:6px double #e07b22;box-shadow:0 0 0 3px rgba(224,123,34,.25)}
.stamp.success{color:#3f9a72;border:6px double #3f9a72}
.stamp.fail{color:#7a7f99;border:6px double #7a7f99;font-size:1.15rem}
@keyframes stampin{from{transform:rotate(-14deg) scale(2.2);opacity:0}to{transform:rotate(-14deg) scale(1);opacity:.95}}

/* ===== 結算卡（ui_settle）===== */
.settle{position:relative;width:min(94vw,400px);aspect-ratio:640/863;background:url(../assets/ui/ui_settle.png) center/100% 100% no-repeat}
.sphoto{position:absolute;left:7.8%;top:10.4%;width:83.8%;height:33.2%;border-radius:12% / 18%;overflow:hidden}
.sphoto img{position:absolute;left:50%;bottom:0;height:100%;transform:translateX(-50%)}
.stext{position:absolute;left:9%;right:9%;top:45.5%;bottom:16.5%;overflow:auto;font-size:.78rem;line-height:1.45}
.scap{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px}
.scap b{font-size:1.05rem}.scap span{color:var(--mute);font-size:.75rem}
.srow{padding:2px 0;border-bottom:1px dashed #cfe3d6;line-height:1.3}
.srow>span{display:block;font-weight:600;font-size:.74rem}
.srow em{font-style:normal;font-size:.68rem;display:block;line-height:1.3}
.srow em span{margin-right:4px}
.stotal{margin-top:6px;font-size:.78rem}
.stotal b{margin-right:6px}
.mini{font-style:normal;font-size:.62rem;padding:0 5px;border-radius:99px;border:1.5px solid;margin-left:2px;vertical-align:1px}
.mini.perfect{color:#e07b22}.mini.success{color:#3f9a72}.mini.fail{color:#7a7f99}
.sact{position:absolute;left:0;right:0;bottom:3.5%;text-align:center}
.sact button{min-width:150px}

/* ===== 視角：選項標題＋澄澄視角標籤 ===== */
.chhead{display:flex;align-items:center;gap:8px;align-self:center;padding:4px 14px 4px 4px;border-radius:999px;font-size:.82rem;font-weight:600;margin-bottom:2px;box-shadow:0 2px 6px rgba(45,58,102,.15)}
.chhead.mom{background:#fff3d6;color:#7a5520;border:2px solid #f3c46d}
.chhead.chen{background:#efe8fc;color:#5b4a8f;border:2px solid #b9a3e6}
.chav{width:28px;height:28px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#fff}
.chav img{width:100%;height:100%;object-fit:cover;object-position:50% 8%;transform:scale(2.4);transform-origin:50% 12%}
.choices.chen-pov button{}
.povtag{position:absolute;top:34px;left:12px;padding:3px 12px;border-radius:999px;background:#efe8fc;border:2px solid #b9a3e6;color:#5b4a8f;font-size:.75rem;font-weight:600;z-index:3}

/* ===== v4：選項改成底部滿版面板，標題放進上緣的小標題牌 ===== */
.story .choices{position:relative;margin:30px -16px -16px;padding:30px 18px 22px;gap:10px;background:var(--card);border-top:3px solid #b8dcc6;border-radius:24px 24px 0 0;box-shadow:0 -6px 18px rgba(45,58,102,.15)}
.story .choices::before{content:"";position:absolute;left:-2px;right:-2px;top:-36px;aspect-ratio:1000/143;background:url(../assets/ui/ui_sheet_top.png) center/100% 100% no-repeat;pointer-events:none}
.chhead,.chhead.mom,.chhead.chen{position:absolute;left:0;right:0;top:-13px;margin:0;padding:0;background:none;border:0;box-shadow:none;border-radius:0;display:block;text-align:center;font-size:.72rem;line-height:1;z-index:2;white-space:nowrap;top:-7px}
.chhead.mom{color:#8a5a14}
.chhead.chen{color:#6a54a8}

/* ===== v5：生日月份、零用錢、年度目標、節日標記 ===== */
.title label.pbm{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:.85rem;color:var(--navy2)}
.title select{font-family:var(--hand);font-size:.95rem;color:var(--navy);border:2px solid var(--mint);border-radius:999px;background:#fffdf4;padding:4px 12px}
.wal{display:flex;align-items:center;gap:6px;margin:10px 2px 0;font-size:.85rem}
.wal b{margin-left:auto}
.goalchip{position:absolute;left:12px;top:108px;display:flex;align-items:center;gap:6px;max-width:62%;background:rgba(255,253,244,.92);border:2px solid #b8dcc6;border-radius:16px;padding:5px 10px 5px 6px;box-shadow:0 3px 8px rgba(45,58,102,.15);z-index:3}
.goalchip span{display:flex;flex-direction:column;line-height:1.2;font-size:.75rem;font-weight:600;min-width:0}
.goalchip small{font-size:.6rem;color:var(--mint);font-weight:600}
.goalchip b{font-size:.8rem;color:var(--navy2);margin-left:4px;white-space:nowrap}
.hm2{position:relative}
.actc b .hmark,.actc b .npc{font-style:normal;font-size:.62rem;padding:1px 6px;border-radius:99px;margin-left:4px;vertical-align:2px}
.hmark{background:#ffe7b8;color:#a0620c;border:1.5px solid #f3b13d}
.npc{background:#e9f4ee;color:#3f7d5e;border:1.5px solid #b8dcc6}
.dock button{position:relative}
.dock .dot{position:absolute;right:6px;top:-6px;font-style:normal;font-size:.7rem;width:20px;height:20px;border-radius:50%;background:#f3b13d;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px rgba(0,0,0,.2)}

/* ===== v6：字體（劇情＝粉圓體；介面＝Noto Serif TC Bold）與對話框置中 ===== */
@font-face{font-family:"jf-openhuninn";src:url(../assets/fonts/jf-openhuninn-2.1.woff2) format("woff2");font-display:swap}
:root{--story:"jf-openhuninn","Yuanti TC","Hiragino Maru Gothic ProN","PingFang TC","Microsoft JhengHei",sans-serif;
  --ui:"Noto Serif TC","Noto Serif CJK TC","Songti TC","PMingLiU",serif;--hand:var(--ui)}
html,body,button,input,select{font-family:var(--ui);font-weight:700}
.dialog{display:flex;align-items:center;justify-content:center;min-height:170px}
.dialog .txt{margin:0;padding:4px 10px;width:100%;text-align:center;font-family:var(--story);font-weight:400;font-size:1.05rem;line-height:1.85;letter-spacing:.02em}
.artip,.stext,.end p,.polaroid .log{font-family:var(--story);font-weight:400}

/* ===== v7：立繪鋪在最底層，被下方的框蓋住（不再被場景區切斷）===== */
.story,.hm2{position:relative;display:flex;flex-direction:column;min-height:calc(100vh - 32px)}
@media(min-width:640px){.story,.hm2{min-height:calc(100vh - 68px)}}
.story .stage,.hm2 .portrait{position:absolute!important;left:-16px;right:-16px;top:-16px;bottom:-16px;width:auto;margin:0;min-height:0;z-index:0;flex:none;overflow:hidden;background:none!important}
.story #sb,.hm2 #sb{position:relative;z-index:3}
.story #ui{position:relative;z-index:2;margin-top:auto}
.stage .ch,.portrait img.ch{position:absolute;left:50%;bottom:0;top:auto;transform:translateX(-50%);height:calc(100% - 92px);max-height:none;max-width:none;width:auto;object-fit:contain;object-position:bottom}
.stage .ch.crop,.portrait img.ch.crop{height:64%}
.stage .datetag{top:104px!important;left:16px}
.hm2 .side{top:110px}
/* 主畫面底部：滿版面板（和選項面板同款） */
.hm2 .dock{position:relative;z-index:2;margin:auto -16px -16px;padding:30px 16px 20px;background:var(--card);border-top:3px solid #b8dcc6;border-radius:24px 24px 0 0;box-shadow:0 -6px 18px rgba(45,58,102,.15)}
.hm2 .dock::before{content:"";position:absolute;left:-2px;right:-2px;top:-36px;aspect-ratio:1000/143;background:url(../assets/ui/ui_sheet_top.png) center/100% 100% no-repeat;pointer-events:none}
.docktag{position:absolute;left:0;right:0;top:-7px;text-align:center;font-size:.72rem;line-height:1;color:var(--navy);z-index:2;pointer-events:none}
/* 對話框浮在立繪前面 */
.story .dialog{margin-top:0;margin-bottom:6px}
/* 立繪高度：腳剛好被下方的框蓋住（劇情框較高、主畫面按鈕列較矮） */
.story .stage .ch{bottom:150px;height:calc(100% - 100px - 150px)}
.hm2 .portrait img.ch{bottom:64px;height:calc(100% - 100px - 64px)}
.story .stage .ch.crop{bottom:0;height:64%}
.hm2 .portrait img.ch.crop{bottom:0;height:68%}
/* v8：立繪縮小一點、目標與展開箭頭變小、相簿等按鈕收進上方抽屜 */
.story .stage .ch{bottom:150px;height:calc(100% - 190px - 150px)}
.hm2 .portrait img.ch{bottom:64px;height:calc(100% - 190px - 64px)}
.tb2 .tog{height:18px;min-height:0;padding:0 12px;border-image-width:9px;font-size:.55rem;line-height:16px;bottom:-11px}
.goalchip{top:96px;left:10px;max-width:58%;padding:3px 9px 3px 5px;border-width:1.5px;border-radius:999px;gap:4px;background:rgba(255,253,244,.85);box-shadow:0 2px 5px rgba(45,58,102,.12)}
.goalchip span{flex-direction:row;font-size:.66rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.goalchip b{font-size:.68rem}
.menurow{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:12px;padding-top:10px;border-top:1.5px dashed #cfe3d6}
.menurow button[data-t]{flex:1;min-height:0;padding:4px 0;border:0;border-image:none;background:none;display:flex;flex-direction:column;align-items:center;gap:2px}
.menurow button[data-t] .ico{width:30px;height:30px}
.menurow button[data-t] span{font-size:.66rem;color:var(--navy2)}
.menurow .tolink{flex:none;font-size:.75rem;min-height:36px;padding:6px 16px}
.hm2 #sb{z-index:5}
.end p.epi{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fff6fa;border:1.5px dashed #f0b6c8;font-size:.9rem}

/* ===== v9：外出面板（近滿版，蓋過立繪，只列地點）===== */
.modal.outp{align-items:flex-end;padding:0}
.outp .box{position:relative;width:100%;max-width:480px;height:calc(100% - 84px);max-height:none;display:flex;flex-direction:column;padding:28px 16px 14px;
  background:var(--card);border:3px solid #b8dcc6;border-bottom:0;border-radius:24px 24px 0 0;box-shadow:0 -6px 20px rgba(45,58,102,.2);overflow:visible;animation:sheetup .22s ease-out}
.outp .box::before{content:"";position:absolute;left:-4px;right:-4px;top:-34px;aspect-ratio:1000/143;background:url(../assets/ui/ui_sheet_top.png) center/100% 100% no-repeat;pointer-events:none}
.outp .outhead h3{position:absolute;left:0;right:0;top:-8px;margin:0;text-align:center;font-size:.82rem;line-height:1;z-index:2}
.outp .outhead p{margin:4px 2px 8px;font-family:var(--story);font-weight:400;font-size:.8rem;color:var(--navy2);text-align:center;line-height:1.6}
.outlist{flex:1;overflow:auto;margin:0 -4px;padding:0 4px}
.outfoot{text-align:right;padding-top:10px}
.orow{display:block;width:100%;text-align:left;margin:6px 0;padding:10px 24px 12px;min-height:56px}
.orow b{display:block;font-size:.98rem}
.orow em{display:block;font-style:normal;font-weight:400;font-size:.7rem;color:var(--navy2);margin-top:2px;font-family:var(--story)}
.orow.on{filter:brightness(1.05);box-shadow:0 0 0 3px rgba(243,177,61,.6);border-radius:999px}
.orow .hmark,.orow .npc{font-style:normal;font-size:.62rem;padding:1px 6px;border-radius:99px;margin-left:6px;vertical-align:2px;font-weight:700}
.outp #list.outlist{max-height:none;min-height:0}
/* 手機 */
.phone .bub{max-width:82%;margin:8px 0;padding:8px 12px;border-radius:16px;font-family:var(--story);font-weight:400;font-size:.9rem;line-height:1.6}
.phone .bub.in{background:#fff;border:1.5px solid #cfe3d6;border-bottom-left-radius:4px}
.phone .bub.in small{display:block;font-size:.6rem;color:var(--mute)}
.phone .bub.out{margin-left:auto;background:#efe8fc;border:1.5px solid #c9b8ee;border-bottom-right-radius:4px;color:#4a3d7a}
.phone .reps{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin:4px 0 10px}
.phone .reps button{font-size:.8rem;min-height:38px;padding:6px 18px}
.menurow button[data-p]{flex:1;min-height:0;padding:4px 0;border:0;border-image:none;background:none;display:flex;flex-direction:column;align-items:center;gap:2px}
.menurow button[data-p] .ico{width:30px;height:30px}
.menurow button[data-p] span{font-size:.66rem;color:#a0620c}
/* 日記・成就・收藏 */
.info .dline{display:flex;gap:10px;padding:7px 4px;border-bottom:1px dashed #cfe3d6;font-size:.82rem;line-height:1.6}
.info .dline b{flex:none;width:2.6em;color:var(--mint)}
.info .dline span{font-family:var(--story);font-weight:400}
.achgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:4px 0}
.ach{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;padding:10px 6px;border-radius:14px;background:#f3f4f2;border:1.5px solid #e2e5e0;opacity:.6}
.ach.on{background:#fffaf0;border-color:#f3c46d;opacity:1}
.ach b{font-size:.8rem}.ach small{font-size:.62rem;color:var(--mute);font-weight:400;line-height:1.4}
.albgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;padding:4px 0 8px}
.alb{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;border-radius:12px;background:#fff;border:1.5px solid #cfe3d6;font-size:.72rem}
.alb span{display:flex;gap:3px}
.alb i{font-style:normal;font-size:.58rem;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eef0ee;color:#b5bab5}
.alb i.on{background:#ffe7b8;color:#a0620c}

/* ===== v10 物品欄・商店・衣櫃 ===== */
.outhead .tabs{display:flex;gap:6px;justify-content:center;margin:6px 0 2px}
.outhead .tabs button{flex:1;max-width:120px;min-height:36px;padding:4px 8px;font-size:.8rem}
.outhead .tabs button.on{filter:brightness(1.05);box-shadow:0 0 0 3px rgba(243,177,61,.55);border-radius:999px}
.outhead .tabs.pay button{max-width:none;font-size:.72rem;display:flex;align-items:center;justify-content:center;gap:3px}
.irow{display:flex;align-items:center;gap:10px;margin:6px 0;padding:8px 10px;background:#fff;border:1.5px solid #cfe3d6;border-radius:14px}
.irow.on{border-color:#f3b13d;background:#fffaf0}
.irow.own{opacity:.6}
.iic{position:relative;flex:none;width:42px;height:42px;border-radius:50%;background:#e9f4ee;display:flex;align-items:center;justify-content:center;overflow:hidden}
.iic i{font-style:normal;color:#3f7d5e;font-size:1rem}
.iic img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.iin{flex:1;min-width:0}
.iin b{display:block;font-size:.88rem;line-height:1.4}
.iin b small{font-size:.62rem;color:var(--mute);font-weight:400;margin-left:4px}
.iin em{display:block;font-style:normal;font-weight:400;font-family:var(--story);font-size:.7rem;color:var(--navy2);line-height:1.5}
.irow .ib{flex:none;min-height:34px;padding:4px 12px;font-size:.74rem;display:flex;align-items:center;gap:2px;white-space:nowrap}
.bedrow{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;padding:6px 0 10px;margin-bottom:4px;border-bottom:1.5px dashed #cfe3d6}
.bslot{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;border-radius:12px;background:#f4f6f4;border:1.5px dashed #cfe3d6;min-height:74px;justify-content:center}
.bslot.on{background:#fffaf0;border:1.5px solid #f3b13d}
.bslot span{font-size:.58rem;text-align:center;line-height:1.3;color:var(--navy2)}
.bslot .iic{width:34px;height:34px}
.ogrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:4px 0}
.ofit{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 4px 8px;min-height:0;border:1.5px solid #cfe3d6;border-image:none;border-radius:14px;background:#fff}
.ofit.on{border-color:#f3b13d;box-shadow:0 0 0 3px rgba(243,177,61,.4)}
.ofit.lock{opacity:.75;background:#f4f6f4}
.ofit .oth{width:100%;aspect-ratio:2/3;border-radius:10px;background:#eef6f1;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.ofit .oth img{width:100%;height:100%;object-fit:cover;object-position:top}
.ofit .oth i{font-style:normal;font-size:1.6rem;color:#b5bab5;margin:auto}
.ofit b{font-size:.68rem;line-height:1.3;text-align:center}
.ofit em{font-style:normal;font-weight:400;font-size:.56rem;color:var(--mute);text-align:center;line-height:1.3;font-family:var(--story)}
.alb.lk{background:#f4f6f4}
.alb small{font-size:.55rem;color:var(--mute);text-align:center;line-height:1.3;font-weight:400}
p.albsub{margin:8px 2px 0;font-size:.7rem;color:var(--navy2)}
.outfoot button .ico{vertical-align:-5px;margin-right:2px}
.hm2 .dock{grid-template-columns:1fr 1fr 1fr 1fr;gap:6px}
.hm2 .dock button{padding:11px 4px 12px;font-size:.84rem;gap:2px}
.hm2 .dock button span{font-size:.8rem}
.hm2 .dock .ico{width:20px;height:20px}
.hm2 .dock i{font-size:.66rem}
.hm2 .dock .primary{font-size:.9rem}
/* 通知：一行、置中、不換行縮排 */
.toast{width:max-content;max-width:calc(100vw - 32px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;font-family:var(--ui);font-size:.82rem;line-height:1.4;padding:8px 20px}
/* 選項：文字＋效果 */
.choices button{display:flex;flex-direction:column;align-items:center;gap:3px}
.choices button .ctx{display:block}
.choices button .cfx{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px;font-size:.7rem;line-height:1.3}
.choices button .cfx i{font-style:normal;font-weight:700}
.choices button .cfx i.up{color:#3f8a62}
.choices button .cfx i.down{color:#c0504d}
/* 結算卡：純文字（不放照片），只列排程 */
.settle2{position:relative;width:min(92vw,420px);max-height:86vh;display:flex;flex-direction:column;padding:22px 20px 18px;background:var(--card);border:3px solid #b8dcc6;border-radius:24px;box-shadow:0 10px 30px rgba(45,58,102,.25)}
.settle2 h3{margin:0 0 10px;text-align:center;font-size:1.1rem;color:var(--navy)}
.s2list{overflow:auto;flex:1;min-height:0}
.s2row{padding:9px 2px;border-bottom:1.5px dashed #cfe3d6}
.s2row b{display:flex;align-items:center;gap:6px;font-size:.98rem;line-height:1.4}
.s2row p,.s2total p{margin:4px 0 0;font-size:.9rem;line-height:1.6;font-family:var(--ui)}
.s2row p span,.s2total p span{margin-right:10px;white-space:nowrap}
.s2total{margin-top:10px;padding:10px 12px;background:#f3faf6;border-radius:14px}
.s2total b{font-size:1rem}
.s2act{text-align:center;padding-top:14px}
.s2act button{min-width:160px}
.settle2 .mini{font-size:.72rem}
/* ===== v11 外出地圖・地點・體力 ===== */
.stabar{display:flex;align-items:center;gap:8px;margin:6px 4px 2px;font-size:.78rem}
.stabar span{display:flex;align-items:center;gap:3px;flex:none}
.stabar .track{flex:1;height:10px;border-radius:99px;background:#e6efe9;overflow:hidden}
.stabar .fill{height:100%;background:linear-gradient(90deg,#ffcf6b,#f3a13d);border-radius:99px}
.stabar b{flex:none;font-size:.78rem}
.bar.sta .fill{background:linear-gradient(90deg,#ffcf6b,#f3a13d)}
.shopm{font-style:normal;font-size:.62rem;padding:1px 6px;border-radius:99px;margin-left:6px;vertical-align:2px;font-weight:700;background:#efe7fb;color:#6b4fa0;border:1.5px solid #c9b6ea}
.placep .phead{position:relative;height:120px;margin:-14px -6px 4px;border-radius:18px;overflow:hidden;display:flex;align-items:flex-end;gap:6px;padding:10px 14px;background-size:cover;background-position:center}
.placep .phead::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(30,40,70,.55))}
.placep .phead b{position:relative;z-index:1;color:#fff;font-size:1.15rem;text-shadow:0 1px 4px rgba(0,0,0,.4)}
.placep .phead .npc{position:relative;z-index:1;font-style:normal;font-size:.62rem;padding:1px 6px;border-radius:99px}
.placep #pm{font-size:.8rem;line-height:1.7;min-height:2.6em}
.placep #pm span{margin-right:8px;font-family:var(--ui);font-weight:700}
.placep #pm span.up{color:#3f8a62}.placep #pm span.down{color:#c0504d}
.irow.act .iin b{font-size:.92rem}
.orow.story{background-color:#fffaf0}
.slotc.trv{background-color:#fff7e6}
/* ===== 手機（暫代外框，等 ui_phone.png）===== */
.modal.phone{align-items:center;justify-content:center;padding:12px}
.phone .dev{width:min(86vw,350px);height:min(84vh,700px);padding:11px;border-radius:44px;background:linear-gradient(160deg,#c9b8ee,#a995dd);box-shadow:0 14px 40px rgba(45,58,102,.35),inset 0 0 0 2px rgba(255,255,255,.5)}
.phone .scr{position:relative;height:100%;border-radius:34px;background:#f7f9fc;overflow:hidden;display:flex;flex-direction:column}
.phone .sbar{display:flex;justify-content:space-between;align-items:center;padding:10px 22px 4px;font-size:.66rem;color:var(--navy);font-family:var(--ui)}
.phone .notch{width:84px;height:20px;border-radius:0 0 14px 14px;background:#2d3a66;margin-top:-10px}
.phone .sig{display:flex;gap:2px;align-items:flex-end}.phone .sig i{width:3px;background:var(--navy);border-radius:1px}.phone .sig i:nth-child(1){height:4px}.phone .sig i:nth-child(2){height:7px}.phone .sig i:nth-child(3){height:10px}
.phone .ahead{display:flex;align-items:center;justify-content:space-between;padding:6px 12px 8px;border-bottom:1px solid #e3e8ef;background:#fff}
.phone .ahead b{font-size:.95rem}
.phone .ahead button,.phone .ahead span{width:36px;min-height:32px;padding:0;border:0;border-image:none;background:none;font-size:1.5rem;line-height:1;color:var(--navy)}
.phone .plist{flex:1;overflow:auto;padding:8px 12px}
.phone .crow{display:flex;align-items:center;gap:10px;width:100%;min-height:0;padding:10px 6px;border:0;border-image:none;background:none;border-bottom:1px solid #eef1f5;border-radius:0;text-align:left}
.phone .crow .av{flex:none;width:42px;height:42px;border-radius:50%;background:#e9f4ee;color:#3f7d5e;display:flex;align-items:center;justify-content:center;font-size:1rem;border:2px solid #fff;box-shadow:0 0 0 1.5px #cfe3d6}
.phone .crow .cin{flex:1;min-width:0}
.phone .crow b{display:block;font-size:.88rem}
.phone .crow em{display:block;font-style:normal;font-weight:400;font-size:.72rem;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--story)}
.phone .crow .unr{flex:none;font-style:normal;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:#f08a7e;color:#fff;font-size:.66rem;display:flex;align-items:center;justify-content:center}
.phone .homebar{min-height:0;height:26px;padding:0;border:0;border-image:none;background:none;display:flex;align-items:center;justify-content:center}
.phone .homebar i{width:110px;height:5px;border-radius:99px;background:#2d3a66;opacity:.75}
/* 選擇後的加減通知 */
.gainnote{position:fixed;left:50%;top:18%;transform:translateX(-50%);z-index:40;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 12px;max-width:calc(100vw - 40px);width:max-content;padding:10px 22px;border-radius:999px;background:rgba(255,253,246,.96);border:2px solid #b8dcc6;box-shadow:0 6px 18px rgba(45,58,102,.2);font-family:var(--ui);font-weight:700;font-size:.92rem;animation:gainpop 1.8s ease-out forwards;pointer-events:none}
.gainnote .up{color:#3f8a62}.gainnote .down{color:#c0504d}
@keyframes gainpop{0%{opacity:0;transform:translate(-50%,8px)}12%{opacity:1;transform:translate(-50%,0)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-6px)}}
/* ===== v12 小鎮地圖（暫代底圖，等 ui_map_<頁>.png）===== */
.mapp .box{padding-bottom:10px}
.mapp .tabs button{position:relative}
.mapp .tabs .dot{position:absolute;right:-4px;top:-6px;font-style:normal;font-size:.62rem;width:18px;height:18px;border-radius:50%;background:#f3b13d;color:#fff;display:flex;align-items:center;justify-content:center}
.mapcv{position:relative;flex:1;min-height:0;margin:6px 0 4px;border-radius:20px;overflow:hidden;border:2px solid #cfe3d6;background-size:cover;background-position:center}
.mapcv.pg-home{background-color:#eaf5e8;background-image:radial-gradient(circle at 20% 30%,#d8eed3 0 18%,transparent 19%),radial-gradient(circle at 75% 70%,#f6eedb 0 20%,transparent 21%),linear-gradient(90deg,transparent 47%,#f4ead6 47% 53%,transparent 53%),linear-gradient(0deg,transparent 56%,#f4ead6 56% 61%,transparent 61%)}
.mapcv.pg-city{background-color:#eef0f7;background-image:linear-gradient(90deg,transparent 38%,#e5e2ef 38% 44%,transparent 44%),linear-gradient(90deg,transparent 70%,#e5e2ef 70% 75%,transparent 75%),linear-gradient(0deg,transparent 30%,#e5e2ef 30% 35%,transparent 35%),linear-gradient(0deg,transparent 62%,#e5e2ef 62% 67%,transparent 67%)}
.mapcv.pg-out{background-color:#e4f2ea;background-image:radial-gradient(ellipse at 70% 30%,#cfe6d6 0 30%,transparent 31%),radial-gradient(ellipse at 20% 80%,#d6ecf4 0 25%,transparent 26%)}
.mapcv.art{background-color:transparent}
.pin{position:absolute;transform:translate(-50%,-50%);min-height:0;padding:6px 10px 7px;border:2px solid #b8dcc6;border-image:none;border-radius:14px;background:#fffdf6;box-shadow:0 3px 8px rgba(45,58,102,.15);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px 4px;max-width:44%;text-align:center}
.pin b{font-size:.78rem;line-height:1.25}
.pin .hmark,.pin .shopm{font-style:normal;font-size:.58rem;padding:0 5px;border-radius:99px;margin:0;font-weight:700}
.pin .who{flex-basis:100%;font-size:.6rem;color:#3f7d5e;font-weight:700}
.pin em{flex-basis:100%;font-style:normal;font-size:.56rem;color:var(--mute)}
.pin.lock{opacity:.55;background:#f2f2f2;border-style:dashed}
.pin.been{border-color:#f3b13d}
.mapnote{margin:2px 4px 0;font-size:.7rem;color:var(--navy2);text-align:center;font-family:var(--story);font-weight:400;line-height:1.6}
/* 互動卡：文字 → 讀取 → 加成 */
.modal.ixm{align-items:center;justify-content:center}
.ixc{width:min(90vw,380px);padding:14px 16px 16px;background:var(--card);border:3px solid #b8dcc6;border-radius:22px;box-shadow:0 10px 30px rgba(45,58,102,.25);text-align:center}
.ixpic{position:relative;height:110px;border-radius:14px;overflow:hidden;background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:8px 12px}
.ixpic b{position:relative;z-index:1;color:#fff;font-size:.85rem;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.ixpic::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(30,40,70,.5))}
.ixc h3{margin:10px 0 4px;font-size:1rem}
.ixtx p{margin:4px 0;font-family:var(--story);font-weight:400;font-size:.92rem;line-height:1.8}
.ixc .arload{margin:10px auto 4px;width:70%}
.ixres{min-height:1.8em;margin-top:8px;font-family:var(--ui);font-weight:700;font-size:.95rem;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 12px}
.ixres .up{color:#3f8a62}.ixres .down{color:#c0504d}
.ixact{margin-top:10px}.ixact button{min-width:140px}
/* 收入加成標籤 */
.famtag{font-style:normal;font-size:.68rem;padding:1px 8px;border-radius:99px;margin-left:6px}
.famtag.up{background:#fde3ea;color:#b44a6a}.famtag.down{background:#eceff3;color:#6b7280}
/* 手機功能 */
.phone .papps{padding:6px 2px 10px;border-bottom:1px solid #eef1f5;margin-bottom:4px}
.phone .papps h4{margin:2px 4px 4px;font-size:.8rem;color:var(--navy2)}
.phone .pstabar .stabar{margin:2px 4px 6px;font-size:.7rem}
.phone .pbtns{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.phone .papp{min-height:0;padding:8px 6px;border:1.5px solid #dfe6ee;border-image:none;border-radius:14px;background:#fff;display:flex;flex-direction:column;align-items:center;gap:2px}
.phone .papp b{font-size:.74rem}.phone .papp em{font-style:normal;font-weight:400;font-size:.6rem;color:var(--mute)}
.pin b{white-space:nowrap}
.pin{max-width:none}

/* ===== v13 第三批素材 ===== */
/* 通知條 */
.toast{background:none;border-style:solid;border-width:10px 18px 10px 34px;border-image:url(../assets/ui/ui_toast.png) 30 50 30 95 fill / 10px 18px 10px 34px;border-radius:0;padding:0 6px;line-height:1.6;box-shadow:none}
/* 分頁按鈕 */
.outhead .tabs{gap:6px;align-items:flex-start}
.outhead .tabs button{flex:1;max-width:116px;min-height:0;height:auto;padding:0 0 4px;border:0;border-image:none;border-radius:0;box-shadow:none;background:url(../assets/ui/ui_tab_off.png) center/100% 100% no-repeat;aspect-ratio:1000/260;font-size:.8rem;color:var(--navy2);display:flex;align-items:center;justify-content:center}
.outhead .tabs button.on{background-image:url(../assets/ui/ui_tab_on.png);aspect-ratio:1000/301;padding-bottom:8px;color:#fff;text-shadow:0 1px 2px rgba(45,58,102,.35);filter:none;box-shadow:none}
.outhead .tabs.pay button{aspect-ratio:auto;height:34px;max-width:none;background-size:100% 100%}
.outhead .tabs.pay button.on{height:38px}
/* 體力條 */
.stabar{gap:6px}
.stabar .sbf{position:relative;flex:1;max-width:240px;aspect-ratio:1000/148;background:url(../assets/ui/ui_stabar.png) center/100% 100% no-repeat}
.stabar .sbf img{position:absolute;left:1.2%;top:12%;height:76%;z-index:1}
.stabar .sbf .tr{position:absolute;left:14.5%;right:3%;top:27%;bottom:27%;border-radius:99px;overflow:hidden}
.stabar .sbf .tr i{display:block;height:100%;background:linear-gradient(90deg,#ffd57a,#f3a13d);border-radius:99px}
.stabar .track{display:none}
/* 小鎮地圖 */
.mapwrap{flex:1;min-height:0;display:flex;justify-content:center;margin:6px 0 4px}
.mapwrap .mapcv{flex:none;height:100%;width:auto;max-width:100%;aspect-ratio:720/1279;margin:0}
.mapcv.art{background-size:100% 100%;border-color:#b8dcc6}
.mapcv.art .pin{background:rgba(255,253,246,.92);padding:3px 7px 4px;border-width:1.5px;border-radius:10px}
.mapcv.art .pin b{font-size:.68rem}
.mapcv.art .pin.lock{background:rgba(240,240,240,.85)}
/* 地點頁：照片框 */
.placep .phead{position:relative;height:auto;aspect-ratio:1000/480;margin:-14px -6px 2px;padding:0;border-radius:0;overflow:visible;background:none!important;display:block}
.placep .phead::after{display:none}
.placep .phwin{position:absolute;left:5.6%;top:20.6%;right:6.4%;bottom:15.4%;border-radius:14px;background-size:cover;background-position:center}
.placep .phframe{position:absolute;inset:0;background:url(../assets/ui/ui_place_frame.png) center/100% 100% no-repeat;pointer-events:none}
.placep .phead b{position:absolute;left:4%;bottom:2.5%;width:25%;text-align:center;color:var(--navy);text-shadow:none;font-size:.72rem;z-index:2}
/* 地點動作／劇情／一般列 */
.irow.act{background:none;border-style:solid;border-width:12px 18px 12px 22px;border-image:url(../assets/ui/ui_placeact.png) 40 60 40 80 fill / 12px 18px 12px 22px;border-radius:0;padding:2px 4px;margin:4px 0}
.irow.act.story{border-width:12px 18px 12px 52px;border-image:url(../assets/ui/ui_placestory.png) 50 120 50 220 fill / 12px 18px 12px 52px;position:relative}
.irow.act.story .stico{position:absolute;left:-44px;top:50%;width:34px;height:34px;transform:translateY(-50%)}
.irow.act.story .iin b{display:flex;align-items:center}
.placep .orow,.shopp .orow{background:none;border-style:solid;border-width:12px 34px 12px 22px;border-image:url(../assets/ui/ui_place.png) 60 200 60 110 fill / 12px 34px 12px 22px;border-radius:0;padding:4px 6px;min-height:0}
/* 商店 */
.shophead{position:relative;aspect-ratio:1000/287;margin:-16px -4px 0;background:url(../assets/ui/ui_shop_head.png) center/100% 100% no-repeat}
.shophead b{position:absolute;left:22%;right:22%;top:58%;transform:translateY(-50%);text-align:center;font-size:.92rem;color:var(--navy)}
.shopp .outhead h3{display:none}
.irow.goods{position:relative;background:none;border-style:solid;border-width:12px 64px 12px 64px;border-image:url(../assets/ui/ui_goods.png) 60 260 60 280 fill / 12px 64px 12px 64px;border-radius:0;padding:2px 4px;margin:5px 0}
.irow.goods .iic{position:absolute;left:-56px;top:50%;transform:translateY(-50%);width:44px;height:44px;background:none}
.irow.goods .ib{position:absolute;right:-58px;top:50%;transform:translateY(-38%);width:48px;min-height:0;padding:0;border:0;border-image:none;background:none;box-shadow:none;font-size:.7rem;font-weight:700;color:#7a5520;justify-content:center;flex-direction:column;gap:0}
.irow.goods .ib .ico{width:12px;height:12px}
.irow.goods .ib:disabled{opacity:.45}
.irow.goods.own{opacity:.55}
/* 結算卡（純文字） */
.settle2{width:min(92vw,400px);max-height:none;aspect-ratio:1000/1304;padding:15% 9% 8%;background:url(../assets/ui/ui_settle_text.png) center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none}
.settle2 h3{position:absolute;left:24%;right:24%;top:2.4%;margin:0;font-size:.82rem;line-height:1.5;text-align:center}
.s2total{background:rgba(232,245,238,.8)}
/* 物品欄：格子、床頭櫃、衣櫃 */
.igrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:6px 2px}
.islot{position:relative;aspect-ratio:1;min-height:0;padding:0;border:0;border-image:none;border-radius:0;box-shadow:none;background:url(../assets/ui/ui_itemslot.png) center/100% 100% no-repeat}
.islot .iic{position:absolute;left:16%;top:14%;width:68%;height:68%;background:none;border-radius:0}
.islot .iic i{font-size:1.1rem}
.islot .icount{position:absolute;right:3%;bottom:3%;width:20%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:.62rem;color:#fff}
.islot.sel{filter:drop-shadow(0 0 4px rgba(243,177,61,.9))}
.islot.onbed::after{content:"床頭";position:absolute;left:4%;top:4%;font-size:.5rem;padding:0 4px;border-radius:99px;background:#f3b13d;color:#fff}
.idet{display:flex;align-items:center;gap:10px;margin:4px 0 2px;padding:8px 12px;background:#fffaf0;border:1.5px solid #f3d9a6;border-radius:14px}
.idet .iin{flex:1}
.idet .ib{flex:none;min-height:38px;padding:4px 16px;font-size:.8rem}
.bedside{position:relative;width:100%;aspect-ratio:1000/427;background:url(../assets/ui/ui_bedside.png) center/100% 100% no-repeat;margin:4px 0 6px}
.bpad{position:absolute;bottom:62%;width:14%;aspect-ratio:1;transform:translateX(-50%);cursor:pointer}
.bpad .iic{width:100%;height:100%;background:none;border-radius:0}
.bpad.p0{left:24%}.bpad.p1{left:38%}.bpad.p2{left:51.5%}.bpad.p3{left:65%}.bpad.p4{left:78.5%}
.ogrid{gap:10px}
.ofit{position:relative;padding:0;border:0;border-image:none;border-radius:0;box-shadow:none;background:url(../assets/ui/ui_outfitcard.png) center/100% 100% no-repeat;aspect-ratio:941/1509;display:block}
.ofit.lock{background-image:url(../assets/ui/ui_outfitcard_lock.png);aspect-ratio:940/1487;opacity:1}
.ofit .oth{position:absolute;left:9.5%;top:21%;right:10%;bottom:19.5%;width:auto;aspect-ratio:auto;border-radius:12%/9%;background:#f6f9f7}
.ofit.lock .oth{display:none}
.ofit b{position:absolute;left:12%;right:12%;bottom:3.5%;font-size:.6rem;line-height:1.2;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ofit em{position:absolute;left:0;right:0;top:100%;margin-top:2px;font-size:.52rem}
.ofit em.wearing{top:auto;bottom:-14px;color:#a0620c;font-weight:700}
.ofit.on{box-shadow:none;filter:drop-shadow(0 0 5px rgba(243,177,61,.9))}
.bag .ogrid{row-gap:22px;padding-bottom:16px}
/* 手機：外框圖（右邊吊繩超出畫面也沒關係，螢幕置中） */
.modal.phone{display:block;overflow:hidden;padding:0}
.phone .dev{position:absolute;left:50%;top:50%;width:auto;height:min(94vh,calc((100vw - 20px) * 2.545));aspect-ratio:890/1542;transform:translate(-41.6%,-50%);padding:0;border-radius:0;background:url(../assets/ui/ui_phone.png) center/100% 100% no-repeat;box-shadow:none}
.phone .scr{position:absolute;left:7.9%;top:10.4%;width:67.6%;height:85%;border-radius:26px}
.phone .sbar{padding:8px 18px 2px}
.phone .bub{background:none;border-style:solid;border-radius:0}
.phone .bub.in{border-width:10px 18px 14px 16px;border-image:url(../assets/ui/ui_bubble_l.png) 80 140 90 110 fill / 10px 18px 14px 16px;padding:0 4px}
.phone .bub.out{border-width:10px 16px 12px 14px;border-image:url(../assets/ui/ui_bubble_r.png) 60 120 70 100 fill / 10px 16px 12px 14px;padding:0 4px;color:#2f5d48}
.phone .crow .av{background:#eef6f1 url(../assets/ui/ui_avatar.png) center/100% 100% no-repeat;border:0;box-shadow:none;width:44px;height:44px}
.outhead .tabs button{color:var(--navy);font-weight:700}
.outhead .tabs button.on{color:var(--navy);text-shadow:0 1px 0 rgba(255,255,255,.7)}
.ofit:disabled,.ofit.lock{background-color:transparent!important;border-image:none!important;opacity:1!important;filter:none!important}
.ofit.lock{background:url(../assets/ui/ui_outfitcard_lock.png) center/100% 100% no-repeat!important}
.ofit.lock b{color:var(--mute)}
/* ===== v14 手機 APP、寵物 ===== */
.phone .appgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 6px;padding:10px 4px}
.phone .appi{position:relative;min-height:0;padding:0;border:0;border-image:none;background:none;box-shadow:none;display:flex;flex-direction:column;align-items:center;gap:4px}
.phone .aico{position:relative;width:58px;height:58px;border-radius:16px;background:#e9f4ee;display:flex;align-items:center;justify-content:center;overflow:hidden}
.phone .aico img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.phone .aico i{font-style:normal;font-size:1.2rem;color:#3f7d5e}
.phone .appi b{font-size:.7rem;font-weight:700}
.phone .appi .unr{position:absolute;right:6px;top:-4px;font-style:normal;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#f08a7e;color:#fff;font-size:.62rem;display:flex;align-items:center;justify-content:center}
.phone #hb{display:flex;gap:4px;width:auto;font-size:.9rem}
.phone .hbtn{width:32px;height:32px;min-height:0;padding:0;border:0;border-image:none;background:none;box-shadow:none}
.phone .hbtn img{width:100%;height:100%}
.phone .tpdot{font-style:normal;font-size:.56rem;margin-left:6px;padding:0 6px;border-radius:99px;background:#ffe7b8;color:#a0620c}
.phone .topics{display:flex;flex-direction:column;align-items:flex-end;gap:6px;margin:8px 0 6px;padding-top:8px;border-top:1px dashed #dfe6ee}
.phone .topics small{font-size:.62rem;color:var(--mute)}
.phone .topics button{min-height:0;padding:7px 14px;font-size:.76rem;border-radius:16px;background:#eef7f2;border:1.5px solid #b8dcc6;border-image:none;max-width:90%;text-align:left}
.phone .papp.wide{width:100%;margin:5px 0;flex-direction:row;justify-content:space-between;padding:10px 12px}
.portrait{position:relative}
.petimg{position:absolute;right:6%;bottom:16%;width:30%;max-width:150px;z-index:1;pointer-events:none;filter:drop-shadow(0 4px 6px rgba(45,58,102,.18))}
.petcard{text-align:center;padding:10px 0}
.petpic{position:relative;width:60%;max-width:220px;aspect-ratio:1;margin:0 auto;border-radius:50%;background:#f3faf6;display:flex;align-items:center;justify-content:center}
.petpic img{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain}
.petpic i{font-style:normal;font-size:2.4rem;color:#9cc7ad}
.petcard h3{margin:10px 0 2px;font-size:1.1rem}
.petcard p{margin:4px 0;font-size:.8rem;color:var(--navy2);font-family:var(--story);font-weight:400}
.menurow button[data-o]{flex:1;min-height:0;padding:4px 0;border:0;border-image:none;background:none;display:flex;flex-direction:column;align-items:center;gap:2px}
.menurow button[data-o] .ico{width:30px;height:30px}
.menurow button[data-o] span{font-size:.66rem;color:var(--navy2)}
.irow.act.couple{border-image-source:url(../assets/ui/ui_placestory.png);border-image-slice:50 120 50 220 fill;border-width:12px 18px 12px 22px}
/* ===== v15 地點：全螢幕場景＋行動按鈕 ===== */
.modal.placev{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:0;background-size:cover;background-position:center;background-color:#cfe3d6}
.placev::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(30,40,70,.25),transparent 22%,transparent 45%,rgba(30,40,70,.15));pointer-events:none}
.pvtop{position:relative;display:flex;align-items:center;gap:10px;padding:max(14px,env(safe-area-inset-top)) 14px 6px}
.pvback{min-height:0;padding:6px 14px 7px;font-size:.82rem}
.pvname{flex:1;text-align:center;margin-right:64px;padding:6px 0 7px;font-size:1rem;color:var(--navy);background:url(../assets/ui/ui_tab_off.png) center/100% 100% no-repeat;max-width:220px;margin-left:auto;margin-right:auto}
.pvsta{position:relative;margin:2px 14px 0;padding:4px 10px;background:rgba(255,253,246,.88);border-radius:99px;max-width:300px;align-self:center;width:calc(100% - 28px)}
.pvsta .stabar{margin:0}
.pvdesc{position:relative;align-self:center;margin:8px 16px 0;padding:4px 12px;border-radius:99px;background:rgba(255,253,246,.8);font-family:var(--story);font-weight:400;font-size:.74rem;color:var(--navy2);text-align:center}
.pvsheet{position:relative;margin-top:auto;max-height:56vh;display:flex;flex-direction:column;padding:26px 12px 14px;background:rgba(255,253,246,.94);border-top:3px solid #b8dcc6;border-radius:24px 24px 0 0;box-shadow:0 -6px 18px rgba(45,58,102,.18)}
.pvsheet::before{content:"";position:absolute;left:-2px;right:-2px;top:-34px;aspect-ratio:1000/143;background:url(../assets/ui/ui_sheet_top.png) center/100% 100% no-repeat;pointer-events:none}
.pvlist{overflow:auto;min-height:0}
.pvsec{margin:6px 2px 4px;font-size:.72rem;color:var(--mint)}
.pvsec span{display:inline-flex;align-items:center;height:24px;aspect-ratio:420/100;padding-left:18px;background:url(../assets/ui/ui_tab.png) center/100% 100% no-repeat;color:var(--navy)}
.pvgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pvb{min-height:0;padding:8px 10px 9px;display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;border-radius:16px}
.pvb b{font-size:.84rem;line-height:1.3;display:flex;align-items:center;gap:3px}
.pvb em{font-style:normal;font-weight:400;font-size:.62rem;color:var(--navy2);line-height:1.35;font-family:var(--story)}
.pvb small{margin-top:3px;font-size:.62rem;font-weight:700;color:#a0620c}
.pvb .stico{width:18px;height:18px}
.pvb.story{background-color:#fff7e3}
.pvb.couple small{color:#b44a6a}
.pvb:disabled small{color:var(--mute)}
.pvsheet .docktag{top:-7px}
/* ===== v16 地點：按鈕直接浮在背景上 ===== */
.placev::before{background:linear-gradient(rgba(30,40,70,.22),transparent 18%,transparent 55%,rgba(30,40,70,.12))}
.pvsheet{background:none;border:0;box-shadow:none;border-radius:0;padding:0 12px max(14px,env(safe-area-inset-bottom));max-height:62vh}
.pvsheet::before,.pvsheet .docktag{display:none}
.pvlist{display:flex;flex-direction:column;gap:2px}
.pvsec{display:flex;justify-content:center;margin:8px 0 4px}
.pvsec span{height:auto;aspect-ratio:auto;padding:3px 14px;background:rgba(255,253,246,.92);border-radius:99px;border:1.5px solid #b8dcc6;font-size:.7rem;font-weight:700;color:#3f7d5e;box-shadow:0 2px 6px rgba(45,58,102,.15)}
.pvsec.scouple span{border-color:#f2b3c6;color:#b44a6a}
.pvsec.scouple span::before{content:"♥ ";color:#e98aa8}
.pvsec.sstory span{border-color:#f3c86b;color:#a0620c}
.pvsec.sshop span{border-color:#c9b6ea;color:#6b4fa0}
.pvgrid{gap:8px}
.pvb{position:relative;isolation:isolate;min-height:0;padding:9px 26px 10px 20px;border:0;border-image:none;background:none;box-shadow:none;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:1px;filter:drop-shadow(0 3px 5px rgba(45,58,102,.2))}
.pvb::before{content:"";position:absolute;inset:0;z-index:-1;border-style:solid;border-width:10px 30px 10px 22px;border-image:url(../assets/ui/ui_place.png) 60 200 60 110 fill / 10px 30px 10px 22px}
.pvb b{justify-content:center;font-size:.86rem;line-height:1.3}
.pvb em{font-style:normal;font-family:var(--story);font-weight:400;font-size:.66rem;line-height:1.35;color:var(--navy2)}
.pvb.scouple::before{filter:hue-rotate(300deg) saturate(1.3)}
.pvb.scouple em{color:#b44a6a}
.pvb.sstory{padding-left:44px}
.pvb.sstory::before{border-width:10px 22px 10px 44px;border-image:url(../assets/ui/ui_placestory.png) 50 120 50 220 fill / 10px 22px 10px 44px}
.pvb.sstory .stico{position:absolute;left:12px;top:50%;width:24px;height:24px;transform:translateY(-50%)}
.pvb.sshop::before{filter:hue-rotate(230deg) saturate(.9)}
.pvb:disabled{opacity:.6;filter:grayscale(.3) drop-shadow(0 3px 5px rgba(45,58,102,.2))}
.pvb:disabled em{color:var(--mute)}
.pvsta{background:rgba(255,253,246,.9)}
.pvgrid>.pvb:only-child{grid-column:1/-1;justify-self:center;min-width:62%}
/* 置中修正：按鈕群組改成置中換行，左右留白對稱 */
.pvgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.pvgrid>.pvb{flex:0 1 calc(50% - 4px);min-width:0}
.pvgrid>.pvb:only-child{flex-basis:62%;min-width:0;justify-self:auto}
.pvb{padding:10px 24px 10px 24px;text-align:center;align-items:center}
.pvb b,.pvb em{width:100%;text-align:center;display:block}
.pvb.sstory{padding:10px 24px 10px 46px}
.pvb.sstory b,.pvb.sstory em{margin-left:-11px}
/* 置中修正：排程卡、活動卡的文字不要貼著圓徽章／圖示框 */
/* 圖示直接放進卡片美術左邊畫好的框／圓裡（位置量自 ui_actcard 900×185、ui_slot 900×230），不再另外加框 */
.slotc,.actc{position:relative;gap:0}
.slotc{padding:0 6% 0 26%}
.actc{padding:0 5% 0 21%}
.slotc .sbadge{position:absolute;left:4%;top:11.3%;width:19.3%;height:75.7%;aspect-ratio:auto;margin:0;border-radius:50%;background:none;border:0}
.actc .asq{position:absolute;left:3.7%;top:16.5%;width:14.4%;height:67%;aspect-ratio:auto;margin:0;border:0;box-shadow:none;background-color:transparent;border-radius:18% / 22%}
.actc .asq[style*="background-image"]{left:4.1%;top:18.5%;width:13.6%;height:63%}
.slotc .sbadge .ico{width:52%;height:auto}
.actc .asq .ico{width:62%;height:auto}
.slotc .stx,.actc .atx{flex:1;margin:0;padding:0}
/* 置中修正：緞帶分類標籤的字要在緞帶中間（左邊小圓點、右邊燕尾都扣掉） */
h4.cat span,.pvsec span{justify-content:center}
h4.cat span{padding:0 18px 0 16px;min-width:118px;box-sizing:border-box}
.artag{justify-content:center;padding:0 16px 0 14px}
/* ===== 結局 CG ===== */
.cgv{position:fixed;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;z-index:60;background:#1d2238;overflow:hidden;cursor:pointer;animation:cgin .5s ease both}
.cgv.over{z-index:200}
.cgv.out{animation:cgout .45s ease both}
@keyframes cgin{from{opacity:0}to{opacity:1}}
@keyframes cgout{from{opacity:1}to{opacity:0}}
.cgv .cgimg{position:absolute;inset:0;background:center/cover no-repeat}
.cgv.nocg .cgimg{filter:saturate(.85) brightness(.92) blur(1.5px);transform:scale(1.04)}
.cgv.nocg .cgimg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,rgba(255,250,235,.35),rgba(255,240,245,.15) 55%,rgba(45,58,102,.25))}
.cgv .cgchap{position:absolute;top:18px;left:0;right:0;display:flex;justify-content:center}
.cgv .cgchap span{padding:4px 18px;border-radius:99px;background:rgba(255,253,244,.88);color:var(--navy2);font-size:.8rem;letter-spacing:.2em;box-shadow:0 2px 8px rgba(45,58,102,.18)}
.cgv .cgbox{position:absolute;left:14px;right:14px;bottom:22px;min-height:150px;padding:18px 22px 26px;border-radius:22px;background:rgba(255,253,244,.93);
  border:2px solid #cfe6d6;box-shadow:0 10px 30px rgba(29,34,56,.28);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.cgv .cgbox h3{margin:0 0 8px;font-size:1.05rem;color:var(--navy);letter-spacing:.08em}
.cgv .cgbox p{margin:0;font-family:var(--story);font-size:1.02rem;line-height:1.85;color:var(--navy)}
.cgv .cgbox p.in{animation:cgin .5s ease both}
.cgv .cgnext{position:absolute;right:18px;bottom:8px;font-style:normal;font-size:.7rem;color:var(--mint);animation:blink 1.1s ease-in-out infinite}
.cgv.cgblack{background:#1d2238;display:flex;align-items:center;justify-content:center}
.cgv .lat{color:#fffaf0;font-family:var(--story);font-size:1.5rem;letter-spacing:.3em;padding-left:.3em;animation:cgin 1.4s ease both}
.cgv.cgpick{cursor:default}
.cgv.cgpick .cgimg{filter:brightness(.7) blur(2px);transform:scale(1.04)}
.cgv .pickbox{position:absolute;left:14px;right:14px;top:62px;bottom:18px;display:flex;flex-direction:column;padding:16px 14px 12px;border-radius:22px;background:rgba(255,253,244,.95);border:2px solid #cfe6d6;box-shadow:0 10px 30px rgba(29,34,56,.28);text-align:center}
.cgv .pickbox h3{margin:2px 0 4px;color:var(--navy)}
.cgv .pickbox .hintline{margin:0 0 10px;font-size:.8rem}
.cgv .plist{flex:1;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:start;padding:2px}
.cgv .pko{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:62px;padding:8px 6px;border-radius:16px;background:#fff;border:2px solid #cfe6d6;color:var(--navy);text-align:center}
.cgv .pko b{font-size:.98rem;display:flex;align-items:center;gap:4px}
.cgv .pko b i{font-style:normal;font-size:.62rem;padding:1px 7px;border-radius:99px;background:#ffe3ec;color:#c4567c}
.cgv .pko em{font-style:normal;font-size:.72rem;color:var(--mute);font-family:var(--story)}
.cgv .pko.fit{border-color:#f0b6c8;background:#fff8fb}
.cgv .pko:last-child:nth-child(odd){grid-column:1/-1}
.end .erows{display:grid;gap:6px;margin:8px 0 6px}
.end .erow{display:flex;align-items:center;justify-content:center;gap:10px}
.end .erow small{margin:0;min-width:3em;padding:1px 8px;border-radius:99px;background:#e6f4ec;color:var(--mint);font-size:.72rem}
.end .erow b{font-family:var(--story);font-weight:400;font-size:.95rem}
.albgrid button.alb{font:inherit;cursor:pointer}
.albgrid button.alb[disabled]{cursor:default}
/* ===== 對齊修正 v2 ===== */
/* 面板頂端的標題牌（本月排程、下旬、外出、物品…）：字放在牌子正中間（牌子中心在素材 96/143 高、寬的 9.6%） */
.modal.sheet .box h3,.outp .outhead h3{left:-4px;right:-4px;top:-34px;height:0;padding:9.6% 0 0;line-height:0;display:block;text-align:center}
/* 分頁：選中那張下面有小尾巴，字要在膠囊的正中間 */
.outhead .tabs button{padding:2px 0 0}
.outhead .tabs button.on{padding:0}
/* 活動卡：左邊的框已經從素材拿掉，圖示直接放 */
.actc .asq{background-color:transparent;border:0;box-shadow:none}
.actc .asq .ico{width:70%}
/* ===== 全螢幕地圖 ===== */
.modal.mapv{padding:0;display:block;background:#dfeee3;backdrop-filter:none}
.mapv .mstage{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;overflow:hidden;container-type:size}
.mapv .mapcv{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;border:0;border-radius:0;
  width:max(100cqw,calc(100cqh * 720 / 1279));height:auto;aspect-ratio:720/1279;flex:none;max-width:none}
.mapv .mapcv.art{background-size:100% 100%}
.mapv .pvtop{position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;z-index:3;justify-content:center}
.mapv .pvback{position:absolute;left:14px;top:max(14px,env(safe-area-inset-top))}
.mapv .mtabs{display:flex;gap:6px;margin:0;padding:0}
.mapv .mtabs button{position:relative;width:104px;min-height:0;height:auto;padding:2px 0 0;border:0;border-image:none;border-radius:0;box-shadow:none;background:url(../assets/ui/ui_tab_off.png) center/100% 100% no-repeat;aspect-ratio:1000/260;font-size:.82rem;font-weight:700;color:var(--navy);display:flex;align-items:center;justify-content:center}
.mapv .mtabs button.on{background-image:url(../assets/ui/ui_tab_on.png);aspect-ratio:1000/301;padding:0;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.mapv .mtabs .dot{position:absolute;right:-4px;top:-6px;font-style:normal;font-size:.62rem;width:18px;height:18px;border-radius:50%;background:#f3b13d;color:#fff;display:flex;align-items:center;justify-content:center}
.mapv .pvsta{position:absolute;top:calc(max(14px,env(safe-area-inset-top)) + 42px);left:50%;transform:translateX(-50%);margin:0;z-index:3;width:calc(min(100%,480px) - 28px)}
.mapv .mapnote{position:absolute;left:50%;bottom:max(12px,env(safe-area-inset-bottom));transform:translateX(-50%);width:calc(min(100%,480px) - 40px);margin:0;padding:6px 14px;border-radius:14px;background:rgba(255,253,246,.92);box-shadow:0 3px 10px rgba(45,58,102,.18);z-index:3;pointer-events:none;transition:opacity .8s}
.mapv .mapnote.fade{opacity:0}
/* 卡片：只留標題＋數值；數值用粉圓 */
.actc em,.slotc em{font-family:var(--story);font-weight:400;font-size:.72rem;letter-spacing:.02em}
.actc b{font-size:.95rem}
/* 排程：出發置中 */
.schgo{display:flex;justify-content:center;margin-top:12px}
.schgo #fin{min-width:150px}
/* 存檔面板 */
.savep .srow{display:flex;align-items:center;gap:12px;margin:8px 2px;padding:10px 12px;border-radius:18px;background:#fffdf6;border:2px solid #cfe6d6}
.savep .srow.auto{border-color:#f0d9a8;background:#fffaf0}
.savep .srow.empty{opacity:.75}
.savep .sav{flex:none;width:54px;height:54px;border-radius:50%;overflow:hidden;background:#e6f4ec;border:2px solid #cfe6d6;display:flex;align-items:flex-start;justify-content:center}
.savep .sav img{width:150%;max-width:none;margin-top:-6%}
.savep .sin{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.savep .sin b{font-size:.95rem;color:var(--navy)}
.savep .sin em,.savep .sin small{font-style:normal;font-family:var(--story);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.savep .sin em{font-size:.78rem;color:var(--navy2)}
.savep .sin small{font-size:.66rem;color:var(--mute)}
.savep .sbtn{flex:none;display:flex;flex-direction:column;gap:6px}
.savep .sbtn button{min-height:0;min-width:84px;padding:5px 10px;font-size:.78rem}
.savep .sbtn button.ask{background:#ffe3ec;color:#c4567c}
.savep .outhead p{font-family:var(--story);font-weight:400}
/* 開場鋪陳：字直接疊在 CG 上，下方大片陰影 */
.cgv.intro .cgimg.in{animation:cgin .8s ease both}
.cgv.intro.nocg .cgimg{filter:saturate(.9) brightness(.9) blur(1.5px);transform:scale(1.04)}
.cgv.intro .ishade{position:absolute;left:0;right:0;bottom:0;height:62%;pointer-events:none;
  background:linear-gradient(180deg,rgba(18,22,40,0) 0%,rgba(18,22,40,.45) 30%,rgba(18,22,40,.78) 62%,rgba(18,22,40,.9) 100%)}
.cgv.intro .itx{position:absolute;left:28px;right:28px;bottom:15%;margin:0;color:#fffaf0;text-align:center;font-family:var(--story);font-weight:400;font-size:1.3rem;line-height:1.9;letter-spacing:.06em;text-shadow:0 2px 10px rgba(0,0,0,.65),0 0 2px rgba(0,0,0,.5)}
.cgv.intro .itx.in{animation:cgin .7s ease both}
.cgv.intro .cgnext{right:24px;bottom:7%;font-size:.8rem;color:#fffaf0;opacity:.85}
.cgv.intro .iskip{position:absolute;top:max(16px,env(safe-area-inset-top));right:16px;min-height:0;padding:5px 14px;font-size:.78rem;border-radius:99px;background:rgba(255,253,246,.85);border:0;border-image:none;color:var(--navy2);box-shadow:0 2px 8px rgba(0,0,0,.2)}
/* 通知：顯示在澄澄頭上一點，不會漏看 */
.toast{top:25%;bottom:auto}
/* 存檔面板：只有四格，高度跟著內容 */
.savep .box{height:auto;max-height:calc(100% - 84px)}
.savep .outlist{flex:none}
/* ===== NPC 立繪（指定場景才出現）：澄澄在左、NPC 在右 ===== */
.stage .npcs{position:absolute;inset:0;pointer-events:none;z-index:0}
.stage #ch{z-index:1;transition:left .35s ease}
.stage .npcs .npcart{animation:cgin .35s ease both;transition:left .35s ease;transform:translateX(-50%) scale(1.14);transform-origin:50% 100%}
.stage.duo.npc1 #ch{left:27%}
.stage.duo.npc1 .npcart{left:72%}
.stage.duo.npc2 .npcart:nth-child(1){left:20%}
.stage.duo.npc2 .npcart:nth-child(2){left:80%}
.stage.choff.npc2 .npcart:nth-child(1){left:30%}
.stage.choff.npc2 .npcart:nth-child(2){left:70%}
/* 跟大人同框時澄澄往下放（不縮小），依年紀放低，腳會被對話框擋住 */
.stage.duo #ch{transform:translateX(-50%) translateY(10%);clip-path:inset(0 0 10% 0)}
.stage.duo.st-toddler #ch{transform:translateX(-50%) translateY(30%);clip-path:inset(0 0 30% 0)}
.stage.duo.st-primary #ch{transform:translateX(-50%) translateY(20%);clip-path:inset(0 0 20% 0)}
/* 四個人同框（澄澄＋三位大人）：大家一起縮小 */
.stage.npc3 .npcart{transform:translateX(-50%) scale(.92)}
.stage.npc3 .npcart:nth-child(1){left:17%}
.stage.npc3 .npcart:nth-child(2){left:50%}
.stage.npc3 .npcart:nth-child(3){left:83%}
.stage.duo.npc3 #ch{left:34%;transform:translateX(-50%) translateY(14%) scale(.82);transform-origin:50% 100%;clip-path:none}
.stage.duo.npc3.st-toddler #ch{transform:translateX(-50%) translateY(30%) scale(.8);clip-path:inset(0 0 30% 0)}
.stage.duo.npc3.st-primary #ch{transform:translateX(-50%) translateY(22%) scale(.82);clip-path:inset(0 0 22% 0)}
.stage.choff.npc3 .npcart{transform:translateX(-50%) scale(.95)}
/* 情緒特效（用獨立的 translate/rotate，不會跟站位的 transform 打架） */
.stage .fx-hop{animation:fxHop .55s ease-out}
.stage .fx-jump{animation:fxJump .4s ease-out}
.stage .fx-shake{animation:fxShake .5s ease-in-out}
.stage .fx-shiver{animation:fxShiver .9s linear}
.stage .fx-droop{animation:fxDroop 1.1s ease-in-out}
.stage .fx-tilt{animation:fxTilt .9s ease-in-out}
.stage .fx-nod{animation:fxNod .6s ease-in-out}
@keyframes fxHop{0%,100%{translate:0 0}25%{translate:0 -6%}50%{translate:0 0}70%{translate:0 -3%}}
@keyframes fxJump{0%,100%{translate:0 0}35%{translate:0 -9%}}
@keyframes fxShake{0%,100%{translate:0 0}15%,55%{translate:-4% 0}35%,75%{translate:4% 0}}
@keyframes fxShiver{0%,100%{translate:0 0}10%,30%,50%,70%,90%{translate:-1% 0}20%,40%,60%,80%{translate:1% 0}}
@keyframes fxDroop{0%,100%{translate:0 0}40%,70%{translate:0 4%}}
@keyframes fxTilt{0%,100%{rotate:0deg}35%,70%{rotate:-4deg}}
@keyframes fxNod{0%,100%{translate:0 0}30%{translate:0 2%}60%{translate:0 0}80%{translate:0 1%}}
.stage .fxmark{position:absolute;z-index:3;transform:translate(-50%,-50%);pointer-events:none;font-weight:900;font-size:2rem;line-height:1;color:#fff;
  -webkit-text-stroke:2px var(--navy);paint-order:stroke fill;text-shadow:0 2px 6px rgba(45,58,102,.35);animation:fxMark 1.3s ease-out both;font-size:2.6rem}
.stage .fxm-hop{color:#ffd56b}
.stage .fxm-shake{color:#ff8a8a;font-size:3rem}
.stage .fxm-shiver{color:#9fd3ff}
.stage .fxm-tilt{color:#b8a6ff}
.stage .fxm-jump{color:#ffb46b;font-size:3rem}
.stage .fxm-droop{color:#c9cfe3}
@keyframes fxMark{0%{opacity:0;scale:.4}20%{opacity:1;scale:1.15}35%{scale:1}80%{opacity:1;translate:0 -10px}100%{opacity:0;translate:0 -16px}}
/* 跟霽冉同框時，爺爺奶奶小一點（霽冉比較高大） */
.stage.withj .npcart[data-id="gpa"],.stage.withj .npcart[data-id="gma"]{transform:translateX(-50%) scale(1.03)}
.stage.withj.npc3 .npcart[data-id="gpa"],.stage.withj.npc3 .npcart[data-id="gma"]{transform:translateX(-50%) scale(.83)}
.stage .fxmark img{display:block;width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(45,58,102,.3))}
/* ===== 家人介紹 ===== */
.title .famb{min-width:0;margin-top:12px;padding:6px 20px;font-size:.85rem;background:#fffdf4;border:2px solid #cfe6d6;border-image:none;border-radius:99px;color:var(--navy2);box-shadow:none}
.modal.famp{padding:14px}
.famp .fbox{position:relative;width:100%;max-width:452px;height:min(92vh,800px);display:flex;flex-direction:column;border-radius:24px;overflow:hidden;background:#fffdf6;border:3px solid #cfe6d6;box-shadow:0 12px 34px rgba(29,34,56,.3)}
.famp .ftabs{display:flex;justify-content:center;gap:6px;padding:12px 10px 8px;background:#eef7f1;flex:none}
.famp .ftabs button{min-width:0;min-height:0;margin:0;padding:6px 14px;border-radius:99px;font-size:.85rem;background:#fff;border:2px solid #cfe6d6;border-image:none;color:var(--navy2);box-shadow:none}
.famp .ftabs button.on{background:var(--mint);border-color:var(--mint);color:#fff}
.famp .fbody{flex:1;overflow:auto}
.famp .fpic{position:relative;height:330px;background:radial-gradient(ellipse at 50% 70%,#fff6e3,#e6f2ea 70%);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.famp .fpic img{height:100%;width:auto;object-fit:contain;object-position:bottom}
.famp .fquote{position:absolute;left:14px;right:14px;bottom:12px;margin:0;padding:8px 14px;border-radius:14px;background:rgba(255,253,246,.92);font-family:var(--story);font-size:.9rem;color:var(--navy);text-align:center;box-shadow:0 2px 8px rgba(45,58,102,.15)}
.famp .finfo{padding:14px 20px 18px;text-align:center}
.famp .finfo h3{margin:0;font-size:1.3rem;color:var(--navy);letter-spacing:.1em}
.famp .finfo small{display:block;margin:2px 0 12px;color:var(--mint);font-size:.8rem}
.famp dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 12px;text-align:left}
.famp dt{font-size:.75rem;color:#fff;background:#a8cdb7;border-radius:99px;padding:2px 10px;height:fit-content;text-align:center;white-space:nowrap}
.famp dd{margin:0;font-family:var(--story);font-size:.88rem;line-height:1.6;color:var(--navy)}
.famp .ffoot{flex:none;display:flex;justify-content:center;padding:10px 0 12px;background:#eef7f1;border-top:2px solid #e2efe6}
.famp .fclose{margin:0}
/* 標題頁：次要按鈕一排；有封面 CG 時鋪滿背景 */
.title .tsub{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:240px;margin-top:12px}
.title .tsub{width:270px;gap:6px 8px}
.title .tsub button{min-width:0;margin:0;padding:9px 6px 10px;font-size:.88rem;display:flex;align-items:center;justify-content:center;gap:5px}
.title .tsub button .ico{flex:none;filter:drop-shadow(0 1px 0 rgba(255,255,255,.6))}
.title .trec{font-size:.78rem;opacity:.75;margin-top:8px}
.title.hascg{background:center/cover no-repeat}
.title.hascg .polaroid-t{visibility:hidden}
.title.hascg .trec,.title.hascg label.pbm{background:rgba(255,253,244,.85);padding:2px 12px;border-radius:99px}
/* 零用錢（小學起顯示在頂端） */
/* ===== 傳承加點（精簡卡片） ===== */
.modal.legp{padding:14px}
.legp .lbox{width:100%;max-width:440px;max-height:calc(100vh - 28px);display:flex;flex-direction:column;border-radius:24px;overflow:hidden;background:#fffdf6;border:3px solid #cfe6d6;box-shadow:0 12px 34px rgba(29,34,56,.3)}
.legp .lhead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px 10px;background:linear-gradient(180deg,#eef7f1,#fffdf6)}
.legp .lhead h3{margin:0;font-size:1.15rem;color:var(--navy);letter-spacing:.08em}
.legp .lleft{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--navy2)}
.legp .lleft b{min-width:44px;padding:3px 12px;border-radius:99px;background:#ffd56b;color:#5b3a10;font-size:1.05rem;text-align:center;box-shadow:inset 0 -2px 0 rgba(0,0,0,.08)}
.legp #lr{overflow:auto;padding:0 14px 6px}
.legp h4.lg{margin:10px 2px 6px;font-size:.78rem;color:var(--mint);letter-spacing:.1em}
.legp .lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:8px}
.legp .lcell{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 6px 7px;border-radius:16px;background:#fff;border:2px solid #e2efe6;text-align:center}
.legp .lcell.on{border-color:#f0d08a;background:#fffaf0}
.legp .lname{display:flex;align-items:center;gap:4px}
.legp .lname b{font-size:.88rem;color:var(--navy)}
.legp .lcell small{font-family:var(--story);font-size:.68rem;color:var(--mute);min-height:1.1em}
.legp .lcell.on small{color:#c0841a;font-weight:700}
.legp .lstep{display:flex;align-items:center;gap:6px;margin-top:2px}
.legp .lstep button{min-width:0;min-height:0;width:28px;height:28px;padding:0;border-radius:50%;border:2px solid #cfe6d6;border-image:none;background:#f4faf6;font-size:.9rem;line-height:1;box-shadow:none;color:var(--navy)}
.legp .lstep button:disabled{opacity:.35}
.legp .lstep i{font-style:normal;min-width:40px;font-weight:700;color:var(--navy)}
.legp .lstep i em{font-style:normal;font-size:.62rem;color:var(--mute);font-weight:400}
.legp .lfoot{display:flex;justify-content:center;gap:10px;padding:10px 0 14px;border-top:2px solid #eef4ef}
.legp .lfoot button{min-width:110px;margin:0}
/* 頂端數值：拿掉白色圓框，只留圖示＋數字 */
.tb2 .rs{gap:10px}
.tb2 .rs div{background:none;box-shadow:none;padding:0;gap:3px}
.tb2 .rs div b{font-size:.86rem;text-shadow:0 1px 0 #fff}
.tb2 .rs .ico{width:20px;height:20px}
/* 還沒畫的新圖示：先把愛心染色區分（家庭＝暖橘、戀愛＝粉紅） */
.ico.fb-family{filter:hue-rotate(28deg) saturate(1.5) brightness(1.03)}
.ico.fb-wallet{filter:hue-rotate(300deg) saturate(1.3)}
/* 小豬撲滿：零用錢（小學起，頂端下方右側） */
.piggy{position:absolute;right:12px;top:96px;z-index:5;display:flex;align-items:center;justify-content:center;width:96px;height:66px;pointer-events:none}
.piggy .pgart{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 5px rgba(45,58,102,.2))}
.piggy .ico{display:none}
.piggy b{position:relative;margin-top:10px;font-size:.9rem;color:#8a3a5c;text-shadow:0 1px 0 rgba(255,255,255,.8)}
.piggy.noart{width:auto;height:auto;gap:4px;padding:3px 10px 3px 6px;border-radius:99px;background:#ffe3ec;border:1.5px solid #f3b6c9;box-shadow:0 2px 5px rgba(45,58,102,.12)}
.piggy.noart .ico{display:block}
.piggy.noart b{margin:0}

/* 傳承加點：純文字＋點數，窄版清單 */
.legp .lbox{max-width:330px}
.legp .lgrid{grid-template-columns:1fr;gap:0}
.legp .lcell{flex-direction:row;justify-content:space-between;align-items:center;gap:8px;padding:6px 4px;border:0;border-bottom:1.5px dashed #e2efe6;border-radius:0;background:none;text-align:left}
.legp .lcell.on{background:none}
.legp .lname{flex-direction:column;align-items:flex-start;gap:0}
.legp .lcell small{min-height:0}
.legp .lstep{margin:0}
.legp .lstep i{min-width:26px;text-align:center}
/* 頂端：數字用粉圓；存款和零用錢上下並排；年齡只寫幾歲 */
.tb2 .rs div b,.tb2 .age2 b{font-family:var(--story);font-weight:400}
.tb2 .age2 b{font-size:1.15rem}
.tb2 .rs .mny.two{flex-direction:column;align-items:flex-start;gap:0;line-height:1.05}
.tb2 .rs .mny span{display:flex;align-items:center;gap:3px}
.tb2 .rs .mny.two span:last-child b{font-size:.74rem;color:#b8577e}
.tb2 .rs .mny.two span:last-child .ico{width:16px;height:16px}
/* 下方按鈕列：有寵物時變五格，圖示在上、字在下 */
.hm2 .dock.d5{grid-template-columns:repeat(4,1fr) 1.25fr;gap:5px}
.hm2 .dock.d5 button:not(.primary){flex-direction:column;padding:7px 2px 8px;gap:1px}
.hm2 .dock.d5 button:not(.primary) span,.hm2 .dock.d5 #schb{font-size:.74rem}
.hm2 .dock.d5 #schb i{display:none}
/* ===== 寵物畫面 ===== */
.modal.petv{display:block;padding:0;background:#dfeee3}
.petv .ptstage{position:absolute;left:50%;transform:translateX(-50%);top:0;bottom:0;width:100%;max-width:480px;overflow:hidden;cursor:pointer}
.petv .ptbg{position:absolute;inset:0;background:center/cover no-repeat}
.petv.nocg .ptbg{filter:blur(2px) brightness(1.02) saturate(.9);transform:scale(1.04)}
.petv .ptpet{position:absolute;left:50%;bottom:36%;transform:translateX(-50%);width:70%;max-width:330px;filter:drop-shadow(0 8px 12px rgba(45,58,102,.25))}
.petv .ptstage.wig .ptpet{animation:petWig .5s ease}
.petv .ptstage.wig .ptbg{animation:petWig2 .5s ease}
@keyframes petWig{0%,100%{rotate:0deg;scale:1}25%{rotate:-4deg;scale:1.04 .96}55%{rotate:3deg;scale:.97 1.03}80%{rotate:-1deg}}
@keyframes petWig2{0%,100%{translate:0 0}30%{translate:0 -4px}}
.petv .pheart{position:absolute;z-index:3;transform:translate(-50%,-50%);color:#ff8fb1;-webkit-text-stroke:1.5px #fff;paint-order:stroke fill;text-shadow:0 2px 6px rgba(200,80,120,.35);pointer-events:none;animation:pheart 1.3s ease-out both}
@keyframes pheart{0%{opacity:0;scale:.3}20%{opacity:1;scale:1.2}100%{opacity:0;translate:0 -90px;scale:.9}}
.petv .ptsay{position:absolute;left:50%;top:calc(max(14px,env(safe-area-inset-top)) + 56px);transform:translateX(-50%);width:calc(100% - 48px);max-width:400px;margin:0;padding:10px 16px;border-radius:18px;background:rgba(255,253,246,.94);box-shadow:0 4px 12px rgba(45,58,102,.18);font-family:var(--story);font-size:.92rem;line-height:1.6;color:var(--navy);text-align:center;opacity:0;transition:opacity .4s}
.petv .ptsay.in{opacity:1}
.petv .pvtop{position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;z-index:4}
.petv .ptpanel{position:absolute;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);width:calc(100% - 28px);max-width:440px;z-index:4;padding:12px 12px 10px;border-radius:22px;background:rgba(255,253,246,.94);border:2px solid #cfe6d6;box-shadow:0 8px 22px rgba(29,34,56,.22);text-align:center}
.petv .ptpanel h4{margin:0 0 8px;font-size:.88rem;color:var(--navy)}
.petv .ptopts{display:flex;flex-direction:column;gap:7px}
.petv .ptopts button{margin:0;min-height:0;padding:9px 10px 10px;font-size:.88rem}
.petv .ptdone{margin:4px 0 6px;font-family:var(--story);font-size:.85rem;line-height:1.7;color:var(--navy2)}
/* 幫寵物取名字 */
.modal.petname{padding:20px}
.petname .pnbox{width:100%;max-width:320px;padding:18px 20px 20px;border-radius:24px;background:#fffdf6;border:3px solid #cfe6d6;box-shadow:0 12px 30px rgba(29,34,56,.3);text-align:center}
.petname img{width:120px;height:120px;object-fit:contain;margin:-4px auto 4px;display:block}
.petname h3{margin:4px 0 12px;color:var(--navy);font-size:1.05rem}
.petname input{width:200px;height:44px;border-radius:999px;border:2px solid var(--mint);background:#fff;font-family:var(--story);font-size:1.1rem;color:var(--navy);text-align:center}
.petname p{margin:6px 0 12px;font-size:.72rem;color:var(--mute)}
.petname button{min-width:180px;margin:0}
/* 劇情插圖（便當等） */
.stage .spic{position:absolute;left:50%;top:22%;transform:translateX(-50%);z-index:4;width:min(78%,340px);padding:8px;border-radius:18px;background:#fffdf6;box-shadow:0 10px 26px rgba(29,34,56,.28);animation:cgin .5s ease both;rotate:-2deg}
.stage .spic img{display:block;width:100%;border-radius:12px}
/* 素質展開按鈕：小小的標籤，不用箭頭 */
.tb2 .tog{height:auto;min-height:0;padding:2px 12px 3px;border:1.5px solid #b8dcc6;border-image:none;border-radius:0 0 12px 12px;background:#fffdf4;font-family:var(--story);font-weight:400;font-size:.66rem;line-height:1.3;color:var(--navy2);bottom:-17px;box-shadow:0 2px 4px rgba(45,58,102,.12)}
/* 輸入名字 */
.modal.namep{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(rgba(29,34,56,.55),rgba(29,34,56,.75)),url(../assets/cg/intro_4.jpg) center/cover no-repeat,#1d2238}
.namep .nmbox{width:100%;max-width:330px;padding:24px 22px 22px;border-radius:24px;background:#fffdf6;border:3px solid #cfe6d6;text-align:center;box-shadow:0 12px 34px rgba(0,0,0,.35);animation:cgin .6s ease both}
.namep h3{margin:0 0 14px;color:var(--navy);font-size:1.1rem}
.namep input{width:220px;height:46px;border-radius:999px;border:2px solid var(--mint);background:#fff;font-family:var(--story);font-size:1.05rem;color:var(--navy);text-align:center}
.namep label.pbm{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px 0 4px;font-size:.85rem;color:var(--navy2)}
.namep select{font-family:var(--story);font-size:.95rem;color:var(--navy);border:2px solid var(--mint);border-radius:999px;background:#fff;padding:4px 12px}
.namep p{margin:4px 0 14px;font-family:var(--story);font-size:.72rem;color:var(--mute)}
.namep button{min-width:180px;margin:0}
/* ===== 標題 logo（assets/ui/logo.png；沒有圖時用文字） ===== */
.title .tlogo{display:block;width:86%;max-width:360px;margin:0 auto;filter:drop-shadow(0 4px 10px rgba(45,58,102,.25))}
/* ===== 填名字：只有兩個欄位 ===== */
.namep .nmbox{max-width:320px;padding:22px 22px 20px;display:flex;flex-direction:column;align-items:center;gap:8px;border-radius:26px;background:rgba(255,253,246,.96)}
.namep .nml{align-self:flex-start;margin:4px 0 0 4px;font-size:.82rem;font-weight:700;color:var(--mint);letter-spacing:.1em}
.namep input{width:100%;height:48px;border:2px solid #cfe6d6;border-radius:16px;background:#fff;font-size:1.1rem}
.namep input:focus{outline:none;border-color:var(--mint)}
.namep .mgrid{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.namep .mgrid button{min-width:0;min-height:0;margin:0;padding:8px 0;border:2px solid #e2efe6;border-image:none;border-radius:12px;background:#fff;box-shadow:none;font-family:var(--story);font-weight:400;font-size:.88rem;color:var(--navy2)}
.namep .mgrid button.on{background:var(--mint);border-color:var(--mint);color:#fff}
.namep #ok{margin-top:10px;min-width:160px}
/* ===== 下方行動按鈕：拿掉上面的標題牌，按鈕不擠 ===== */
.hm2 .dock.dk2{padding:14px 14px 18px;border-top:0;border-radius:26px 26px 0 0}
.hm2 .dock.dk2::before{display:none}
.hm2 .dock.dk2{grid-template-columns:repeat(3,1fr) 1.35fr;gap:8px}
.hm2 .dock.dk2.d5{grid-template-columns:repeat(4,1fr) 1.35fr;gap:6px}
.hm2 .dock.dk2 button:not(.primary){flex-direction:column;justify-content:center;gap:3px;min-height:64px;padding:8px 2px 7px;border:2px solid #dcefe3;border-image:none;border-radius:18px;background:#fbfdf8;box-shadow:0 2px 0 #dcefe3}
.hm2 .dock.dk2 button:not(.primary) .ico{width:30px;height:30px}
.hm2 .dock.dk2 button:not(.primary) span,.hm2 .dock.dk2 #schb{font-size:.78rem;font-weight:700;color:var(--navy)}
.hm2 .dock.dk2 #schb i{display:none}
.hm2 .dock.dk2 .primary{min-height:64px;font-size:1.05rem;letter-spacing:.15em}
.hm2 .dock.dk2 .dot{right:2px;top:-6px}
.hm2 .portrait .petimg{left:auto;right:22px;bottom:138px;width:118px;max-width:none;transform:none;z-index:2}
/* 劇情 CG：整個畫面換成 CG，立繪先藏起來 */
.stage .evcg{position:absolute;inset:0;z-index:3;background:center/cover no-repeat;animation:cgin .6s ease both}
.stage.incg #ch,.stage.incg .npcs,.stage.incg .fxmark{visibility:hidden}
/* ===== v15 手機主畫面改版（麻麻的手機／澄澄的手機、小工具、底部常用 APP）===== */
.phbtn{position:absolute;right:10px;top:92px;width:46px;height:46px;min-height:0;padding:0;border:2px solid #b8dcc6;border-image:none;border-radius:50%;background:rgba(255,253,244,.92);box-shadow:0 3px 8px rgba(45,58,102,.15);display:flex;align-items:center;justify-content:center;z-index:2}
.phbtn .phi{position:relative;width:30px;height:30px;display:block}
.phbtn .phi img,.phbtn .phi svg{position:absolute;inset:0;width:100%;height:100%}
.phbtn .phi img+svg{display:none}
.phbtn .dot{position:absolute;right:-4px;top:-4px;font-style:normal;min-width:18px;height:18px;padding:0 4px;border-radius:99px;background:#f08a7e;color:#fff;font-size:.62rem;font-family:var(--ui);display:flex;align-items:center;justify-content:center}
.phone .scr{background-size:cover;background-position:center}
.phone .scr.petwall{background-size:cover,62% auto,cover;background-position:center,center 78%,center;background-repeat:no-repeat}
.phone .scr.onhome .ahead{background:transparent;border-bottom:0}
.phone .scr.onhome .ahead b{text-shadow:0 1px 3px rgba(255,255,255,.9)}
.phone .scr.onhome .plist{background:transparent}
.phone .pseg{display:flex;gap:4px;margin:0 auto 10px;width:max-content;padding:3px;border-radius:99px;background:rgba(255,255,255,.75);box-shadow:0 2px 6px rgba(45,58,102,.12)}
.phone .pseg button{position:relative;min-height:0;padding:4px 16px;border:0;border-image:none;border-radius:99px;background:none;box-shadow:none;font-size:.74rem;color:var(--mute)}
.phone .pseg button.on{background:#fff;color:var(--navy);box-shadow:0 1px 4px rgba(45,58,102,.18)}
.phone .pseg .unr{position:absolute;right:-2px;top:-6px;font-style:normal;min-width:16px;height:16px;padding:0 4px;border-radius:99px;background:#f08a7e;color:#fff;font-size:.56rem;display:flex;align-items:center;justify-content:center}
.phone .wclock{margin:0 2px 10px;padding:10px 14px;border-radius:20px;background:rgba(255,255,255,.72);backdrop-filter:blur(6px);box-shadow:0 3px 10px rgba(45,58,102,.12);text-align:center}
.phone .wclock div{display:flex;align-items:baseline;justify-content:center;gap:8px}
.phone .wclock b{font-family:var(--ui);font-size:2.2rem;line-height:1.05;color:var(--navy)}
.phone .wclock b small{font-size:.9rem;margin-left:2px}
.phone .wclock span{font-family:var(--ui);font-size:.8rem;color:var(--mute)}
.phone .wclock p{margin:2px 0 0;font-family:var(--ui);font-size:.82rem;color:var(--navy2)}
.phone .wclock em{display:block;margin-top:4px;font-style:normal;font-family:var(--ui);font-size:.72rem;color:#3f7d5e}
.phone .wphoto{display:block;width:100%;min-height:0;margin:0 0 10px;padding:6px;border:0;border-image:none;border-radius:20px;background:rgba(255,255,255,.78);box-shadow:0 3px 10px rgba(45,58,102,.12)}
.phone .wphoto span{display:block;width:100%;aspect-ratio:16/10;border-radius:15px;background:#e9f0ee center 30%/cover no-repeat}
.phone .wphoto small{display:block;padding:5px 0 1px;font-family:var(--ui);font-size:.7rem;color:var(--navy2);text-align:center}
.phone .scr.onhome .appgrid{padding:4px 4px 8px}
.phone .scr.onhome .appi b{text-shadow:0 1px 3px #fff,0 0 6px #fff}
.phone .aico img.fb{inset:13px;width:calc(100% - 26px);height:calc(100% - 26px)}
.phone .pdock{display:flex;justify-content:space-around;gap:4px;margin:0 8px 2px;padding:0;border-radius:22px}
.phone .pdock:not(:empty){padding:8px 4px 6px;background:rgba(255,255,255,.6);backdrop-filter:blur(8px);box-shadow:0 2px 8px rgba(45,58,102,.1)}
.phone .pdock .appi .aico{width:50px;height:50px;border-radius:14px}
.phone .pdock .appi b{font-size:.62rem}
.phone .pdock .aico img.fb{inset:11px;width:calc(100% - 22px);height:calc(100% - 22px)}
.phone .pnote{text-align:center;font-family:var(--ui);font-size:.74rem;color:var(--mute);margin:2px 0 6px}
.phone .phgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:8px}
.phone .pht{min-height:0;padding:0;border:0;border-image:none;background:none;box-shadow:none;display:flex;flex-direction:column;gap:2px}
.phone .pht span{display:block;width:100%;aspect-ratio:3/4;border-radius:10px;background:#e3e8ef center 25%/cover no-repeat}
.phone .pht.lk span{background:repeating-linear-gradient(45deg,#eef1f5 0 6px,#e5e9ef 6px 12px)}
.phone .pht small{font-family:var(--ui);font-size:.58rem;line-height:1.25;color:var(--navy2);text-align:center;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.phone .pht.lk small{color:var(--mute)}
.phone .pht:disabled{opacity:1}
.phone .pgoal{display:flex;align-items:center;gap:6px;margin:2px 0 6px;padding:8px 10px;border-radius:14px;background:#f2f8f4;border:1.5px solid #cfe3d6;font-family:var(--ui);font-size:.74rem}
.phone .pgoal span{flex:1}
.phone .pgoal b{color:var(--navy2)}
.phone .crow2{display:flex;gap:10px;align-items:flex-start;padding:8px 4px;border-bottom:1px solid #eef1f5;font-family:var(--ui)}
.phone .crow2>b{flex:none;width:38px;font-size:.8rem;color:var(--navy2)}
.phone .crow2 span{display:flex;flex-wrap:wrap;gap:4px}
.phone .crow2 i{font-style:normal;font-size:.68rem;padding:2px 8px;border-radius:99px;background:#eef6f1;color:#2f5d48}
.phone .crow2 em{font-style:normal;font-size:.7rem;color:#c3cad4}
.phone .crow2.cur{background:#fff8e6;border-radius:12px;border-bottom-color:transparent}
.phone .crow2.cur>b{color:#c0841a}
.phone .crow2.cur i{background:#ffe7b8;color:#8a5a0c}
.phone .crow2.past{opacity:.5}
.phone .pwrap .achgrid{grid-template-columns:1fr 1fr}
.phone .pwrap .albgrid{grid-template-columns:1fr 1fr}
.phone .pwrap .dline{display:flex;gap:8px;padding:7px 2px;border-bottom:1px dashed #cfe3d6;font-size:.78rem;line-height:1.6}
.phone .pwrap .dline b{flex:none;width:2.6em;color:var(--mint)}
.phone .pwrap .dline span{font-family:var(--story);font-weight:400}
.phone .papp.wide{width:100%;margin-bottom:8px;padding:12px}
.phone .papp.wide b{font-size:.86rem}
.phone .papp.wide{align-items:center;justify-content:center;text-align:center}
.phone .wphoto span{background-position:center 12%}
/* 行事曆：這個月＋一年 12 格 */
.phone .pcal-now{display:flex;gap:12px;align-items:center;margin:2px 0 8px;padding:10px 14px;border-radius:16px;background:#fff8e6;border:1.5px solid #f3dca6;font-family:var(--ui)}
.phone .pcal-now b{flex:none;font-size:1.3rem;color:#c0841a}
.phone .pcal-now span{font-size:.78rem;line-height:1.6;color:#6b4a0e}
.phone .pcal{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.phone .pcm{min-height:64px;padding:5px 4px 6px;border-radius:12px;background:#fff;border:1.5px solid #e3ebe6;display:flex;flex-direction:column;align-items:center;gap:2px;font-family:var(--ui)}
.phone .pcm>b{font-size:.95rem;color:var(--navy2);line-height:1.2}
.phone .pcm i{font-style:normal;font-size:.56rem;line-height:1.35;padding:1px 5px;border-radius:99px;background:#eef6f1;color:#2f5d48;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.phone .pcm.cur{background:#fff8e6;border-color:#f3c76b}
.phone .pcm.cur>b{color:#c0841a}
.phone .pcm.cur i{background:#ffe7b8;color:#8a5a0c}
.phone .pcm.past{opacity:.45}
.phone .pcm.out{opacity:.25}
/* 日記：年份切換＋每月小卡 */
.phone .pyear{display:flex;align-items:center;justify-content:center;gap:14px;margin:2px 0 8px;font-family:var(--ui)}
.phone .pyear b{font-size:1rem;color:var(--navy2)}
.phone .pyear button{width:30px;height:30px;min-height:0;padding:0;border:1.5px solid #dfe6ee;border-image:none;border-radius:50%;background:#fff;box-shadow:none;font-size:1rem;line-height:1;color:var(--navy)}
.phone .pyear button:disabled{opacity:.3}
.phone .pday{display:flex;gap:10px;margin-bottom:8px;padding:10px 12px;border-radius:16px;background:#fff;border:1.5px solid #e3ebe6}
.phone .pday>b{flex:none;width:34px;font-family:var(--ui);font-size:1.15rem;line-height:1.1;color:var(--mint);text-align:center}
.phone .pday>b small{display:block;font-size:.6rem}
.phone .pday>div{flex:1;min-width:0}
.phone .pday p{margin:0 0 4px;font-family:var(--story);font-weight:400;font-size:.76rem;line-height:1.55;color:var(--ink,#3b4566)}
.phone .pday p:last-child{margin-bottom:0}
.phone .ptags{display:flex;flex-wrap:wrap;gap:4px}
.phone .ptags i{font-style:normal;font-family:var(--ui);font-size:.62rem;padding:2px 8px;border-radius:99px;background:#f2f0fb;color:#5b4d8a}
/* 11/11 生日版標題 */
.title .bdfx{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.title .bdfx i{position:absolute;top:-8%;font-style:normal;font-size:1.1rem;color:#ffd36b;text-shadow:0 0 8px rgba(255,220,140,.9);animation:bdfall 7s linear infinite;opacity:0}
.title .bdfx i:nth-child(3n){color:#f6a6b8;text-shadow:0 0 8px rgba(246,166,184,.9)}
@keyframes bdfall{0%{transform:translateY(0) rotate(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(105vh) rotate(200deg);opacity:0}}
.title>*:not(.bdfx){position:relative;z-index:1}
.title .bdrib{min-width:0;margin:6px auto 2px;padding:6px 22px;border:0;border-image:none;border-radius:99px;background:linear-gradient(90deg,#f6c86b,#f3a7b8);color:#fff;font-size:.92rem;letter-spacing:.06em;box-shadow:0 3px 10px rgba(240,150,120,.35);text-shadow:0 1px 2px rgba(150,80,40,.35);animation:bdpulse 2.2s ease-in-out infinite}
@keyframes bdpulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
.story.nostat #sb{display:none}
.phone .appgrid.g4{grid-template-columns:repeat(4,1fr);gap:10px 2px}
.phone .appgrid.g4 .aico{width:50px;height:50px;border-radius:14px}
.phone .appgrid.g4 .aico img.fb{inset:11px;width:calc(100% - 22px);height:calc(100% - 22px)}
.phone .crow .av{position:relative;overflow:hidden}
.phone .crow .av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
.phone .crow .av i{font-style:normal}
.phone .wphoto span{aspect-ratio:2/1}
@media (max-height:780px){
  .phone .wclock{padding:6px 12px;margin-bottom:8px}
  .phone .wclock b{font-size:1.8rem}
  .phone .wphoto{padding:5px;margin-bottom:8px}
  .phone .wphoto span{aspect-ratio:5/2}
  .phone .pseg{margin-bottom:6px}
  .phone .appgrid.g4 .aico{width:44px;height:44px}
  .phone .pdock .appi .aico{width:44px;height:44px}
}
/* 考試小遊戲：限時消消樂 */
.exg{align-items:center;justify-content:center}
.exbox{position:relative;width:min(92vw,380px);padding:16px 14px 14px;background:var(--card);border:3px solid #b8dcc6;border-radius:22px;box-shadow:0 10px 30px rgba(45,58,102,.3);text-align:center}
.exbox h3{margin:0 0 8px;font-size:1.05rem;color:var(--navy)}
.exbar{height:10px;border-radius:99px;background:#e8eef0;overflow:hidden;margin:0 4px}
.exbar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#f6c86b,#f3a7b8);border-radius:99px;transition:width .1s linear}
.exinfo{display:flex;justify-content:space-between;margin:6px 6px 8px;font-family:var(--ui);font-size:.8rem;color:var(--navy2)}
.exinfo b{font-size:1rem;color:var(--navy)}
.exgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:6px;border-radius:16px;background:#f2f8f4}
.exgrid.shake{animation:exshake .25s}
@keyframes exshake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.ext{aspect-ratio:1;min-height:0;padding:0;border:0;border-image:none;border-radius:12px;background:#fff;box-shadow:0 1px 3px rgba(45,58,102,.12);display:flex;align-items:center;justify-content:center;transition:transform .12s}
.ext .ico{width:72%;height:72%}
.ext.sel{background:#fff3cf;box-shadow:0 0 0 3px #f3c76b;transform:scale(1.06)}
.ext.pop{animation:expop .22s forwards}
@keyframes expop{to{transform:scale(.2);opacity:0}}
.exstart{position:absolute;inset:0;border-radius:20px;background:rgba(255,253,244,.93);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px}
.exstart p{margin:0 0 6px;font-family:var(--ui);font-size:.9rem;line-height:1.7;color:var(--navy2)}
.exstart p b{font-size:1.2rem;color:var(--navy)}
.exstart button{min-width:180px}
/* 每月成績單 */
.rcm{align-items:center;justify-content:center}
.rcard{width:min(88vw,360px);padding:18px 18px 16px;background:#fffdf6;border:3px solid #b8dcc6;border-radius:22px;box-shadow:0 10px 30px rgba(45,58,102,.3);text-align:center;background-image:repeating-linear-gradient(#fffdf6 0 27px,#eef4f0 27px 28px)}
.rcard h3{margin:0;font-size:1.05rem;color:var(--navy)}
.rcsch{margin:2px 0 10px;font-family:var(--ui);font-size:.75rem;color:var(--mute)}
.rcgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin:0 4px 12px}
.rcrow{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;border-radius:12px;background:#fff;border:1.5px solid #e3ebe6;font-family:var(--ui);font-size:.86rem;color:var(--navy2)}
.rcrow b{font-size:1rem;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--story)}
.rcrow b.g4{background:#ffe1e6;color:#d0506a;border:2px solid #f3a7b8}
.rcrow b.g3{background:#fff3cf;color:#b07a10;border:2px solid #f3c76b}
.rcrow b.g2{background:#e6f3ec;color:#3f7d5e;border:2px solid #b8dcc6}
.rcrow b.g1{background:#eef1f5;color:#7a8499;border:2px solid #d5dbe5}
.rcnote,.rcgain{margin:0 4px 10px;padding:8px 12px;border-radius:14px;background:#fff;border:1.5px dashed #cfe3d6;text-align:left}
.rcnote small,.rcgain small{display:block;font-family:var(--ui);font-size:.66rem;color:var(--mint)}
.rcnote p{margin:2px 0 0;font-family:var(--story);font-size:.86rem;line-height:1.6;color:var(--navy)}
.rcgain p{margin:2px 0 0;font-family:var(--ui);font-size:.78rem}
.rcard #ok{min-width:160px;margin-top:4px}

/* 傳承加點：說明一行 */
.legp .lnote{margin:0;padding:2px 16px 8px;font-size:.8rem;color:var(--navy2);text-align:center;background:#fffdf6}
/* 霽冉生日：標題的緞帶跟按鈕一樣寬、字更清楚 */
.title .bdrib{box-sizing:border-box;width:270px;padding:8px 0;background:linear-gradient(90deg,#f0a43c,#e8738f);font-weight:700;font-size:1rem;text-shadow:0 1px 2px rgba(120,40,40,.45)}
.title #go{box-sizing:border-box;width:270px}
/* 劇情左上角的日期：加底色才看得清楚；沒有狀態列時貼齊上方 */
.stage .datetag{padding:3px 12px;border-radius:99px;background:rgba(45,58,102,.55);font-size:.85rem;letter-spacing:.06em;text-shadow:none}
.story.nostat .stage .datetag{top:14px!important}

/* 收藏：頁籤 */
.info .albtabs{display:flex;justify-content:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.info .albtabs button{min-width:0;min-height:0;margin:0;padding:5px 14px;border-radius:99px;font-size:.82rem;background:#fff;border:2px solid #cfe6d6;border-image:none;color:var(--navy2);box-shadow:none}
.info .albtabs button.on{background:var(--mint);border-color:var(--mint);color:#fff}
/* 收藏：職業、CG 用直式縮圖（9:16） */
.albgrid.vgrid{grid-template-columns:repeat(3,1fr);gap:8px}
.alb.vt{position:relative;aspect-ratio:9/16;padding:0;justify-content:flex-end;overflow:hidden;background:linear-gradient(180deg,#eef5f0,#dfece4) center/cover no-repeat;border-radius:12px}
.alb.vt[style]{background-size:cover;background-position:center}
.alb.vt b,.alb.vt small{position:relative;z-index:1;width:100%;text-align:center}
.alb.vt b{padding:18px 4px 0;font-size:.72rem;line-height:1.3}
.alb.vt small{padding:0 4px 6px}
.alb.vt[style]::after{content:'';position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(180deg,rgba(255,253,246,0),rgba(255,253,246,.95))}
.alb.vt.lk{justify-content:center}
.alb.vt.lk b{padding:0;font-size:.9rem;color:#b5bab5}
.phone .pwrap .albgrid.vgrid{grid-template-columns:1fr 1fr 1fr}
/* 家人介紹：不要捲動，立繪自動縮放 */
.famp .fbody{overflow:hidden;display:flex;flex-direction:column;min-height:0}
.famp .fpic{flex:1 1 auto;height:auto;min-height:120px}
.famp .finfo{flex:none;padding:10px 18px 12px}
.famp .finfo small{margin:0 0 8px}
.famp dl{gap:5px 10px}
.famp dd{font-size:.82rem;line-height:1.45}
.famp dt{font-size:.7rem;padding:1px 9px}

/* ===== 電腦版：遊戲畫面跟視窗一樣高、不捲動；左邊多一塊資訊欄 ===== */
#side{display:none}
@media(min-width:640px) and (min-height:560px){
  html,body{height:100%;overflow:hidden}
  #app{box-sizing:border-box;height:calc(100vh - 36px);min-height:0;overflow:hidden;width:min(480px,calc((100vh - 36px) * .56))}
  .title{min-height:0;height:100%;box-sizing:border-box}
  .story,.hm2{min-height:100%;height:100%}
}
@media(min-width:640px) and (min-height:560px){
  .title.hascg .polaroid-t{display:none}
  .title.hascg .logo{margin-bottom:auto}
  .title.hascg{padding-bottom:18px}
}
/* ===== 電腦版外觀：拿掉白框，背景用封面圖的柔焦版本 ===== */
@media(min-width:640px) and (min-height:560px){
  body::before{content:'';position:fixed;inset:-40px;z-index:-1;background:url(../assets/cg/title.jpg) center/cover no-repeat;filter:blur(28px) saturate(1.1) brightness(1.05);transform:scale(1.08)}
  body::after{content:'';position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 40%,rgba(255,250,240,.15),rgba(60,50,90,.28))}
  #app{border-radius:28px;box-shadow:0 24px 70px rgba(40,30,70,.38),0 2px 0 rgba(255,255,255,.35) inset}
}
@media(min-width:640px) and (min-height:560px){
  html{background:#d9cfe6}
  body{background:transparent}
  #app{padding:0}
}

/* ===== 電腦版兩側：麻麻的手帳 ===== */
.nb{display:none}
@media(min-width:1100px) and (min-height:560px){
  .nb{--paper:#fbf6ea;display:flex;flex-direction:column;gap:16px;position:fixed;top:30px;bottom:30px;width:236px;padding:26px 18px 20px;box-sizing:border-box;overflow:hidden;color:var(--navy);font-family:var(--hand);
    background:linear-gradient(rgba(255,255,255,0) 23px,rgba(150,180,165,.16) 24px) 0 0/100% 24px,var(--paper);border-radius:6px 18px 18px 6px;box-shadow:0 22px 60px rgba(40,30,70,.32),inset 6px 0 0 rgba(160,130,90,.12)}
  #sideL{right:calc(50% + min(240px,(100vh - 36px) * .28) + 30px);transform:rotate(-1.2deg);border-radius:18px 6px 6px 18px;box-shadow:0 22px 60px rgba(40,30,70,.32),inset -6px 0 0 rgba(160,130,90,.12)}
  #sideR{left:calc(50% + min(240px,(100vh - 36px) * .28) + 30px);transform:rotate(1.2deg)}
  .nb::before{content:'';position:absolute;top:-8px;left:50%;width:96px;height:24px;transform:translateX(-50%) rotate(-3deg);background:repeating-linear-gradient(45deg,rgba(168,214,190,.85) 0 8px,rgba(200,232,214,.85) 8px 16px);box-shadow:0 1px 2px rgba(0,0,0,.08)}
  #sideR::before{background:repeating-linear-gradient(45deg,rgba(246,184,198,.85) 0 8px,rgba(252,214,222,.85) 8px 16px);transform:translateX(-50%) rotate(4deg)}
  .nb .hd{display:block;border-radius:50%;background-size:280% auto;background-repeat:no-repeat;background-color:#fff;box-shadow:0 0 0 2px #fff,0 2px 5px rgba(45,58,102,.25)}
  .nbhead{display:flex;align-items:center;justify-content:center;gap:8px;flex:none}
  .nbhead b{font-size:1.05rem;letter-spacing:.12em}
  .bdst{padding:2px 10px;border-radius:4px;background:#f3a7b8;color:#fff;font-size:.72rem;transform:rotate(4deg);box-shadow:0 1px 3px rgba(0,0,0,.12)}
  /* 身高刻度 */
  .hgt{flex:1 1 auto;min-height:150px;display:flex;justify-content:center;padding:14px 0 8px}
  .hgt .frame{position:relative;width:46px;height:100%;border-radius:4px;background:linear-gradient(90deg,#d9b88f,#e8cfa9 40%,#d4b086);box-shadow:inset -3px 0 0 rgba(120,80,40,.15),2px 3px 8px rgba(80,50,20,.18)}
  .hgt .tape{position:absolute;left:-10px;width:8px;border-radius:2px;opacity:.85}
  .hgt .tape.tod{background:#ffd98a}.hgt .tape.pri{background:#a8d6be}.hgt .tape.jun{background:#b9b4ea}.hgt .tape.sen{background:#f3b6c4}
  .hgt .tk{position:absolute;left:0;width:14px;height:1.5px;background:rgba(110,80,50,.25);transform:translateY(50%)}
  .hgt .tk.on{width:30px;height:2px;background:#5b5e78}
  .hgt .tk em{position:absolute;left:36px;top:-8px;font-style:normal;font-size:.72rem;color:var(--navy2);white-space:nowrap}
  .hgt .tk.now em{font-size:.85rem;color:var(--navy);font-weight:700}
  .hgt .mark{position:absolute;right:-46px;transform:translateY(50%)}
  .hgt .mark .hd{width:38px;height:38px}
  /* 霽冉的訊息 */
  .msg{flex:none;display:flex;align-items:flex-start;gap:8px}
  .msg .hd{flex:none;width:34px;height:34px}
  .msg p{position:relative;margin:0;padding:8px 11px;border-radius:4px 14px 14px 14px;background:#fff;font-family:var(--story);font-weight:400;font-size:.8rem;line-height:1.5;box-shadow:0 2px 6px rgba(45,58,102,.12);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .msg p u{position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:#ec6b7e}
  /* 便利貼 */
  .note{flex:none;align-self:center;width:84%;padding:12px 12px 14px;background:#fff1a8;transform:rotate(-2.5deg);font-size:.85rem;line-height:1.5;text-align:center;box-shadow:0 6px 10px -4px rgba(120,100,20,.35)}
  /* 上一局 */
  .lastend{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
  .lastend .pic{width:62%;aspect-ratio:9/16;background:#efe7d6 center/cover no-repeat;border:7px solid #fff;border-bottom-width:7px;box-shadow:0 6px 14px rgba(45,58,102,.2);transform:rotate(2deg)}
  .lastend p{margin:0;text-align:center;font-size:.8rem;color:var(--navy2)}
  .lastend p b{font-size:1.05rem;color:var(--navy)}
  /* 拍立得 */
  .pola{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-self:center;width:78%;padding:8px 8px 0;background:#fff;transform:rotate(-2deg);box-shadow:0 8px 18px rgba(45,58,102,.22);cursor:pointer}
  .pola .pic{flex:1;min-height:0;background:#ece5d6 center/cover no-repeat}
  .pola p{margin:0;padding:8px 2px 10px;text-align:center;font-size:.85rem;min-height:1.2em}
  .pola.blank .pic{background:repeating-linear-gradient(135deg,#efe9dc 0 10px,#f6f1e6 10px 20px)}
  /* 收集貼紙 */
  .stk{flex:none;display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
  .sk{aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;color:#fff;box-shadow:0 0 0 2px #fff,0 2px 5px rgba(45,58,102,.2);opacity:var(--r)}
  .sk b{font-size:.82rem}.sk small{font-size:.5rem;opacity:.85}.sk span{font-size:.55rem;margin-top:2px}
  .sk.a{background:#e9a35a}.sk.b{background:#e98aa0}.sk.c{background:#79b99a}.sk.d{background:#8f8ad6}.sk.e{background:#5f9fcf}
  /* 家人 */
  .fam{flex:none}
  .fam .row{position:relative;display:flex;justify-content:center;gap:6px}
  .fam .row::before{content:'';position:absolute;left:10%;right:10%;top:50%;border-top:2px dashed rgba(143,184,160,.7)}
  .fam .hd{position:relative;width:36px;height:36px}
  .fam .hts{display:flex;justify-content:center;gap:3px;margin-top:6px}
  .fam .ht{font-style:normal;font-size:.8rem;color:#e3dccf}.fam .ht.on{color:#ec7f93}
  .leg{flex:none;display:flex;justify-content:space-around;font-size:.8rem;color:var(--navy2);padding-top:8px;border-top:2px dashed rgba(143,184,160,.5)}
  .leg b{color:var(--navy);font-size:.95rem}
}

@media(min-width:1100px) and (min-height:560px){
  .pola{flex:none;width:auto;padding:8px 8px 0}
  .pola .pic{flex:none;height:min(44vh,330px);aspect-ratio:9/16}
  .nb .pola+.stk{margin-top:auto}
  .sk{opacity:var(--r)}
  .sk.empty{opacity:1;background:#fffdf6!important;box-shadow:0 0 0 2px currentColor inset}
  .sk.a.empty{color:#e9a35a}.sk.b.empty{color:#e98aa0}.sk.c.empty{color:#79b99a}.sk.d.empty{color:#8f8ad6}.sk.e.empty{color:#5f9fcf}
  .hgt{justify-content:flex-start;padding-left:58px}
  .hgt .frame{width:52px;background:linear-gradient(90deg,#d6b487,#ecd5af 35%,#e2c497 70%,#d0aa7c)}
  .hgt .tape{left:auto;right:0;width:7px;border-radius:0}
  .hgt .tk em{left:auto;right:-30px;top:-8px}
  .hgt .tk.on{width:34px}
  .hgt .mark{right:auto;left:-50px}
  .lastend .pic{width:auto;height:min(40vh,300px)}
}

/* 標題：Logo 移到按鈕上方，不擋澄澄的臉；加白邊才看得清楚 */
.title.hascg .logo{margin:auto 0 4px!important}
.title.hascg .tlogo{width:78%;max-width:330px;filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 0 6px rgba(255,255,255,.9)) drop-shadow(0 6px 12px rgba(45,58,102,.3))}
@media(min-width:1100px) and (min-height:560px){
  .stk{gap:6px 2px}
  .sk{aspect-ratio:auto;border-radius:0;background:none!important;box-shadow:none;opacity:1;color:var(--navy)}
  .sk i{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;font-style:normal;font-size:.95rem;font-weight:700;color:#fff;box-shadow:0 0 0 2px #fff,0 2px 5px rgba(45,58,102,.2)}
  .sk span{margin-top:5px;font-size:.68rem;color:var(--navy);white-space:nowrap}
  .sk span small{font-size:.6rem;color:var(--mute)}
  .sk.a i{background:#e9a35a}.sk.b i{background:#e98aa0}.sk.c i{background:#79b99a}.sk.d i{background:#8f8ad6}.sk.e i{background:#5f9fcf}
  .sk.empty{background:none!important;box-shadow:none}
  .sk.empty i{background:#fffdf6!important;box-shadow:0 0 0 2px currentColor inset,0 2px 5px rgba(45,58,102,.1)}
  .sk.a.empty i{color:#e9a35a}.sk.b.empty i{color:#e98aa0}.sk.c.empty i{color:#79b99a}.sk.d.empty i{color:#8f8ad6}.sk.e.empty i{color:#5f9fcf}
  .who{flex:1;display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:18px 8px}
  .who>div{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.8rem}
  .who .hd{width:62px;height:62px}
}

.title.hascg .polaroid-t{display:none}
@media(min-width:1100px) and (min-height:560px){
  .nbsub{margin:-8px 0 0;text-align:center;font-size:.8rem;color:var(--navy2)}
  .nb h5{margin:4px 0 -6px;font-size:.78rem;letter-spacing:.2em;color:#8fb8a0}
  .todo{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
  .todo li{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;line-height:1.35}
  .todo li i{flex:none;width:16px;height:16px;margin-top:2px;border:2px solid #9cc5ae;border-radius:4px;background:#fff;position:relative}
  .todo li.ok i{background:#9cc5ae}
  .todo li.ok i::after{content:'';position:absolute;left:4px;top:0;width:4px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
  .todo li span{display:flex;flex-direction:column}
  .todo li small{font-size:.72rem;color:var(--mute);font-weight:400}
  .todo li.ok span{color:var(--mute);text-decoration:line-through;text-decoration-color:rgba(91,94,120,.35)}
  .nb .note{margin-top:auto}
  .nb .lastend{flex:1 1 auto;min-height:0;justify-content:flex-end}
  .nb .lastend .pic{height:min(30vh,240px)}
  .stk{grid-template-columns:repeat(5,1fr);gap:0}
  .sk{display:flex;flex-direction:column;align-items:center}
  .sk span{margin-top:6px;font-size:.72rem;line-height:1.1}
  .sk small{font-size:.62rem;color:var(--mute);line-height:1.2}
  .leg{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:10px;border-top:2px dashed rgba(143,184,160,.5)}
  .leg>div{display:flex;flex-direction:column;align-items:center;padding:8px 4px;border-radius:10px;background:rgba(255,255,255,.7)}
  .leg b{font-size:1.35rem;line-height:1.1;color:var(--navy)}
  .leg span{font-size:.72rem;color:var(--navy2);margin-top:2px}
}

/* ===== 設定 ===== */
.gear{position:absolute;top:12px;right:12px;z-index:5;min-width:0;min-height:0;width:42px;height:42px;margin:0!important;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid #fff;border-image:none;background:rgba(45,58,102,.55);color:#fff;box-shadow:0 2px 8px rgba(45,58,102,.3)}
.gear.ingame{top:auto;bottom:92px;right:12px;width:38px;height:38px}
.hm2{position:relative}
.setp .sbox{width:min(86vw,340px);padding:22px 22px 18px;border-radius:22px;background:#fffdf6;border:3px solid #cfe6d6;box-shadow:0 12px 34px rgba(29,34,56,.3);display:flex;flex-direction:column;gap:14px;animation:popin .28s ease both}
.setp h3{margin:0 0 4px;text-align:center;color:var(--navy);letter-spacing:.2em}
.setp label{display:grid;grid-template-columns:3em 1fr 2.4em;align-items:center;gap:10px;font-size:.95rem;color:var(--navy)}
.setp input[type=range]{width:100%;accent-color:#8fc4a6}
.setp label b{text-align:right;font-size:.85rem;color:var(--navy2)}
.setp #x{align-self:center;margin-top:4px}
/* 手機：音樂 APP */
.phone .mrow{display:flex;align-items:center;gap:12px;width:100%;min-height:0;margin:0 0 8px;padding:12px 14px;border-radius:14px;border:2px solid #e2efe6;border-image:none;background:#fff;color:var(--navy);box-shadow:none;text-align:left}
.phone .mrow i{font-style:normal;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#e9f4ee;color:#3f7d5e;font-size:.8rem}
.phone .mrow.on{border-color:#9cc5ae;background:#f2faf5}
/* ===== 動畫 ===== */
@keyframes popin{from{opacity:0;transform:scale(.94) translateY(8px)}to{opacity:1;transform:none}}
@keyframes chin{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@keyframes tin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes cgzoom{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}
@keyframes chup{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.modal>.box,.modal>.lbox,.modal>.fbox,.modal>.nmbox{animation:popin .28s ease both}
.stage .npcs img{animation:chin .45s ease both}
.stage #ch.appear{animation:chin .45s ease both}
.dialog .txt.tin{animation:tin .3s ease both}
.stage .evcg{animation:cgzoom .9s cubic-bezier(.2,.7,.2,1) both}
.cgv .cgimg{animation:cgzoom 1s cubic-bezier(.2,.7,.2,1) both}
.story .choices button{animation:chup .35s ease both}
.story .choices button:nth-child(2){animation-delay:.05s}.story .choices button:nth-child(3){animation-delay:.1s}.story .choices button:nth-child(4){animation-delay:.15s}.story .choices button:nth-child(5){animation-delay:.2s}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important}}
/* ===== 電腦版：彈出視窗只蓋住遊戲畫面，不蓋滿整個螢幕 ===== */
@media(min-width:640px) and (min-height:560px){
  :root{--aw:min(480px,calc((100vh - 36px) * .56))}
  .modal,.modal.namep,.cgv{left:calc(50% - var(--aw) / 2)!important;right:auto!important;width:var(--aw)!important;max-width:none!important;top:18px!important;bottom:18px!important;height:auto!important;transform:none!important;border-radius:28px;overflow:hidden;box-sizing:border-box}
}
.title .gear{min-width:0;width:42px;height:42px;margin:0;padding:0;position:absolute;top:12px;right:12px;left:auto}
@media(min-width:1100px) and (min-height:560px){
  /* 標題：照片輪播＋作者 */
  .slide{position:relative;flex:1 1 auto;min-height:0;margin:2px 4px 0;background:#fff;padding:8px 8px 26px;box-shadow:0 8px 18px rgba(45,58,102,.22);transform:rotate(1.5deg)}
  .slide i{position:absolute;left:8px;right:8px;top:8px;bottom:26px;background:#ece5d6 center/cover no-repeat;opacity:0;transition:opacity 1.2s ease}
  .slide i.on{opacity:1}
  .author{flex:none;text-align:center}
  .author h5{margin:0 0 6px}
  .author .aname{margin:0 0 8px;font-size:1rem;color:var(--navy)}
  .alinks{display:flex;flex-direction:column;gap:6px}
  .alinks a{display:block;padding:7px 10px;border-radius:99px;background:#fff;border:2px solid #cfe6d6;color:var(--navy);text-decoration:none;font-size:.85rem;box-shadow:0 2px 0 #cfe6d6}
  .alinks a:hover{background:#eef7f1}
  /* 遊戲中：素質、日記 */
  .nb h5{margin:2px 0 -8px}
  .todo{gap:6px}
  .todo li{font-size:.85rem}
  .sstat{display:flex;flex-direction:column;gap:3px}
  .sstat div{display:grid;grid-template-columns:2.6em 1fr 2.4em;align-items:center;gap:6px;font-size:.75rem}
  .sstat span{color:var(--navy2);font-weight:400}
  .sstat em{height:6px;border-radius:99px;background:#e6efe9;overflow:hidden}
  .sstat u{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#9fd3b4,#8fb6e0)}
  .sstat b{text-align:right;font-size:.75rem}
  .sdiary{padding:8px 10px;border-radius:6px;background:rgba(255,255,255,.75);font-size:.78rem;line-height:1.5}
  .sdiary b{display:block;font-size:.75rem;color:#8fb8a0}
  .sdiary p{margin:0;font-family:var(--story);font-weight:400;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .nb .note{padding:8px 10px 10px;font-size:.8rem}
  #sideR .pola .pic{height:min(34vh,280px)}
  #sideR .msg{margin-top:-4px}
}
/* 電腦版：畫面內留一點邊，狀態列、對話框的花邊不會被圓角切掉；標題圖還是滿版 */
@media(min-width:640px) and (min-height:560px){
  #app{padding:14px}
  .title{margin:-14px;height:calc(100% + 28px)!important}
}
/* 關於作者 */
.gear.cup{right:62px}
.gear.cup.ingame{right:12px;bottom:138px}
.title .gear.cup{right:62px}
.authp .abox{position:relative;width:min(88vw,360px);max-height:calc(100% - 20px);overflow:auto;padding:22px 20px 20px;border-radius:26px;background:#fffdf6;border:3px solid #cfe6d6;box-shadow:0 14px 40px rgba(29,34,56,.32);text-align:center;animation:popin .3s ease both}
.authp .ax{position:absolute;top:10px;right:10px;min-width:0;min-height:0;width:32px;height:32px;margin:0;padding:0;border-radius:50%;border:0;border-image:none;background:#eef7f1;color:var(--navy2);font-size:1.2rem;line-height:1;box-shadow:none}
.authp .aimg{margin:6px 6px 16px;padding:8px;background:#fff;box-shadow:0 8px 18px rgba(45,58,102,.2);transform:rotate(-2deg)}
.authp .aimg span{display:block;aspect-ratio:4/3;background:#eee center/cover no-repeat}
.authp .aimg.none{display:none}
.authp h3{margin:0;font-family:'Noto Serif TC',serif;font-size:1.5rem;letter-spacing:.2em;color:var(--navy)}
.authp h3 small{margin-left:8px;font-size:.75rem;letter-spacing:.15em;color:#c39a5a;font-family:var(--ui)}
.authp .alines{margin:12px 0 16px;font-family:var(--story);font-weight:400;font-size:.95rem;line-height:1.9;color:var(--navy2)}
.authp .alines p{margin:0}.authp .alines i{font-style:normal;color:#ec7f93}
.authp .arows{display:flex;flex-direction:column;gap:10px;padding-top:14px;border-top:1px solid #e2efe6}
.authp .arow{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:99px;background:#f3f9f5;border:2px solid #d6eadd;color:var(--navy);text-decoration:none;text-align:left}
.authp .arow i{flex:none;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;color:#5f9d7b;font-style:normal;font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.authp .arow span{flex:1;display:flex;flex-direction:column}
.authp .arow b{font-size:1rem;letter-spacing:.06em}.authp .arow small{font-size:.75rem;color:var(--mute);font-weight:400}
.authp .arow em{font-style:normal;font-size:1.3rem;color:#9cc5ae}
.authp .arow.main{background:linear-gradient(90deg,#7fbf9c,#5fa685);border-color:#5fa685;color:#fff;box-shadow:0 6px 14px rgba(95,166,133,.35)}
.authp .arow.main small,.authp .arow.main em{color:rgba(255,255,255,.85)}.authp .arow.main i{color:#5fa685}
@media(min-width:1100px) and (min-height:560px){
  .authc{flex:none;display:flex;align-items:center;gap:10px;width:100%;min-height:0;margin:0;padding:10px 12px;border-radius:14px;border:2px solid #d6eadd;border-image:none;background:#fff;color:var(--navy);box-shadow:0 2px 0 #d6eadd;text-align:left}
  .authc i{flex:none;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eef7f1;color:#5f9d7b;font-style:normal}
  .authc span{flex:1;display:flex;flex-direction:column}
  .authc small{font-size:.7rem;color:#8fb8a0;letter-spacing:.2em;font-weight:400}
  .authc b{font-size:1rem}.authc b em{font-style:normal;font-size:.7rem;color:#c39a5a;letter-spacing:.1em}
  .authc u{text-decoration:none;font-size:1.3rem;color:#9cc5ae}
  /* 排滿：照片框跟著空間伸縮 */
  #sideR .pola{flex:1 1 auto;min-height:0;width:100%;box-sizing:border-box}
  #sideR .pola .pic{flex:1 1 auto;height:auto;aspect-ratio:auto;min-height:120px}
  .sdiary{flex:1 1 auto;min-height:60px;overflow:hidden}
  .sdiary p{-webkit-line-clamp:8}
}
/* 手帳素材（有圖就用，沒圖就維持現在的樣子） */
@media(min-width:1100px) and (min-height:560px){
  .nb{background:url(../assets/ui/nb_paper.jpg) center/cover no-repeat,linear-gradient(rgba(255,255,255,0) 23px,rgba(150,180,165,.16) 24px) 0 0/100% 24px,#fbf6ea}
  #sideL::before{background:url(../assets/ui/nb_tape_mint.png) center/100% 100% no-repeat,repeating-linear-gradient(45deg,rgba(168,214,190,.85) 0 8px,rgba(200,232,214,.85) 8px 16px)}
  #sideR::before{background:url(../assets/ui/nb_tape_pink.png) center/100% 100% no-repeat,repeating-linear-gradient(45deg,rgba(246,184,198,.85) 0 8px,rgba(252,214,222,.85) 8px 16px)}
  .nb .note{background:url(../assets/ui/nb_sticky.png) center/100% 100% no-repeat,#fff1a8}
}
/* 素質：方塊（圖示＋名稱＋數值），心情、體力才用量條 */
.panel .stiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 12px}
.panel .stile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:10px 4px 8px;border-radius:14px;background:#fff;border:2px solid #e2efe6;text-align:center}
.panel .stile span{font-size:.78rem;color:var(--navy2)}
.panel .stile b{font-size:1.15rem;color:var(--navy);line-height:1.1}
/* 新手教學 */
.tut{position:fixed;inset:0;z-index:200}
.tut .thole{position:fixed;border-radius:14px;box-shadow:0 0 0 9999px rgba(29,34,56,.55),0 0 0 3px #ffe08a;transition:all .3s ease;pointer-events:none}
.tut .tbub{position:fixed;display:flex;gap:10px;align-items:flex-start;box-sizing:border-box;padding:14px;border-radius:18px;background:#fffdf6;border:3px solid #cfe6d6;box-shadow:0 10px 30px rgba(29,34,56,.35)}
.tut .tbub.tin{animation:popin .3s ease both}
.tut .tbub .hd{flex:none;width:46px;height:46px;border-radius:50%;background:#fff center/cover no-repeat;box-shadow:0 0 0 2px #fff,0 2px 5px rgba(45,58,102,.25)}
.tut .tbub>div{flex:1}
.tut .tbub p{margin:2px 0 10px;font-family:var(--story);font-weight:400;font-size:.95rem;line-height:1.6;color:var(--navy)}
.tut .tbtn{display:flex;justify-content:flex-end;gap:8px}
.tut .tbtn button{min-width:0;min-height:0;margin:0;padding:6px 16px;font-size:.85rem}
.tut .tskip{background:none;border:0;border-image:none;box-shadow:none;color:var(--mute)}
/* 設定：開關 */
.setp .stog{grid-template-columns:1fr auto;cursor:pointer}
.setp .stog input{display:none}
.setp .stog i{position:relative;width:44px;height:24px;border-radius:99px;background:#dfe5e1;transition:background .2s}
.setp .stog i::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:left .2s}
.setp .stog input:checked+i{background:#8fc4a6}
.setp .stog input:checked+i::after{left:23px}
/* 狀態列：字多一點層次 */
.tb2 .age2{flex-direction:row;align-items:baseline;gap:6px;padding-left:4px}
.tb2 .age2 small{font-size:.72rem;color:#8fb8a0;letter-spacing:.12em}
.tb2 .age2 b{font-family:'Noto Serif TC',serif!important;font-weight:700!important;font-size:1.5rem!important;color:var(--navy);line-height:1}
.tb2 .age2 b i{font-style:normal;font-size:.8rem;margin-left:1px}
.tb2 .age2 span{font-size:.68rem;color:#fff;background:#9cc5ae;border-radius:99px;padding:1px 8px;align-self:center}
.tb2 .rs{gap:12px;align-items:center}
.tb2 .rs .moo{display:flex;align-items:center;gap:5px}
.tb2 .rs .moo>span{display:flex;flex-direction:column;line-height:1.05}
.tb2 .rs .moo small{font-size:.6rem;color:var(--mute);letter-spacing:.08em}
.tb2 .rs .moo b{font-family:var(--ui)!important;font-weight:700!important;font-size:.95rem!important;color:var(--navy)}
.tb2 .rs .moo .ico{width:22px;height:22px}
.tb2 .rs .wal2 b{color:#b8577e}
.tb2 .age2{flex-direction:column;align-items:flex-start;gap:1px}
.tb2 .age2 small{white-space:nowrap}
.tb2 .rs{gap:9px}
.tb2 .rs .moo small{white-space:nowrap}
.tb2 .rs .moo .ico{width:20px;height:20px}
@media(max-width:400px){.tb2 .rs .moo .ico{display:none}.tb2 .rs{gap:10px}.tb2 .age2 small{font-size:.62rem;letter-spacing:.04em}}
/* 狀態列：拿掉文字標籤，只留圖示＋數字（教學會說明圖示） */
.tb2 .age2 small{font-size:.66rem;letter-spacing:.14em;color:#8fb8a0}
.tb2 .rs{gap:12px}
.tb2 .rs .moo{gap:4px}
.tb2 .rs .moo .ico{display:block!important;width:22px;height:22px}
.tb2 .rs .moo b{font-size:1rem!important}
@media(max-width:400px){.tb2 .rs{gap:8px}.tb2 .rs .moo .ico{width:18px;height:18px}.tb2 .rs .moo b{font-size:.88rem!important}}
.tip2{position:fixed;z-index:120;transform:translateX(-50%);padding:5px 12px;border-radius:99px;background:rgba(45,58,102,.88);color:#fff;font-size:.8rem;white-space:nowrap;pointer-events:none;animation:popin .2s ease both}
.tip2::before{content:'';position:absolute;left:50%;top:-5px;margin-left:-5px;border:5px solid transparent;border-top:0;border-bottom-color:rgba(45,58,102,.88)}
.tb2 .rs .moo{cursor:pointer}
@keyframes tipin{from{opacity:0}to{opacity:1}}
.tip2{animation:tipin .2s ease both}
.phone .mnow{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:12px 14px;border-radius:16px;background:linear-gradient(135deg,#eaf6ef,#f6eefb);box-shadow:inset 0 0 0 2px #d6eadd}
.phone .mnow span{flex:1;display:flex;flex-direction:column;min-width:0}
.phone .mnow small{font-size:.7rem;color:#8fb8a0;letter-spacing:.15em}
.phone .mnow b{font-size:1rem;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phone .mnow button{min-width:0;min-height:0;width:38px;height:38px;margin:0;padding:0;border-radius:50%;border:0;border-image:none;background:#fff;color:#5f9d7b;font-size:.9rem;box-shadow:0 2px 5px rgba(45,58,102,.15)}