*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:"Noto Serif SC","Songti SC",serif;background:#191a1a;color:#f3eee5}.task-stage{position:relative;width:100%;height:100dvh;min-height:480px;overflow:hidden}.scene{position:absolute;inset:0;background:url('../../opening-demo/assets/task-hall.png') center/cover no-repeat;filter:blur(7px) saturate(.62)}.veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,19,26,.42),rgba(23,22,20,.55) 43%,rgba(17,15,16,.81))}.back{position:absolute;z-index:5;top:26px;left:37px;display:grid;place-items:center;width:46px;height:46px;color:white;text-decoration:none;font:34px/1 Georgia,serif}.showcase{position:absolute;inset:0 auto 0 0;width:44%;overflow:hidden;background:linear-gradient(105deg,rgba(27,42,58,.47),rgba(52,61,66,.08));border-right:1px solid rgba(255,255,255,.08)}.showcase::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(6,10,13,.1) 52%,rgba(10,13,18,.88) 88%)}.orbit{position:absolute;left:20%;top:8%;width:390px;height:390px;border:1px solid rgba(233,237,234,.4);border-radius:50%;box-shadow:0 0 0 64px rgba(255,255,255,.025)}.lead{position:absolute;width:475px;height:700px;object-fit:contain;object-position:bottom;left:8%;bottom:158px;filter:drop-shadow(0 15px 23px #1118)}.showcase-copy{position:absolute;left:15%;bottom:253px;text-shadow:0 2px 9px #101820}.showcase-copy small{font:10px Georgia,serif;letter-spacing:.23em}.showcase-copy h1{margin:4px 0 0;font-size:39px;font-weight:500;letter-spacing:.17em}.showcase-copy p{margin:5px 0;font-size:14px;letter-spacing:.2em}.milestones{position:absolute;left:10%;right:6%;bottom:35px;padding:16px 18px 20px;background:rgba(11,12,15,.78);border-top:1px solid rgba(239,221,184,.55)}.milestones-head{display:flex;justify-content:space-between;align-items:baseline;font-size:19px;letter-spacing:.1em}.milestones-head strong{font:25px Georgia,serif}.milestones-head small{font-size:13px;color:#ddd3c3}.progress{height:3px;margin:17px 0 14px;background:rgba(255,255,255,.25)}.progress span{display:block;width:0;height:100%;background:#d1a977}.reward-track{display:flex;justify-content:space-between;gap:10px}.reward-track>div{display:grid;gap:5px;text-align:center}.reward-track b{font:16px Georgia,serif;color:#e4c08c}.reward-track span{font-size:12px;color:#dfd8ce}.task-content{position:absolute;left:44%;right:4%;top:54px;bottom:38px;display:flex;flex-direction:column;gap:20px}.tabs{display:grid;grid-template-columns:repeat(3,1fr);height:55px;flex:none;background:rgba(23,22,22,.9)}.tabs button{border:0;border-right:1px solid rgba(255,255,255,.11);background:transparent;color:#d8d4ce;font:20px "Noto Serif SC",serif;letter-spacing:.12em;white-space:nowrap}.tabs button.selected{background:#b97548;color:#fff}.task-list{display:grid;align-content:start;gap:17px;overflow:auto;padding-right:8px;scrollbar-color:#baa88a transparent}.task-card{height:139px;min-height:139px;display:grid;grid-template-columns:94px minmax(0,1fr) 110px 110px;align-items:center;gap:15px;padding:14px 18px;background:linear-gradient(120deg,#fbf8f0,#eeeae2);border:1px solid #d9d4c9;color:#242423;box-shadow:0 10px 25px #0002}.task-count{display:flex;align-items:baseline;justify-content:center;font:48px Georgia,serif;border-right:1px solid #ded8ce}.task-count span{font-size:20px;color:#837969}.task-info small{font:10px Georgia,serif;letter-spacing:.16em;color:#aa9271}.task-info h2{margin:6px 0 3px;font-size:18px;font-weight:500;line-height:1.35}.task-info p{margin:0;font-size:12px;color:#837b70}.task-reward{color:#896743;font:18px Georgia,serif;text-align:center}.task-reward small{display:block;font:11px "Noto Serif SC",serif}.task-card a{width:78px;height:78px;display:grid;place-items:center;border:1px solid #bb9d70;border-radius:50%;color:#896743;font-size:20px;text-decoration:none;justify-self:center}
.scene { background-image:url('../assets/task-hall.png'); }
.reward-track button { flex:1;min-width:0;min-height:58px;display:grid;justify-items:center;align-content:center;gap:2px;border:1px solid rgba(230,206,169,.5);background:rgba(255,255,255,.035);color:#f1e8db;font:inherit;cursor:pointer; }
.tabs button.selected { background:#96532f;color:#fff; }
.reward-track button:disabled { cursor:default;opacity:.58; }
.reward-track button b { font:16px Georgia,serif;color:#e4c08c; }
.reward-track button span { font-size:11px;color:#dfd8ce; }
.reward-track button em { font-size:10px;font-style:normal;color:#dbb780; }
.task-card .task-action { width:78px;height:78px;display:grid;place-items:center;justify-self:center;border:1px solid #bb9d70;border-radius:50%;background:transparent;color:#896743;font:20px "Noto Serif SC","Songti SC",serif;text-decoration:none;cursor:pointer; }
.task-card .task-action--claimed { border-color:#bbb6ae;color:#817e77;font-size:14px;cursor:default; }
.task-status { position:absolute;z-index:6;right:4%;bottom:13px;min-height:20px;margin:0;padding:4px 10px;background:rgba(16,17,19,.9);color:#f3eee5;font-size:12px;opacity:0;pointer-events:none;transition:opacity .15s; }
.task-status.visible { opacity:1; }
.task-stage button:hover:not(:disabled),.task-stage a:hover { filter:brightness(1.09); }
.task-stage button:focus-visible,.task-stage a:focus-visible,.task-card:focus-visible { outline:2px solid #dcae72;outline-offset:2px; }
.reward-track:focus-visible { outline:2px solid #dcae72;outline-offset:2px; }
.orientation-guard { display:none; }
@media (max-width:1000px),(max-height:560px) {
  .task-stage { min-height:0; }
  .back { top:max(4px,env(safe-area-inset-top));left:max(4px,env(safe-area-inset-left));width:44px;height:44px;font-size:28px; }
  .showcase { width:30%; }
  .orbit { width:190px;height:190px;left:-8px;top:36px; }
  .lead { width:205px;height:275px;left:-4px;bottom:84px;opacity:.75; }
  .showcase-copy { left:10px;right:6px;top:56px;bottom:auto; }
  .showcase-copy small { display:none; }
  .showcase-copy h1 { font-size:18px;letter-spacing:.08em;line-height:1.25; }
  .showcase-copy p { display:none; }
  .milestones { left:7px;right:7px;bottom:max(6px,env(safe-area-inset-bottom));padding:5px 6px;background:rgba(10,12,15,.89); }
  .milestones-head { font-size:11px;letter-spacing:0; }
  .milestones-head strong { font-size:13px; }
  .milestones-head small { font-size:10px; }
  .progress { margin:5px 0; }
  .reward-track { display:grid;grid-template-columns:minmax(0,1fr);gap:3px; }
  .reward-track button { width:100%;min-height:44px;grid-template-columns:30px minmax(0,1fr) 40px;align-items:center;gap:3px; }
  .reward-track button b { font-size:12px; }
  .reward-track button span,.reward-track button em { font-size:10px; }
  .task-content { left:30%;right:max(7px,env(safe-area-inset-right));top:max(7px,env(safe-area-inset-top));bottom:max(7px,env(safe-area-inset-bottom));gap:7px; }
  .tabs { height:44px; }
  .tabs button { font-size:13px;letter-spacing:0;padding:0 2px;cursor:pointer; }
  .task-list { gap:7px;padding-right:2px; }
  .task-card { height:89px;min-height:89px;grid-template-columns:40px minmax(0,1fr) 54px 48px;gap:5px;padding:5px 6px; }
  .task-count { font-size:25px; }
  .task-count span { font-size:11px; }
  .task-info small { font-size:9px; }
  .task-info h2 { margin:2px 0;font-size:12px;line-height:1.3; }
  .task-info p { display:none; }
  .task-reward { font-size:12px; }
  .task-reward small { font-size:9px; }
  .task-card .task-action { width:44px;height:44px;font-size:12px; }
  .task-card .task-action--claimed { font-size:10px; }
  .task-status { right:8px;bottom:4px;font-size:10px; }
}
@media (orientation:portrait) and (max-width:600px) { .orientation-guard { position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#111820;color:#f3eee5;font-size:18px; }.task-stage { visibility:hidden; } }
@media (prefers-reduced-motion:reduce) { .task-status { transition:none; } }

/* Chinese-only task text follows the shared typography and 44px action baseline. */
.back { width:44px;height:44px;font:28px/1 "Noto Serif SC","Songti SC",serif; }
.showcase-copy small { font:400 11px/1.5 "PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:.06em; }
.showcase-copy h1 { font-size:20px;font-weight:600;line-height:1.2;letter-spacing:.08em; }
.showcase-copy p { font:400 11px/1.5 "PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:.04em; }
.tabs button { font:600 13px/1 "Noto Serif SC","Source Han Serif SC","Songti SC",serif;letter-spacing:.05em;cursor:pointer; }
.task-info small { font:400 11px/1.5 "PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:.04em; }
.task-info h2 { font-size:14px;font-weight:600;line-height:1.4; }
.task-info p { font:400 11px/1.5 "PingFang SC","Microsoft YaHei",sans-serif; }
.task-reward { font:600 14px/1.2 "DM Mono","SFMono-Regular",Consolas,monospace; }
.task-reward small { font:400 11px/1.5 "PingFang SC","Microsoft YaHei",sans-serif; }
.task-card .task-action { width:68px;height:44px;border-radius:3px;font:600 14px/1 "Noto Serif SC","Source Han Serif SC","Songti SC",serif; }
.task-card .task-action--claimed { font-size:13px; }
@media (max-width:1000px),(max-height:560px) {
  .showcase-copy h1 { font-size:17px; }
  .tabs button { font-size:12px; }
  .task-info small { font-size:10px; }
  .task-info h2 { font-size:13px;line-height:1.4; }
  .task-reward { font-size:13px; }
  .task-reward small { display:none; }
  .task-card .task-action { width:44px;height:44px;font-size:13px; }
  .task-card .task-action--claimed { font-size:10px; }
}

/* 任务中心视觉校正：保留原双栏、信息顺序与任务数据。 */
:root { --task-gold:#ffd479;--task-mint:#5eead4;--task-line:rgba(255,255,255,.14);--task-text:#f2f2f2;--task-soft:rgba(255,255,255,.62); }
body { background:#0c0c10;color:var(--task-text); }
.scene { filter:blur(6px) saturate(.45) brightness(.67); }
.veil { background:linear-gradient(90deg,rgba(6,8,13,.42),rgba(8,9,14,.72) 48%,rgba(8,9,14,.94)); }
.back { border:0;border-radius:6px;background:transparent;font-size:28px;backdrop-filter:none; }
.showcase { background:linear-gradient(105deg,rgba(13,22,31,.35),rgba(12,13,19,.2));border-color:var(--task-line); }
.showcase::before { background:linear-gradient(180deg,rgba(8,10,15,.15),transparent 34%,rgba(7,9,14,.94) 92%); }
.orbit { border-color:rgba(255,212,121,.2);box-shadow:0 0 0 64px rgba(255,255,255,.012); }
.lead { filter:drop-shadow(0 20px 26px rgba(0,0,0,.5)); }
.showcase-copy { text-shadow:0 2px 14px #05070c; }
.showcase-copy small { color:var(--task-gold); }
.showcase-copy h1 { color:var(--task-text); }
.showcase-copy p { color:var(--task-soft); }
.milestones { background:rgba(9,10,15,.85);border:0;border-top:1px solid rgba(255,212,121,.55);box-shadow:inset 1px 0 var(--task-line),inset -1px 0 var(--task-line),inset 0 -1px var(--task-line);backdrop-filter:blur(12px); }
.milestones-head { color:var(--task-text); }
.milestones-head strong,.reward-track button b { color:var(--task-gold);font-family:"DM Mono","SFMono-Regular",Consolas,monospace; }
.milestones-head small { color:var(--task-soft); }
.progress { background:rgba(255,255,255,.16); }
.progress span { background:var(--task-gold); }
.reward-track button { border-color:var(--task-line);border-radius:6px;background:rgba(255,255,255,.035); }
.reward-track button:not(:disabled) { background:var(--task-gold);border-color:var(--task-gold);color:#16151a; }
.reward-track button:not(:disabled) b,.reward-track button:not(:disabled) span,.reward-track button:not(:disabled) em { color:#16151a; }
.reward-track button:disabled { opacity:1; }
.reward-track button span { color:var(--task-soft); }
.reward-track button em { color:var(--task-soft); }
.reward-track .milestone--claimed em { color:var(--task-mint); }
.reward-track .milestone--locked em { color:var(--task-soft); }
.tabs { background:rgba(9,10,15,.78);border:1px solid var(--task-line);border-bottom:0;backdrop-filter:blur(12px); }
.tabs button { border-right-color:var(--task-line);color:var(--task-soft); }
.tabs button:last-child { border-right:0; }
.tabs button.selected { background:rgba(255,212,121,.1);color:var(--task-gold);box-shadow:inset 0 -2px var(--task-gold); }
.task-list { scrollbar-color:rgba(255,212,121,.4) transparent; }
.task-card { background:rgba(16,17,23,.88);border:1px solid var(--task-line);color:var(--task-text);box-shadow:0 12px 28px rgba(0,0,0,.18);backdrop-filter:blur(10px); }
.task-card--claimable { border-color:rgba(255,212,121,.48);background:rgba(23,21,22,.94); }
.task-card--claimed { border-color:rgba(94,234,212,.27); }
.task-count { border-right-color:var(--task-line);color:var(--task-text);font-family:"DM Mono","SFMono-Regular",Consolas,monospace; }
.task-count span { color:var(--task-soft); }
.task-card--claimable .task-count,.task-card--claimable .task-reward { color:var(--task-gold); }
.task-card--claimed .task-count { color:var(--task-mint); }
.task-info small { color:var(--task-gold); }
.task-info p { color:var(--task-soft); }
.task-reward { color:var(--task-gold); }
.task-reward small { color:var(--task-soft); }
.task-card .task-action { border-radius:6px; }
.task-card .task-action--go { border-color:rgba(255,212,121,.5);background:transparent;color:var(--task-gold); }
.task-card .task-action--claim { border-color:var(--task-gold);background:var(--task-gold);color:#16151a; }
.task-card .task-action--claimed { border:0;background:none;color:var(--task-mint);white-space:nowrap; }
.task-status { border:1px solid var(--task-line);border-radius:6px;background:rgba(9,10,15,.94); }
.task-stage button:focus-visible,.task-stage a:focus-visible,.task-card:focus-visible { outline-color:var(--task-gold); }
@media (max-width:1000px),(max-height:560px) {
  .task-info p { display:block;font-size:10px;line-height:1.35; }
  .task-card { min-height:89px; }
  .task-card .task-action--claimed { font-size:10px; }
}

/* 局部对齐：左上页面身份、人物中心线与右侧连续任务列。 */
.back { border:0;background:transparent;backdrop-filter:none; }
.back-glyph { display:block;transform:translateY(-3px);font:28px/1 "Noto Serif SC","Source Han Serif SC","Songti SC",serif; }
.page-title { position:absolute;z-index:5;top:38px;left:93px;color:var(--task-text);font:600 20px/1 "Noto Serif SC","Source Han Serif SC","Songti SC",serif;letter-spacing:.1em;white-space:nowrap;text-shadow:0 2px 10px #05070c; }
.lead { left:50%;transform:translateX(-50%); }
.showcase-copy { left:10%; }
.task-content { top:0;gap:0; }
.task-list { gap:0;padding-right:0;scrollbar-width:none; }
.task-list::-webkit-scrollbar { display:none; }
.task-card + .task-card { border-top-color:transparent; }
@media (max-width:1000px),(max-height:560px) {
  .page-title { top:18px;left:max(56px,calc(env(safe-area-inset-left) + 52px));font-size:17px; }
  .showcase-copy { left:7px;top:auto;bottom:185px; }
  .task-list { gap:0;padding-right:0; }
  .lead { left:50%;bottom:48px; }
}

/* 任务列表精修：取消相邻行投下的暗带，收紧面板两侧并提高可读性。 */
.task-content { left:calc(44% + 24px);right:calc(4% + 24px);bottom:0; }
.task-card { box-shadow:none;backdrop-filter:none; }
.tabs button { font-size:15px; }
.task-count { font-size:52px; }
.task-count span { font-size:21px; }
.task-info small { font-size:12px; }
.task-info h2 { font-size:16px; }
.task-info p { font-size:12px; }
.task-reward { font-size:16px; }
.task-reward small { font-size:12px; }
.task-card .task-action { width:80px;height:48px;font-size:16px; }
.task-card .task-action--claimed { font-size:14px; }
@media (max-width:1000px),(max-height:560px) {
  .task-content { left:calc(30% + 8px);right:max(15px,calc(env(safe-area-inset-right) + 8px));bottom:max(7px,env(safe-area-inset-bottom)); }
  .tabs button { font-size:13px; }
  .task-card { grid-template-columns:40px minmax(0,1fr) 54px 52px; }
  .task-count { font-size:27px; }
  .task-count span { font-size:12px; }
  .task-info small { font-size:11px; }
  .task-info h2 { font-size:14px; }
  .task-info p { font-size:11px; }
  .task-reward { font-size:14px; }
  .task-reward small { display:none; }
  .task-card .task-action { width:48px;height:44px;font-size:14px; }
  .task-card .task-action--claimed { font-size:11px; }
}

/* 统一黑色底；移除任务序号后收紧纵向节奏。 */
body,.task-stage { background:#0c0c10; }
.scene { display:none; }
.veil { background:transparent; }
.showcase { background:#0c0c10;border-right:0; }
.showcase::before { background:none; }
.lead { bottom:118px; }
.task-card { height:auto;min-height:100px;padding:12px 18px; }
.task-info h2 { margin:0 0 8px; }
@media (max-width:1000px),(max-height:560px) {
  .lead { bottom:36px; }
  .task-card { height:auto;min-height:80px;padding:5px 6px; }
  .task-info h2 { margin:0 0 4px; }
}

/* 手机横屏安全区：保留三栏职责，不让左侧信息落入刘海或贴住里程碑。 */
@media (max-width:1000px),(max-height:560px) {
  .page-title { top:calc(max(4px,env(safe-area-inset-top)) + 14px); }
  .showcase-copy { left:max(7px,calc(env(safe-area-inset-left) + 8px));bottom:calc(193px + env(safe-area-inset-bottom)); }
  .milestones { left:max(7px,calc(env(safe-area-inset-left) + 8px)); }
  .task-content { top:env(safe-area-inset-top); }
  .lead { bottom:max(0px,calc(36px - env(safe-area-inset-top))); }
}
