@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0b1021;--panel:#121932;--line:#2a3652;--text:#edf1fc;--muted:#a3b0c8;--gold:#e8c782;--mint:#80dfd0}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 'DM Sans',system-ui,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:'Space Grotesk',system-ui,sans-serif;line-height:1.15}.skip{position:absolute;left:12px;top:-60px;background:#fff;color:#000;padding:10px;z-index:200}.skip:focus{top:12px}
.layout{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.sidebar{background:#10162b;border-right:1px solid #25304a;padding:30px 19px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.logo{display:flex;align-items:center;gap:12px;margin:1px 4px 42px}.mark{display:grid;place-items:center;background:linear-gradient(145deg,#e6cf96,#b58749);border-radius:12px;color:#162135;font-size:29px;width:47px;height:47px}.logo strong{font:800 21px 'Space Grotesk',sans-serif;letter-spacing:1.8px}.logo em{font-style:normal;color:var(--gold)}.logo small,.mini-profile small{display:block;font-size:10px;letter-spacing:.05em;color:#8f9bb7}.sidebar-label{font-size:10px;letter-spacing:.16em;color:#7c8aaa;font-weight:800;margin:0 14px 13px}.mini-profile{padding:13px;background:#19213a;border:1px solid #303b55;border-radius:14px;display:flex;align-items:center;gap:12px;margin-bottom:36px}.mini-profile b{font-size:14px}.mini-avatar{border-radius:50%;height:40px;width:40px;display:grid;place-items:center;border:1px solid #927952;background:radial-gradient(circle,#514327,#232743);color:#f0dba8;font:700 22px 'Space Grotesk'}.branch-item{display:flex;align-items:center;gap:11px;width:100%;color:#acbad3;border:1px solid transparent;border-radius:11px;background:transparent;padding:11px 12px;margin:2px 0;text-align:left;font-weight:600;font-size:13px}.branch-item .branch-icon{width:24px;text-align:center;font-size:17px}.branch-item:hover,.branch-item.active{background:#202b49;color:#f6e1ae;border-color:#394765}.sidebar-footer{margin-top:auto;border-top:1px solid #27334d;padding:19px 4px 0;color:#a4b2c6;font-size:11px}.online{color:#77dfba;margin-right:5px}.content{min-width:0}.topbar{height:73px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #29324b;padding:0 clamp(20px,3vw,51px);font-size:12px;color:#a6b0c7}.topbar strong{color:#e6eaf8}.topbar i{font-style:normal;padding:0 12px;color:#596989}.topbar a{letter-spacing:.12em;font-weight:800;font-size:10px;color:#e5c17c}
.hero{position:relative;min-height:435px;padding:76px clamp(25px,5.6vw,90px);overflow:hidden;border-bottom:1px solid #28334d;background:radial-gradient(ellipse at 75% 42%,#2a2e59 0%,transparent 48%),linear-gradient(122deg,#151d38 10%,#0d1429 83%)}.hero:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:50px 50px;mask-image:linear-gradient(90deg,transparent,#000)}.hero-copy{position:relative;z-index:1;max-width:640px}.eyebrow{color:#e5c27d;font-size:10px;font-weight:800;letter-spacing:.2em}.hero h1{font-size:clamp(39px,4.4vw,64px);letter-spacing:-.045em;margin:21px 0}.hero h1 span{color:#eacf95}.hero p{font-size:15px;line-height:1.9;color:#afbcd2;max-width:520px}.hero-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:27px}.btn-main,.btn-light{display:inline-flex;gap:23px;justify-content:space-between;align-items:center;padding:12px 19px;border-radius:9px;font-weight:800;font-size:12px}.btn-main{background:#e0be79;color:#17213b}.btn-main:hover{background:#f0dca7}.btn-light{border:1px solid #50607a;color:#d8e0f3}.rune{position:absolute;right:7%;top:50%;transform:translateY(-50%);width:270px;height:270px;opacity:.9}.rune-circle{position:absolute;inset:9px;border:1px solid #c5a66878;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 22px #d5b97b0b,0 0 0 43px #d5b97b08}.rune-circle:before{content:'';position:absolute;inset:20px;border:1px dashed #d5b57f77;border-radius:50%;animation:spin 65s linear infinite}.rune-center{font:700 105px 'Space Grotesk';display:grid;place-items:center;width:155px;height:155px;clip-path:polygon(50% 0,91% 24%,91% 77%,50% 100%,9% 77%,9% 24%);background:linear-gradient(140deg,#62523e,#1c2b48);color:#f3d8a3;text-shadow:0 0 30px #ddb978aa}.star{position:absolute;color:#ddbd7b}.s1{top:0;left:44%}.s2{bottom:35px;right:0}.s3{left:-10px;top:60%}@keyframes spin{to{transform:rotate(360deg)}}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#111831;border-bottom:1px solid #293553;padding:23px clamp(20px,3vw,50px)}.stats>div{display:flex;flex-direction:column;padding:8px 20px;border-right:1px solid #2c3854}.stats>div:last-child{border:0}.stats small{font-size:9px;letter-spacing:.15em;font-weight:800;color:#8294b5}.stats strong{font:700 37px 'Space Grotesk';margin:8px 0;color:#f3e1b9}.stats .stat-phrase{font-size:15px;padding-top:12px;margin-bottom:13px}.stats span{font-size:11px;color:#9badc8}
.tree-section,.method{padding:66px clamp(22px,4vw,65px)}.section-head{display:flex;gap:15px;justify-content:space-between;align-items:end;margin-bottom:28px}.section-head h2,.method h2{font-size:30px;margin:9px 0 10px}.section-head p{max-width:640px;color:#a4b2ca;line-height:1.8;margin:0}.phase{font-size:11px;color:#d3c09c;border:1px solid #5e503f;background:#292840;border-radius:30px;padding:7px 13px;white-space:nowrap}.branch-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:28px}.branch-card{background:#161f37;border:1px solid #2e3a56;border-radius:13px;text-align:left;padding:18px 15px 14px;min-height:133px;display:flex;flex-direction:column;color:#e9edf9;transition:transform .18s,border-color .18s}.branch-card:hover{transform:translateY(-3px);border-color:#8d7a55}.branch-card.active{border-color:#d7b778;background:linear-gradient(145deg,#292941,#1b253f)}.branch-card .card-icon{font-size:22px;margin-bottom:12px}.branch-card b{font-size:13px;line-height:1.3}.branch-card small{font-size:10px;color:#9aaac3;margin-top:6px}
.tree-board{background:#121b34;border:1px solid #34415e;border-radius:17px;overflow:hidden}.tree-board-header{display:flex;justify-content:space-between;align-items:center;padding:25px 28px 22px;border-bottom:1px solid #303d58;gap:20px}.tree-board-header small{font-size:10px;letter-spacing:.18em;color:#a4b2cf;font-weight:800}.tree-board-header h3{margin:8px 0;font-size:24px}.tree-board-header p{margin:0;color:#9eafc8;font-size:12px;max-width:600px}.tree-board-header>span{font-size:11px;color:#e4c886;white-space:nowrap}.graph{position:relative;padding:35px 20px;min-height:290px;overflow:auto;background:radial-gradient(ellipse at center,#1d2949,#121b34 75%)}#edges{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.graph #skill-columns{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:22px;position:relative;z-index:1;min-width:650px}.tier{display:flex;flex-direction:column;gap:16px}.tier-heading{font-size:10px;letter-spacing:.15em;font-weight:800;color:#829ab4;margin-bottom:3px}.skill-node{width:100%;min-height:76px;display:flex;align-items:center;gap:13px;background:#172542;border:1px solid #465776;border-radius:12px;padding:14px 15px;text-align:left;color:#e8eefd;box-shadow:0 8px 20px #00000020}.skill-node:hover{border-color:#e9c689;background:#253556}.skill-node:focus-visible{outline-offset:0}.node-gem{display:grid;place-items:center;border:1px solid #897957;width:35px;height:35px;flex-shrink:0;transform:rotate(45deg);border-radius:6px;color:#efd5a1}.node-gem span{transform:rotate(-45deg);font-size:18px}.skill-node b{display:block;font-size:12px;line-height:1.35}.skill-node small{display:block;color:#9eb0c6;font-size:10px;margin-top:3px}.graph-foot{padding:14px 26px;border-top:1px solid #303d58;color:#93a6c3;font-size:11px}.legend-dot{color:#d2b879;font-size:20px;vertical-align:middle;margin-right:6px}
.method{padding-top:25px}.method h2{margin-bottom:30px}.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.steps article{border:1px solid #2b3953;background:#141d34;border-radius:13px;padding:20px}.steps article>span{font-size:27px;color:#e0c285;display:block;margin-bottom:14px}.steps b{font-size:13px}.steps p{font-size:12px;color:#a4b3c8;line-height:1.8;margin:9px 0 0}footer{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #25324c;padding:24px clamp(22px,4vw,65px);color:#788dab;font-size:10px;letter-spacing:.1em}
dialog{background:#18223d;color:#ebf1ff;border:1px solid #75829b;border-radius:18px;width:min(540px,calc(100vw - 28px));padding:27px;box-shadow:0 24px 80px #000b}dialog::backdrop{background:#060a19c9}.dialog-top{display:flex;justify-content:space-between;align-items:center}.dialog-top button{font-size:31px;background:none;border:0;color:#f2dfb5}dialog h2{margin:15px 0}dialog p{color:#bdc8dc;font-size:13px}dialog>small{color:#9eafcb;letter-spacing:.14em;font-size:10px;font-weight:800}dialog .state{margin:10px 0 22px;color:#e6c882;font-weight:800}.detail-notice{border-left:3px solid #e0c17e;background:#262f49;color:#d4daea;padding:13px 15px;font-size:12px;margin:22px 0}#detail-doc{color:#efd39d;font-weight:800;font-size:13px}
@media(max-width:1100px){.rune{opacity:.25;right:1%}.branch-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.stats{grid-template-columns:repeat(2,1fr)}.stats>div:nth-child(2){border:0}.stats>div{border-bottom:1px solid #2b3954}.stats>div:nth-child(n+3){border-bottom:0}}
@media(max-width:760px){.layout{display:block}.sidebar{position:static;height:auto;padding:15px 17px;display:block;border-right:0;border-bottom:1px solid #34415b}.logo{margin:0 0 12px}.sidebar-label,.mini-profile,.sidebar-footer{display:none}#branch-nav{display:flex;overflow-x:auto;gap:6px;padding:5px 0 2px}.branch-item{width:auto;min-width:max-content;margin:0;padding:8px 10px}.branch-item .branch-icon{width:auto}.topbar{height:50px;padding:0 17px}.topbar a{font-size:9px}.hero{padding:48px 24px;min-height:0}.hero h1{font-size:42px}.hero p{font-size:14px}.rune{width:180px;height:180px;right:-50px;top:36%;opacity:.15}.rune-center{width:110px;height:110px;font-size:70px}.stats{padding:15px}.stats>div{padding:12px 8px}.stats strong{font-size:30px}.tree-section,.method{padding:44px 18px}.section-head{display:block}.phase{display:inline-block;margin-top:14px}.branch-cards{gap:8px}.branch-card{min-height:116px;padding:12px}.branch-card b{font-size:12px}.tree-board-header{padding:18px}.graph{padding:21px 16px}.method{padding-top:12px}.steps{grid-template-columns:repeat(2,minmax(0,1fr))}.steps article{padding:15px}footer{display:block;padding:24px 18px}footer span{display:block;margin-top:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.rune-circle:before{animation:none}.branch-card{transition:none}}