*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--text);background:radial-gradient(1200px 800px at 10% 20%,#78ffd61a,transparent 60%),radial-gradient(900px 700px at 90% 10%,#b388ff1a,transparent 60%),linear-gradient(180deg,var(--bg-1),var(--bg-2));margin:0}.page{max-width:1100px;margin:0 auto 120px;padding:24px clamp(16px,3vw,32px)}.hero{text-align:center;border:1px solid var(--line);background:linear-gradient(#ffffff0f,#ffffff08);border-radius:20px;margin-top:12vh;padding-top:32px;padding-bottom:32px;position:relative;overflow:hidden}.hero .mist{filter:blur(40px)saturate(140%);pointer-events:none;background:radial-gradient(closest-side at 25% 40%,#78ffd640,#0000 60%),radial-gradient(closest-side at 80% 30%,#b388ff38,#0000 60%),radial-gradient(closest-side at 55% 60%,#ff7fd12e,#0000 60%);height:80%;position:absolute;inset:-20% -10% auto}.hero h1{letter-spacing:.02em;margin:0 0 6px;font-size:clamp(26px,4.4vw,44px);font-weight:400}.hero p{color:var(--muted);margin:8px 0 0}.toc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px;margin:32px 0 52px;display:grid}@media (max-width:720px){.toc-grid{grid-template-columns:1fr}}.menu-btn{text-align:center;min-height:90px;color:var(--text);letter-spacing:.04em;border:1px solid var(--line);background:linear-gradient(#ffffff0d,#ffffff05);border-radius:14px;justify-content:center;align-items:center;padding:18px 20px;font-weight:800;text-decoration:none;transition:transform .18s,box-shadow .25s,color .25s;display:flex;position:relative;overflow:hidden}.menu-btn:hover{transform:translateY(-2px);box-shadow:0 18px 40px -30px #000c}.menu-btn:after{content:"";z-index:0;opacity:0;background:linear-gradient(135deg,#78ffd62e,#8eecf538 45%,#b388ff47 85%,#ff7fd140);transition:opacity .4s;position:absolute;inset:0}.menu-btn,.menu-btn span{z-index:1;position:relative}.btn-0:before{content:"";background:linear-gradient(90deg,#0000,#b388ff73,#ff7fd18c,#0000 80%);width:200%;transition:transform .45s;position:absolute;inset:0;transform:translate(-100%)}.btn-0:hover:before{transform:translate(0)}.btn-0:hover:after{opacity:1}.btn-1:before{content:"";clip-path:polygon(0 100%,100% 0,100% 100%);background:linear-gradient(135deg,#78ffd600 0%,#78ffd659 30%,#b388ff73 70%,#ff7fd100 100%);width:220%;transition:transform .45s;position:absolute;inset:0 0 0 -10%;transform:translate(-100%)}.btn-1:hover:before{transform:translate(0)}.btn-1:hover:after{opacity:1}.btn-2:before,.btn-2:after{content:"";opacity:.8;transform-origin:50%;background:linear-gradient(90deg,#78ffd600,#78ffd6cc,#b388ff00);width:160%;height:2px;transition:transform .45s;position:absolute;top:50%;left:-30%}.btn-2:before{transform:translateY(-10px)rotate(35deg)scaleX(0)}.btn-2:after{transform:translateY(10px)rotate(-35deg)scaleX(0)}.btn-2:hover:before,.btn-2:hover:after{transform:translateY(0)rotate(var(--r,35deg))scaleX(1)}.btn-3:before,.btn-3:after{content:"";filter:blur(4px);opacity:.95;background:linear-gradient(90deg,#78ffd659,#b388ff73);width:120%;transition:transform .45s;position:absolute;top:0;bottom:0}.btn-3:before{left:-120%;transform:translate(0)}.btn-3:after{right:-120%;transform:translate(0)}.btn-3:hover:before{transform:translate(120%)}.btn-3:hover:after{transform:translate(-120%)}.btn-4:before{content:"";background:linear-gradient(90deg,#0000,#78ffd673,#b388ff8c,#0000 80%);width:200%;transition:transform .45s;position:absolute;inset:0;transform:translate(-100%)}.btn-4:hover:before{transform:translate(0)}.btn-4:hover:after{opacity:1}.btn-5:before{content:"";clip-path:polygon(0 100%,100% 0,100% 100%);background:linear-gradient(135deg,#ff7fd100 0%,#ff7fd159 30%,#8eecf573 70%,#78ffd600 100%);width:220%;transition:transform .45s;position:absolute;inset:0 0 0 -10%;transform:translate(-100%)}.btn-5:hover:before{transform:translate(0)}.btn-5:hover:after{opacity:1}.menu-btn.btn-6{position:relative;overflow:hidden}.menu-btn.btn-6>span{z-index:2;position:relative}.menu-btn.btn-6:before{content:"";filter:blur(1.5px);opacity:.95;z-index:1;background:radial-gradient(circle,#78ffd6e6,#b388ff99 60%,#ff7fd100 70%);border-radius:50%;width:18px;height:18px;transition:left .45s ease-out;position:absolute;top:50%;left:-18px;transform:translateY(-50%)}.menu-btn.btn-6:hover:before{left:calc(50% - 9px)}.menu-btn.btn-6>span:before{content:"";opacity:0;z-index:0;background:radial-gradient(circle,#78ffd659 0%,#8eecf559 30%,#b388ff59 60%,#ff7fd14d 75%,#ff7fd100 80%);border-radius:50%;width:16px;height:16px;transition:transform .65s cubic-bezier(.2,.65,.2,1) .35s,opacity .3s .35s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.menu-btn.btn-6:hover>span:before{opacity:1;transform:translate(-50%,-50%)scale(24)}.menu-btn.btn-7{position:relative;overflow:hidden}.menu-btn.btn-7>span{z-index:1;position:static}.menu-btn.btn-7:before,.menu-btn.btn-7:after,.menu-btn.btn-7>span:before,.menu-btn.btn-7>span:after{content:"";opacity:0;pointer-events:none;z-index:0;border-radius:12px;width:25%;height:0;transition:height .42s,opacity .12s;position:absolute;top:0;left:0}.menu-btn.btn-7:before{background:linear-gradient(#78ffd647,#b388ff66);left:0%}.menu-btn.btn-7>span:before{background:linear-gradient(#8eecf573,#ff7fd152);top:auto;bottom:0;left:25%}.menu-btn.btn-7:after{background:linear-gradient(#78ffd647,#b388ff66);left:50%}.menu-btn.btn-7>span:after{background:linear-gradient(#b388ff73,#ff7fd152);top:auto;bottom:0;left:75%}.menu-btn.btn-7:hover:before{opacity:1;height:100%;transition-delay:0s}.menu-btn.btn-7:hover>span:before{opacity:1;height:100%;transition-delay:50ms}.menu-btn.btn-7:hover:after{opacity:1;height:100%;transition-delay:.1s}.menu-btn.btn-7:hover>span:after{opacity:1;height:100%;transition-delay:.15s}.section{border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffff14;border-radius:14px;margin:22px 0 36px;padding:22px clamp(16px,3vw,28px)}.text-xl{font-size:22px;font-weight:700}.text-lg{font-size:15px;font-weight:400}.text-base{font-size:16px;font-weight:400;line-height:1.7}.indent-list{margin:6px 0 12px;padding-left:1.5em;list-style-type:disc}.indent-list li{margin:4px 0}
