:root{
  --bg:#fdf6e3; --panel:#fffdf5; --ink:#4a4031; --muted:#9a8f78;
  --green:#8fbf73; --green-d:#6fa352; --gold:#e6b94e; --energy:#7db8d6;
  --soil:#b88a5e; --soil-d:#9c7048; --line:#e7ddc4; --shadow:0 6px 18px rgba(120,100,60,.12);
}
*{box-sizing:border-box;}
html,body{margin:0; padding:0;}
body{
  font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  background:var(--bg); color:var(--ink); min-height:100vh; padding:14px;
  transition:background .6s;
}
canvas{image-rendering:pixelated; image-rendering:crisp-edges;}
.wrap{max-width:1100px; margin:0 auto;}

/* 顶部资源栏 */
header.bar{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  background:var(--panel); border:1px solid var(--line); border-radius:18px;
  padding:12px 16px; box-shadow:var(--shadow); margin-bottom:14px;
}
header.bar h1{font-size:19px; margin:0; flex:1 1 100%; letter-spacing:1px;}
.res{display:flex; gap:8px; flex-wrap:wrap; flex:1 1 auto;}
.chip{
  background:#fff; border:1px solid var(--line); border-radius:999px;
  padding:6px 12px; font-weight:700; font-size:14px; display:flex; gap:5px; align-items:center;
}
.chip small{font-weight:500; color:var(--muted);}
button{
  font-family:inherit; cursor:pointer; border:none; border-radius:12px;
  padding:9px 14px; font-size:14px; font-weight:700; transition:.15s; -webkit-tap-highlight-color:transparent;
}
button:active{transform:translateY(1px);}
.btn-sleep{background:var(--ink); color:#fff;}
.btn-sleep:hover{background:#3a3326;}
.btn-add{background:var(--green); color:#fff;}
.btn-add:hover{background:var(--green-d);}

/* 主布局 */
.main{display:grid; grid-template-columns:1.05fr 1.45fr; gap:14px; align-items:start;}
.col-tasks .panel{position:sticky; top:14px;}
.panel{
  background:var(--panel); border:1px solid var(--line); border-radius:18px;
  padding:14px; box-shadow:var(--shadow); margin-bottom:14px;
}
.panel h2{font-size:16px; margin:0 0 10px; display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.panel h2 .sub{font-size:12px; color:var(--muted); font-weight:500;}

/* 任务 */
.task{display:flex; align-items:center; gap:8px; padding:9px 10px; border-radius:12px; background:#fff; border:1px solid var(--line); margin-bottom:7px;}
.task.done{opacity:.55; background:#f4efe2;}
.task .do{width:24px; height:24px; border-radius:8px; border:2px solid var(--green); background:#fff; color:var(--green); font-weight:900; font-size:14px; flex:none; display:flex; align-items:center; justify-content:center;}
.task.done .do{background:var(--green); color:#fff;}
.task .name{flex:1; font-size:14px;}
.task .reward{font-size:12px; color:var(--muted); white-space:nowrap;}
.task .reward b{color:var(--ink);}
.task .del{background:transparent; color:#c98; padding:4px 6px; font-size:13px;}
.addrow{display:flex; gap:6px; margin-top:8px; flex-wrap:wrap;}
.addrow input{font-family:inherit; border:1px solid var(--line); border-radius:10px; padding:8px 10px; font-size:13px; background:#fff; flex:1 1 120px; min-width:0;}
.preset{display:flex; gap:6px; flex-wrap:wrap; margin-top:8px;}
.preset button{background:#f3ecd8; color:var(--ink); font-size:12px; padding:6px 10px; border-radius:999px;}
.preset button:hover{background:#ece2c4;}

/* 标签页 */
.tabs{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px;}
.tabs button{background:#f3ecd8; color:var(--ink); flex:1 1 auto;}
.tabs button.active{background:var(--green); color:#fff;}
.view{display:none;}
.view.active{display:block;}

/* 种子商店 */
.shop{display:none; gap:8px; flex-wrap:wrap; margin-bottom:12px; padding:10px; border:1px dashed var(--line); border-radius:12px; background:#fffaf0;}
.shop.show{display:flex;}
.shop .hint{width:100%; font-size:12px; color:var(--muted);}
.seed{background:#fff; border:1px solid var(--line); border-radius:12px; padding:8px; font-size:13px; display:flex; flex-direction:column; align-items:center; gap:2px; min-width:62px;}
.seed:hover{border-color:var(--gold);}
.seed .e{width:36px; height:36px;}
.seed .c{font-size:11px; color:var(--muted);}
.seed:disabled{opacity:.45; cursor:not-allowed;}

/* 农场网格 */
.farm{display:grid; grid-template-columns:repeat(4,1fr); gap:9px;}
.plot{aspect-ratio:1/1; border-radius:14px; position:relative; cursor:pointer; background:linear-gradient(160deg,var(--soil),var(--soil-d)); border:2px solid #8a6442; display:flex; align-items:center; justify-content:center; transition:.15s; overflow:hidden;}
.plot:hover{border-color:#6f4f33; transform:translateY(-2px);}
.plot.empty{background:linear-gradient(160deg,#c79a6e,#b3865c);}
.plot.sel{border-color:var(--gold); box-shadow:0 0 0 3px rgba(230,185,78,.35);}
.plot.mature{border-color:var(--green); box-shadow:0 0 0 3px rgba(143,191,115,.4); animation:pulse 1.4s infinite;}
.plot canvas{width:80%; height:80%;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 3px rgba(143,191,115,.4);}50%{box-shadow:0 0 0 6px rgba(143,191,115,.15);}}
.plot .bar{position:absolute; bottom:0; left:0; height:5px; background:var(--green); transition:width .4s;}
.plot .tag{position:absolute; top:4px; right:5px; font-size:10px; color:#fff; background:rgba(0,0,0,.28); border-radius:6px; padding:1px 5px;}

.tip{font-size:12px; color:var(--muted); margin:6px 2px 0;}

/* 牧场 */
.barn{display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px;}
.animal{background:#fff; border:1px solid var(--line); border-radius:14px; padding:10px; text-align:center;}
.animal canvas{width:64px; height:64px;}
/* 高清写实素材（动物 / 家具 / 小屋）—— 写实 PNG 不做像素化，平滑呈现 */
.asset-img{image-rendering:pixelated; image-rendering:crisp-edges; object-fit:contain; background:transparent; display:block;}
.animal .asset-img{width:64px; height:64px; margin:0 auto;}
.seed .asset-img{width:36px; height:36px; margin:0 auto;}
.cell .asset-img{width:84%; height:84%; position:relative; z-index:1;}
.decor-shop .seed .asset-img{width:40px; height:40px;}
.ws-row .asset-img{width:34px; height:34px; flex:none;}
.cabin-building{height:150px; width:auto; max-width:100%; object-fit:contain; border-radius:14px; border:2px solid #d8c79f; display:block; margin:0 auto 10px; box-shadow:0 2px 8px rgba(0,0,0,.12); background:#eef3ec; image-rendering:pixelated; image-rendering:crisp-edges;}
.npc-portrait{width:112px; height:112px; object-fit:contain; image-rendering:pixelated; background:#f3ecdc; border:2px solid #d8c79f; border-radius:12px; display:block; margin:0 auto; box-shadow:0 2px 6px rgba(0,0,0,.12);}
.npc-portrait.small{width:46px; height:46px; border-width:1px; vertical-align:middle;}
.animal .nm{font-size:13px; font-weight:700; margin:4px 0;}
.animal .st{font-size:11px; color:var(--muted);}
.animal .collect{margin-top:6px; background:var(--gold); color:#fff; font-size:12px; padding:6px 10px; width:100%;}
.animal .collect:disabled{opacity:.5;}

/* 小屋 */
.room{display:grid; grid-template-columns:repeat(6,1fr); gap:5px; background:#f0e6cf; padding:8px; border-radius:14px; border:2px solid #d8c79f; position:relative; overflow:hidden;}
.cell{aspect-ratio:1/1; background:#f6efdd; border:1px solid #e3d6b6; border-radius:6px; display:flex; align-items:center; justify-content:center; cursor:pointer; position:relative; overflow:hidden;}
.cell canvas{position:relative; z-index:1;}
/* —— 房间专属氛围（背景底色 + 光照晕染） —— */
.room.theme-main{background:linear-gradient(160deg,#fbeede,#f3ddc0); border-color:#e3c896;}
.room.theme-main::after{content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 50% 115%, rgba(255,205,130,.40), transparent 62%);}
.room.theme-main .cell{background:#fff7e9; border-color:#ecd9b6;}
.room.theme-kitchen{background:linear-gradient(160deg,#fde7cf,#f6d2a6); border-color:#e8b87c;}
.room.theme-kitchen::after{content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 82% 8%, rgba(255,175,80,.34), transparent 55%);}
.room.theme-kitchen .cell{background:#fff1df; border-color:#f1cfa0;}
.room.theme-study{background:linear-gradient(160deg,#e7efe6,#d6e6dd); border-color:#a9ccb8;}
.room.theme-study::after{content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 12% 14%, rgba(170,215,170,.32), transparent 55%);}
.room.theme-study .cell{background:#eef6ec; border-color:#cde2d1;}
.room.theme-garden{background:linear-gradient(160deg,#e2f3d8,#cdebc9); border-color:#9fcf9a;}
.room.theme-garden::after{content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 50% -10%, rgba(255,250,200,.50), transparent 60%);}
.room.theme-garden .cell{background:#eefae6; border-color:#c7e6b6;}
/* —— 套装进度提示 —— */
.set-prog{color:#c08a3e; font-weight:600;}
.set-done{color:#5a9e4b; font-weight:700;}
.rstar{color:#e6b94e; font-size:11px; font-weight:700;}
.cell:hover{border-color:var(--gold);}
.cell canvas{width:84%; height:84%;}
/* —— 房间专属背景插画 —— */
.roomScene{width:100%; height:auto; display:block; border-radius:14px; border:2px solid #d8c79f; margin-bottom:6px; box-shadow:0 2px 8px rgba(120,90,40,.12);}
/* —— 跨房联动提示 —— */
.synergy{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:0 0 8px;}
.sy-label{font-weight:700; color:#8a6f4a; font-size:13px;}
.sy-chip{font-size:12px; padding:3px 9px; border-radius:999px; background:#fff; border:1px solid #e2d3b3; color:#9a8f78;}
.sy-chip.on{background:linear-gradient(120deg,#ffd98a,#ffb347); border-color:#e8a23c; color:#5a3d10; font-weight:700;}
.sy-chip.grand{background:linear-gradient(120deg,#c9b3ff,#9b7bff); border-color:#7d5be0; color:#fff; font-weight:700;}
/* —— 羁绊图 —— */
.bond-wrap{margin-top:10px; background:#fffaf0; border:1px solid #e7dcc2; border-radius:14px; padding:10px;}
.synergyMap{width:100%; height:auto; display:block;}
/* —— 温馨度 / 氛围 —— */
.cozy{display:flex; align-items:center; gap:8px; margin:8px 0 4px; font-size:12px; color:#8a6f4a; font-weight:600;}
.cozy-bar{flex:1; height:8px; background:#ece0c6; border-radius:999px; overflow:hidden;}
.cozy-bar i{display:block; height:100%; background:linear-gradient(90deg,#ffd98a,#ff9a3c); border-radius:999px; transition:width .4s;}
.atmos{font-size:12px; color:#9a8f78; margin:2px 0 0;}
/* —— 摆放闪烁特效 —— */
@keyframes cellflash{0%{box-shadow:0 0 0 0 rgba(255,200,80,0);}30%{box-shadow:0 0 0 4px rgba(255,200,80,.85);}100%{box-shadow:0 0 0 0 rgba(255,200,80,0);}}
.cell.flash{animation:cellflash .9s ease-out;}
.decor-shop .seed .e{width:40px; height:40px;}

/* 图鉴 */
.ach{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:9px; margin-bottom:14px;}
.ach-item{background:#fff; border:1px solid var(--line); border-radius:12px; padding:10px; text-align:center;}
.ach-item.locked{opacity:.5;}
.ach-item .ic{font-size:20px;}
.ach-item .t{font-size:13px; font-weight:700; margin-top:3px;}
.ach-item .d{font-size:11px; color:var(--muted);}
.codex-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(78px,1fr)); gap:9px;}
.codex-cell{background:#fff; border:1px solid var(--line); border-radius:12px; padding:8px 4px; text-align:center;}
.codex-cell canvas{width:46px; height:46px;}
.codex-cell.locked{background:#f3eee0;}
.codex-cell .lbl{font-size:10px; color:var(--muted); margin-top:3px;}
.codex-cell .q{font-size:26px; color:#c8bda1; line-height:46px;}

/* 日志 + 天气 */
.log{margin-top:12px; background:#fffaf0; border:1px solid var(--line); border-radius:12px; padding:10px; height:110px; overflow-y:auto; font-size:13px; line-height:1.7; color:#6a6049;}
.log div{padding:2px 0; border-bottom:1px dashed #efe6cf;}
.log div:last-child{border-bottom:none;}
.reset{background:transparent; color:var(--muted); font-size:12px; padding:4px 8px; margin-top:8px;}
.reset:hover{color:#b55;}

#weather{position:fixed; inset:0; pointer-events:none; z-index:1; opacity:.7;}

.toast{position:fixed; left:50%; top:18px; transform:translateX(-50%) translateY(-20px); background:var(--ink); color:#fff; padding:10px 18px; border-radius:999px; font-weight:700; opacity:0; transition:.25s; pointer-events:none; z-index:99; box-shadow:var(--shadow); max-width:90vw; text-align:center;}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0);}

/* 移动端适配 */
@media(max-width:820px){
  body{padding:10px 10px 0;}
  .wrap{padding-bottom:78px;}            /* 给底部固定导航栏留位 */
  .main{grid-template-columns:1fr;}
  .col-tasks .panel{position:static;}
  /* 顶栏：标题+按钮一行，资源 chip 单独一行 */
  header.bar{gap:6px;}
  header.bar h1{flex:1 1 auto; min-width:0; font-size:17px;}
  .res{gap:5px; flex:1 1 100%; order:2; margin-top:2px;}
  .chip{font-size:12px; padding:4px 9px;}
  .btn-sleep{padding:8px 12px; font-size:14px;}
  /* 底部固定导航栏 */
  .tabs{position:fixed; left:0; right:0; bottom:0; z-index:60;
        display:flex; gap:4px; margin:0;
        padding:8px 6px calc(8px + env(safe-area-inset-bottom));
        background:rgba(255,255,255,.97);
        -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
        box-shadow:0 -3px 14px rgba(0,0,0,.14); border-top:1px solid var(--line);}
  .tabs button{flex:1 1 0; min-width:0; font-size:11px; padding:9px 2px; border-radius:11px; line-height:1.15;}
  .farm{grid-template-columns:repeat(3,1fr);}
  .room{grid-template-columns:repeat(4,1fr);}
  /* 放大触摸目标（移动端 ≥44px 习惯） */
  .task .do{width:34px; height:34px; font-size:18px;}
  .btn-add,.collect,.seed,.btn-sleep,.preset button{min-height:44px; font-size:15px;}
  .addrow input{min-height:44px;}
}
@media(max-width:420px){
  .farm{gap:6px;}
  .room{gap:4px;}
  .chip{font-size:11px; padding:4px 8px;}
  .tabs button{font-size:10px;}
}

/* 加工坊 */
.ws{display:flex; flex-direction:column; gap:7px; margin-bottom:6px;}
.ws-row{display:flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:8px 10px;}
.ws-row .e{width:34px; height:34px; flex:none;}
.ws-row .nm{font-size:14px; font-weight:700; flex:1; min-width:0;}
.ws-row .ct{font-size:12px; color:var(--muted); white-space:nowrap;}
.ws-row .mini{background:var(--gold); color:#fff; font-size:12px; padding:6px 10px; border-radius:10px; white-space:nowrap;}
.ws-row .mini:disabled{opacity:.45; cursor:not-allowed;}
.ws-row .bar{height:7px; background:var(--green); border-radius:99px; transition:width .4s; min-width:40px; flex:1;}

/* 仓库与卖出 */
.inv-list{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px;}
.inv-chip{background:#f3ecd8; border:1px solid var(--line); border-radius:999px; padding:5px 11px; font-size:12px; font-weight:700;}

/* 节日横幅 */
.fest{display:flex; align-items:center; gap:12px; background:linear-gradient(100deg,#fff6e0,#ffe9ef); border:2px solid var(--gold); border-radius:16px; padding:11px 14px; margin:10px 0;}
.fest.done{opacity:.6; border-color:var(--line);}
.fest .fe{font-size:30px; line-height:1;}
.fest .ft{flex:1;}
.fest .ft b{font-size:15px;}
.fest .ft div{font-size:12px; color:var(--muted);}
.fest button{background:var(--green); color:#fff; font-size:13px; padding:8px 16px; border-radius:999px; flex:none;}
.fest .fd{font-size:13px; font-weight:700; color:var(--green-d);}

/* 弹窗 */
.modal{position:fixed; inset:0; background:rgba(40,34,22,.55); display:none; align-items:center; justify-content:center; z-index:200; padding:16px;}
.modal.show{display:flex;}
.modal-card{position:relative; background:var(--panel); border-radius:20px; padding:20px; max-width:380px; width:100%; box-shadow:var(--shadow); animation:pop .2s ease;}
@keyframes pop{from{transform:scale(.9); opacity:0;} to{transform:scale(1); opacity:1;}}
.modal-title{font-size:17px; font-weight:800; margin-bottom:10px;}
.modal-body{font-size:14px; color:var(--ink); line-height:1.6; margin-bottom:14px;}
.modal-actions{display:flex; gap:8px; flex-wrap:wrap;}
.modal-x{position:absolute; top:10px; right:12px; background:transparent; color:var(--muted); font-size:16px; padding:4px 8px;}

/* 节日小游戏 */
.fgame{position:fixed; inset:0; background:rgba(40,34,22,.6); display:flex; align-items:center; justify-content:center; z-index:300; padding:16px;}
.fgame-card{background:var(--panel); border-radius:20px; padding:16px; box-shadow:var(--shadow); text-align:center; animation:pop .2s ease;}
.fgame-h{font-size:17px; font-weight:800; margin-bottom:10px;}
.fgame-card canvas{background:#fff; border-radius:14px; border:2px solid var(--line); width:300px; height:330px; max-width:80vw; touch-action:none; cursor:pointer; image-rendering:auto;}
.fgame-info{font-size:13px; color:var(--muted); margin:10px 0 8px;}
.fgame-info b{color:var(--ink); font-size:15px;}
.fgame-skip{background:#f3ecd8; color:var(--ink); font-size:12px; padding:7px 12px; border-radius:999px;}
/* 小屋房间切换 */
.room-tabs{display:flex; gap:8px; flex-wrap:wrap; margin:6px 0 10px;}
.rtab{background:#fff; border:1px solid var(--line); color:var(--ink); font-size:13px; font-weight:700; padding:7px 12px; border-radius:999px;}
.rtab.sel{background:var(--gold); color:#fff; border-color:var(--gold);}
.rtab.locked{opacity:.55; cursor:default;}
.rtab .rk{font-size:11px; font-weight:500;}
/* 传奇工具 */
.badge-legend{background:linear-gradient(135deg,#f7c948,#e67e22); color:#fff; font-size:11px; padding:2px 7px; border-radius:999px; margin-left:4px; vertical-align:middle;}
.bcard.legend{border-color:var(--gold); box-shadow:0 0 0 2px rgba(230,185,78,.25);}
.legend-btn{background:linear-gradient(135deg,#f7c948,#e67e22); color:#fff;}
.legend-btn:hover{filter:brightness(.95);}

/* 探索地图 */
.stamina-wrap{display:flex; align-items:center; gap:10px; margin:4px 0 10px;}
.stamina-bar-bg{flex:1; height:14px; background:#eee3c8; border-radius:999px; overflow:hidden; border:1px solid var(--line);}
.stamina-bar{height:100%; width:100%; background:linear-gradient(90deg,#f0a85a,#e2884a); transition:width .4s; border-radius:999px;}
.stamina-label{font-size:13px; font-weight:700; white-space:nowrap;}
.explore-locs{display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px; margin-bottom:8px;}
.eloc{background:#fff; border:1px solid var(--line); border-radius:14px; padding:10px; text-align:center;}
.eloc canvas{width:64px; height:64px;}
.eloc .nm{font-size:13px; font-weight:700; margin:4px 0 2px;}
.eloc .ct{font-size:11px; color:var(--muted); margin-bottom:6px;}
.eloc .mini{background:var(--gold); color:#fff; font-size:12px; padding:6px 12px; border-radius:10px; width:100%;}
.eloc .mini:disabled{opacity:.45; cursor:not-allowed;}

/* 工坊建造 */
.build-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; margin-bottom:6px;}
.bcard{background:#fff; border:1px solid var(--line); border-radius:14px; padding:11px; text-align:center; display:flex; flex-direction:column; gap:5px; align-items:center;}
.bcard .bn{font-size:14px; font-weight:800;}
.bcard .bl{font-size:11px; color:var(--muted);}
.bcard .bc{font-size:12px; font-weight:700; color:var(--ink); min-height:16px;}
.bcard .mini{background:var(--green); color:#fff; font-size:12px; padding:6px 14px; border-radius:10px; width:100%; max-width:120px;}
.bcard .mini:disabled{background:#cfc6b0; cursor:not-allowed;}