:root{color-scheme:dark;--text:#e9ddbd;--muted:#a79b85;--gold:#d4b16a;--green:#a2d36c;--line:#564a35;--cyan:#99cdc5}
*{box-sizing:border-box}
body{margin:0;color:var(--text);font:13px/1.65 "Microsoft YaHei","PingFang SC",sans-serif;background:#151310;background-image:radial-gradient(ellipse at 10% 75%,#71371435,transparent 40%),radial-gradient(ellipse at 85% 12%,#7b552d25,transparent 48%),linear-gradient(110deg,#141310,#232019 50%,#151311);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;z-index:-1;opacity:.09;background-image:url('/altar-stone-v2.png');background-size:cover;filter:blur(9px);pointer-events:none}
button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:var(--text);border:1px solid #766044;background:linear-gradient(#302b23,#171512 50%,#242018);box-shadow:inset 0 0 0 2px #0c0b09,inset 0 0 0 3px #64563b55,0 2px 5px #0008;border-radius:1px;padding:8px 16px;text-shadow:0 1px 2px #000;transition:filter .15s,border-color .15s}button:hover{filter:brightness(1.2);border-color:var(--gold)}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible,.tree-scroll:focus-visible{outline:2px solid #efdaa3;outline-offset:4px}a{color:var(--gold);text-decoration:none}a:hover{text-decoration:underline}.primary{background:linear-gradient(#563527,#291b15 55%,#38251a);border-color:#a0804c;color:#edd7a1}button.primary:hover{background:linear-gradient(#65402c,#392418)}.page{max-width:1640px;margin:auto;padding:0 26px}.topbar{height:51px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #a47a4033;gap:12px}.brand{font:700 18px Georgia,serif;letter-spacing:2px;color:#dbc79e}.brand span{color:#be9559}.brand small{font:11px "Microsoft YaHei",sans-serif;color:#978d7c;letter-spacing:0;margin-left:12px}.back-link{font-size:12px;color:#bbae93}.hero{text-align:center;padding:22px 0 21px}.eyebrow{font:10px Georgia,serif;letter-spacing:6px;color:#b39260;margin:0 0 7px}h1{font:500 29px/1.4 "Noto Serif SC","SimSun",serif;letter-spacing:7px;color:#e3c995;text-shadow:0 2px 5px #000;margin:0}.intro{font-size:11px;letter-spacing:3px;color:#a4987d;margin:7px 0 0}.layout{display:grid;grid-template-columns:minmax(210px,290px) minmax(590px,1fr) minmax(210px,275px);gap:20px;align-items:start}.panel{border:1px solid #6c5838;background:linear-gradient(105deg,#24211bfd,#181713f5);box-shadow:inset 0 0 0 3px #0b0a08,0 8px 22px #0004;border-radius:1px}.materials-column,.sidebar{display:grid;gap:20px;min-width:0}h2{font-size:14px;font-weight:600;letter-spacing:1px;margin:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.muted{color:var(--muted)}
/* 祭坛主体：底图只负责质感，节点与连线保持可交互的网页元素。 */
.tree-panel{position:relative;padding:0 20px 21px;background:#211e18 url('/altar-stone-v2.png') center/100% 100% no-repeat;border:2px solid #786449;box-shadow:0 0 0 3px #0b0a08,0 0 0 5px #484031,0 15px 55px #000a;isolation:isolate;min-width:0}.tree-panel:before{content:"";position:absolute;inset:108px 16px 30px;background:linear-gradient(#06060620,#07080610);pointer-events:none;z-index:-1}.altar-cap{height:78px;display:flex;align-items:center;justify-content:space-between;position:relative;padding:0 2px;gap:12px}.action-buttons{display:flex;align-items:center;gap:8px}.altar-cap button{font-size:12px;padding:6px 13px;min-width:58px}.altar-cap>.primary{min-width:90px}.altar-emblem{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:39px/1 Georgia,serif;color:#efcf7d;text-shadow:0 0 10px #ee9818;pointer-events:none}.altar-title{font:14px/30px "SimSun",serif;text-align:center;letter-spacing:5px;color:#d2b176;border-top:1px solid #83643b55;border-bottom:1px solid #83643b55;text-shadow:0 2px 2px #000;background:linear-gradient(90deg,transparent,#090806bb,transparent)}.altar-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:15px 6px 3px}.progress{display:flex;align-items:baseline;gap:5px;font-size:10px;white-space:nowrap}.progress strong{color:#e3c889;font:19px Georgia,serif}.progress span{color:#b4a990}.progress i{display:block;height:13px;width:1px;background:#645236;margin:0 6px}.legend{display:flex;gap:14px;color:#b4a990;font-size:10px}.legend span:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px;background:#caaa58}.legend .chosen-dot:before{background:#9ccd5a}.tree-help{margin:5px 0 9px;text-align:center;font-size:10px;color:#b5a68b;letter-spacing:.3px}.mobile-hint{display:none}.tree-scroll{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#7e6640 #19160f;padding:5px 0 0}.tree{position:relative;min-width:540px;aspect-ratio:800/684;margin:0 auto 20px}.tree svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.edge{stroke:#686451;stroke-width:3;fill:none;vector-effect:non-scaling-stroke;filter:drop-shadow(0 2px 1px #000)}.edge.active{stroke:#70a638;stroke-width:4;filter:drop-shadow(0 0 3px #375c28)}
.node{--rune-size:42px;position:absolute;transform:translate(-50%,-50%);display:block;width:var(--rune-size);height:var(--rune-size);padding:0;border:2px solid #7b725f;border-radius:50%;color:#9e967e;background:radial-gradient(circle at 37% 25%,#6c6e65,#333a38 45%,#1b2221 72%);box-shadow:0 0 0 2px #15140e,0 0 0 3px #665a42,inset 0 0 0 2px #222521,inset 0 0 0 4px #ada28055,0 3px 7px #000;overflow:visible;isolation:isolate}.node:before{content:"";position:absolute;inset:5px;border:1px dotted currentColor;border-radius:50%;opacity:.55}.rune{display:grid;place-items:center;height:100%;font:26px/1 "Segoe UI Symbol","Times New Roman",serif;filter:drop-shadow(0 1px 2px #000);opacity:.85}.node .code{position:absolute;left:-6px;top:-5px;font:10px/1.3 Georgia,serif;color:#ddd0ac;background:#17130ec9;min-width:16px;border-radius:2px;z-index:2;padding:1px 2px}.node .node-name{position:absolute;left:50%;top:calc(100% + 6px);transform:translateX(-50%);width:112px;max-width:none;white-space:nowrap;font-size:10px;line-height:1.4;font-weight:500;color:#a6b5ab;text-shadow:-1px -1px #060604,1px 1px #060604,0 1px 4px #000;pointer-events:none}.node.available{border-color:#e2c46b;color:#efd780;background:radial-gradient(circle at 40% 30%,#877540,#544b28 60%,#282818);box-shadow:0 0 0 2px #211b0c,0 0 0 3px #bc9858,inset 0 0 0 2px #8b783e,inset 0 0 0 4px #c9b57570,0 0 13px #dfbd4935}.node.available .node-name{color:#e2c579}.node.chosen{border-color:#90bf57;background:radial-gradient(circle at 40% 30%,#667c36,#344b22 58%,#182a17);color:#cddc8d;box-shadow:0 0 0 2px #23341a,0 0 0 3px #537936,inset 0 0 0 2px #b6c17840,0 0 12px #75aa4435}.node.chosen .node-name{color:#b5df93}.node.chosen .rune{opacity:.22}.node .step{position:absolute;inset:0;display:grid;place-items:center;color:#ffe68c;font:700 24px/1 Georgia,serif;text-shadow:0 2px 3px #000;z-index:1}.node .step:empty{display:none}.node.potion{border-radius:8px 8px 15px 15px;border-color:#796987;background:radial-gradient(circle at 40% 30%,#5c4968,#272431 70%);color:#b496c6;box-shadow:0 0 0 2px #15111b,0 0 0 3px #63566b,inset 0 0 5px #000,0 3px 8px #000}.node.potion .node-name{color:#c8a3d4}.node.potion.available{border-color:#dab08a;box-shadow:0 0 0 2px #231a12,0 0 0 3px #a58650,0 0 13px #cd9b5530}.node.potion.chosen{border-color:#9ec76d;box-shadow:0 0 0 2px #162213,0 0 0 3px #628442,0 0 12px #80b54440}.node.current{outline:1px solid #ebdba588;outline-offset:6px;z-index:2}.node:hover{filter:brightness(1.25);z-index:3}.reward{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 9px;width:calc(100% - 26px);margin:24px auto 0;background:linear-gradient(90deg,#1c160da0,#2c2318d9,#1c160da0);border-color:#816c48}.reward strong{display:block;color:#d9bd7e;font:500 14px "SimSun",serif;letter-spacing:1px}.reward small{display:block;color:#b4a790;font-size:10px;margin-top:5px}.reward-symbol{font:27px Georgia,serif;color:#b79654}.reward>span:last-child{font-size:17px;color:#c5ab6c}.reward.available{border-color:#cbb573}.reward.chosen{border-color:#90ac52;background:#263320af}.save-status{font-size:10px;text-align:center;color:#9d9078;margin:12px 0 0}
/* 两侧清单采用同一套铜边深色面板，当前祭品用羊皮纸强调。 */
.next{padding:20px 20px 17px;text-align:center}.parchment{color:#392a19;background:radial-gradient(ellipse at 50% 45%,#e3d2ac,#c9af7e 75%,#846542);box-shadow:inset 0 0 0 3px #322519,inset 0 0 25px #63462366,0 6px 18px #0006;border-color:#a58a5c}.parchment h2{font:600 17px "SimSun",serif;letter-spacing:3px}.parchment .overline{color:#5b4830;font-size:10px}.parchment .next-item p{margin:5px 0 0;font-size:12px;font-weight:600;line-height:1.9}.parchment .potion-cost{margin-top:14px;padding-top:10px;border-top:1px solid #866c4866}.parchment .potion-cost p{color:#643327}.parchment #offering-number{font:46px/1.2 Georgia,serif;display:block;color:#3d2916;margin:7px 0 3px;text-shadow:0 1px 1px #fff8}.materials{padding:0 0 12px}.materials summary{padding:13px 14px;cursor:pointer;background:linear-gradient(#462a22,#2e2019);border-bottom:1px solid #705037;font-size:12px;color:#e3c291;letter-spacing:1px}.materials summary span{display:block;font-size:10px;color:#b19b7d;margin:4px 0 0 15px;letter-spacing:0;font-weight:400}#material-list{counter-reset:offering;list-style:none;margin:0;padding:0;font-size:11px;line-height:1.65}#material-list li{counter-increment:offering;display:grid;grid-template-columns:21px 1fr;gap:7px;padding:8px 12px;border-bottom:1px solid #53463066;color:#c5b99e;min-height:34px}#material-list li:before{content:counter(offering);font:12px/1.65 Georgia,serif;color:#b09a75;border-right:1px solid #544630;text-align:left}#material-list li.done{background:#2b3a1caa;color:#b6d78e}#material-list li.done:before{color:#acc577}#material-list li.next-material{background:#584027;color:#ffe0a4;border-left:2px solid #d6aa65;padding-left:10px}#material-list li.next-material:before{color:#efd5a1}.material-note{color:#bbaa8e;font-size:10px;padding:12px 13px 0;line-height:1.8}.route{padding:0}.route>.panel-heading{padding:13px 14px;border-bottom:1px solid #6c5439;background:linear-gradient(#412b24,#281e19)}.route h2{font-size:13px;color:#dcc194}.route .muted{font-size:10px;white-space:nowrap}.empty{padding:17px 16px 23px;font-size:12px;line-height:1.9;color:#a79e86;margin:0}#route-list{margin:0;padding:0;list-style:none;max-height:330px;overflow:auto;scrollbar-width:thin;scrollbar-color:#736044 #191812}#route-list:empty{display:none}.route-step{display:flex;gap:9px;align-items:flex-start;width:100%;text-align:left;background:#26331a80;border:0;border-bottom:1px solid #59673b55;box-shadow:none;padding:10px 12px;font-size:11px;line-height:1.8;border-radius:0;color:#c1db9b}.route-step:hover{background:#354522a0}.route-step b{font:12px/1.8 Georgia,serif;min-width:16px;color:#dbe8ab}.route-step span{flex:1}.route-step em{font:10px/1.8 Georgia,serif;color:#8d9a76;margin-left:auto;padding-left:4px}.detail{padding:20px 17px}.detail-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:7px}.letter{display:inline-grid;place-items:center;min-width:33px;height:33px;border:1px solid #ac8b4d;outline:1px solid #59482a;outline-offset:3px;color:#e5c987;border-radius:50%;font:17px Georgia,serif;background:radial-gradient(#564727,#211c11)}.state{font-size:10px;color:#c5b28b}.detail h2{font:600 20px "SimSun",serif;color:#e1c797;letter-spacing:1px}.effect{font-size:12px;line-height:1.95;color:#c8d5bf;margin:13px 0 17px}.requirement{border-top:1px solid #65543b;border-bottom:1px solid #65543b;background:#0d0b0880;padding:12px}.overline{font-size:10px;color:#ab9675}.requirement p{color:#e5c486;font-size:12px;line-height:1.85;margin:6px 0 0}#detail-condition{font-size:10px;line-height:1.85;margin:14px 0}.full-width{width:100%;font-size:11px;padding:9px}.sidebar{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow-y:auto;grid-auto-rows:max-content;scrollbar-width:thin;scrollbar-color:#6e5a3d #171511}footer{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:10px;color:#8c806c;line-height:1.8;padding:26px 0}footer a{color:#9f8e70;text-decoration:underline}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#292215;color:#eddaa9;border:1px solid #947244;padding:11px 21px;box-shadow:0 4px 20px #0009;max-width:90vw;font-size:12px;z-index:10}dialog{width:calc(100% - 36px);max-width:510px;padding:27px;background:#242017;color:var(--text);border:1px solid #947651;box-shadow:0 0 0 4px #100d09,0 15px 40px #000a}dialog::backdrop{background:#000a}dialog h2{font-size:20px}dialog p{font-size:12px}dialog label{font-size:12px}dialog input{display:block;width:100%;padding:11px;color:var(--text);background:#15120d;border:1px solid #75613f;margin:8px 0 20px}.dialog-close{float:right;font-size:22px;line-height:1;padding:0 4px;background:none;box-shadow:none;border:0}.no-script{text-align:center;padding:24px;color:#d4b16a}[hidden]{display:none!important}
@media(min-width:1600px){.tree{max-width:760px}.node{--rune-size:46px}.node .node-name{font-size:11px}.tree-help{font-size:11px}.tree-panel{padding-left:32px;padding-right:32px}}
@media(max-width:1300px){.page{padding:0 18px}.layout{grid-template-columns:210px minmax(570px,1fr) 220px;gap:15px}.tree-panel{padding-left:15px;padding-right:15px}.node{--rune-size:38px}.node .rune{font-size:24px}.node .step{font-size:22px}.node .node-name{font-size:9px;width:98px}.node .code{font-size:9px}.hero{padding:18px 0}.legend{gap:7px}.tree-help{font-size:9px}#material-list li{font-size:10px;padding-top:7px;padding-bottom:7px}.sidebar,.materials-column{gap:15px}}
@media(max-width:1100px){.layout{grid-template-columns:minmax(560px,1fr) 240px}.tree-panel{grid-column:1;grid-row:1}.sidebar{grid-column:2;grid-row:1}.materials-column{grid-column:1/-1;grid-row:2;grid-template-columns:240px 1fr;align-items:start}.materials-column .materials{min-width:0}#material-list{display:grid;grid-template-columns:1fr 1fr}.node{--rune-size:42px}.node .node-name{font-size:10px}.next{position:sticky;top:16px}}
@media(max-width:880px){.page{padding:0 15px}.layout{grid-template-columns:1fr;gap:22px}.tree-panel{grid-column:1;grid-row:1;max-width:780px;width:100%;margin:auto}.sidebar{position:static;grid-column:1;grid-row:2;grid-template-columns:1fr 1fr;max-height:none;overflow:visible;align-items:start}.materials-column{grid-column:1;grid-row:3}.node{--rune-size:42px}.tree{max-width:730px}.tree-help{font-size:10px}.hero{padding:18px 0 21px}h1{font-size:26px}.altar-cap{height:74px}.materials-column .next{position:static}}
@media(max-width:580px){.page{padding:0 10px}.topbar{height:46px}.brand{font-size:16px}.brand small{display:none}.back-link{font-size:11px}.hero{padding:18px 0}h1{font-size:24px;letter-spacing:4px}.intro{font-size:10px}.eyebrow{font-size:9px;letter-spacing:4px}.tree-panel{padding-left:10px;padding-right:10px;background-size:auto 100%;background-position:center}.altar-cap{height:66px;padding:0 1px}.altar-cap button{min-width:46px;font-size:10px;padding:6px 9px}.altar-cap>.primary{min-width:66px}.action-buttons{gap:6px}.altar-emblem{font-size:28px}.altar-title{font-size:12px}.altar-meta{margin-top:12px;gap:4px}.legend{font-size:9px;gap:6px}.progress{gap:4px;font-size:9px}.progress strong{font-size:16px}.progress i{margin:0 3px}.tree-help{font-size:9px;line-height:1.8}.mobile-hint{display:block;font-size:9px;text-align:center;color:#d0ac6b;margin:4px 0 7px}.tree{width:540px;margin-bottom:20px}.node{--rune-size:38px}.node .node-name{font-size:9px;width:94px}.tree-scroll{margin-left:2px;margin-right:2px}.reward{width:100%;padding:10px 5px;gap:7px;margin-top:18px}.reward strong{font-size:12px;letter-spacing:0}.reward small{font-size:9px}.reward-symbol{font-size:23px}.sidebar,.materials-column{grid-template-columns:1fr}.detail{order:-1}.next{max-width:none}.materials-column{gap:18px}#material-list{display:block}#material-list li{font-size:11px}.materials summary span{display:inline;margin-left:10px}.save-status{font-size:9px}footer{font-size:9px;gap:8px}}
/* 短行距屏幕上，让相邻层的符文与说明保持间隔。 */
.node .node-name{top:calc(100% + 3px);line-height:1.2}
@media(min-width:881px) and (max-width:1100px){.node{--rune-size:38px}.node .node-name{font-size:9px}}
@media(max-width:580px){.node .node-name{top:calc(100% + 2px)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
