:root{color-scheme:light;--paper:#f4efe4;--ink:#302f2a;--red:#932f27;--muted:#7c776d;--line:#d8cebb}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Serif SC","Songti SC","SimSun",serif;background-image:radial-gradient(ellipse at 10% 30%,#ddd2b633,transparent 60%)}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #a67830;outline-offset:5px}header{max-width:1200px;margin:auto;padding:28px 44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:16px;align-items:center;text-decoration:none;color:var(--ink);letter-spacing:3px;font-size:15px}.seal{background:var(--red);color:#fff8e9;padding:12px 8px;border-radius:2px;writing-mode:vertical-rl;letter-spacing:4px;font-size:19px;outline:1px solid #c27560;outline-offset:-4px}.edition{font-size:14px;color:var(--muted);letter-spacing:3px}main{max-width:1120px;margin:auto;padding:40px 36px 24px}.intro{text-align:center}.eyebrow{color:var(--red);font-size:13px;letter-spacing:4px}h1{font-weight:500;font-size:43px;letter-spacing:5px;margin:15px 0}.mobile-break{display:none}.sub{font-family:system-ui,sans-serif;font-size:14px;color:var(--muted);line-height:1.8}.workbench{display:grid;grid-template-columns:minmax(0,650px) 1fr;align-items:center;gap:65px;margin-top:20px}.wheel-area{min-width:0}.wheel-label{display:flex;justify-content:space-between;margin:0 24px;color:var(--muted);font-size:12px;letter-spacing:4px}.wheel-frame{position:relative;margin:16px auto;width:100%;max-width:580px;border-radius:50%;padding:13px;border:1px solid #ad9671;box-shadow:0 0 0 5px var(--paper),0 0 0 6px #d8cbb1,0 18px 35px #41321812}.wheel-frame:before{content:"";position:absolute;inset:7px;border:1px solid #ad967180;border-radius:50%;pointer-events:none}#wheel{display:block;width:100%;height:auto;transition:transform 4.3s cubic-bezier(.12,.7,.12,1);border-radius:50%;background:#ebdfc6}.pointer{position:absolute;top:0;left:50%;width:16px;height:25px;transform:translate(-50%,0);clip-path:polygon(0 0,100% 0,50% 100%);background:#932f27;z-index:2}.center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:25%;aspect-ratio:1;border-radius:50%;border:7px solid var(--paper);background:var(--red);color:#fff2d8;box-shadow:0 0 0 1px #b89e72,0 4px 20px #30210c30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px}.center span{font-size:clamp(18px,2vw,26px);letter-spacing:3px}.center small{font-size:12px;opacity:.75;letter-spacing:2px}.center:disabled{cursor:wait;background:#794039}.status{text-align:center;color:var(--muted);font-size:13px;margin:28px 0 0;line-height:1.8;min-height:24px}.side{border-left:1px solid var(--line);padding-left:36px;position:relative}.side-heading{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);letter-spacing:2px}.side h2{font-size:34px;line-height:1.7;letter-spacing:7px;font-weight:400;margin:26px 0 18px}.side>p{color:var(--muted);line-height:2;font-size:16px}.rule{height:1px;background:var(--line);margin:24px 0}.side .instruction{font-size:14px}.instruction b{font-weight:400;color:var(--red);padding-right:14px}.side-bottom{display:block;margin-top:30px;color:#9b927f;font-size:12px;letter-spacing:3px}footer{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);color:var(--muted);font-family:system-ui,sans-serif;font-size:12px;display:flex;justify-content:space-between;gap:20px}details{max-width:510px}summary{cursor:pointer;text-align:right}details p{font-size:13px;line-height:1.8}details a{color:var(--red)}.last{margin-top:25px;padding:20px 24px;border:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.last[hidden]{display:none}.last small{color:var(--muted);font-size:12px}.last h2{font-size:20px;font-weight:400;margin:8px 0 0}.text-button{border:0;background:none;color:var(--red);font-size:14px}dialog{border:1px solid #bba480;background:var(--paper);color:var(--ink);width:min(480px,calc(100% - 28px));max-height:90dvh;padding:0;border-radius:5px;box-shadow:0 24px 100px #16120b55}dialog::backdrop{background:#27251f99;backdrop-filter:blur(4px)}body:has(dialog[open]){overflow:hidden}.close{position:sticky;top:10px;float:right;margin:10px 12px -50px 0;width:38px;height:38px;border:1px solid var(--line);background:var(--paper);border-radius:50%;font:26px system-ui;z-index:3;color:var(--muted)}.result-top{text-align:center;padding:30px 25px 24px;border-bottom:1px solid var(--line)}.grade{display:inline-block;border:1px solid var(--red);color:var(--red);padding:5px 13px;margin:9px 0 20px;letter-spacing:4px;font-size:18px}.hex-lines{width:76px;display:flex;flex-direction:column;gap:6px;margin:0 auto 20px}.yao{height:6px;display:flex;gap:12px}.yao i{background:var(--ink);height:100%;flex:1}.number{font-size:12px;color:var(--muted);letter-spacing:3px}.result-top h2{font-weight:500;font-size:30px;letter-spacing:4px;margin:12px 0}.structure{color:var(--muted);font-size:14px;margin-bottom:0}.reading{padding:24px 30px}.reading h3{font-size:20px;font-weight:500;margin:0 0 14px;letter-spacing:2px}.reading p{font-family:system-ui,sans-serif;font-size:16px;line-height:1.9;color:#605b50}.advice{border-left:2px solid #ab7c42;padding-left:17px;margin-top:22px}.advice span{font-size:13px;color:var(--red);letter-spacing:2px}.advice p{margin-top:9px}.reading .reading-note{font-size:12px;color:var(--muted);margin-top:25px;text-align:center}.again{width:100%;background:var(--red);border:0;color:#fff1df;padding:15px;font-size:16px;letter-spacing:3px}@media(max-width:700px){header{padding:17px 22px}.brand{font-size:13px;gap:10px}.seal{font-size:16px;padding:10px 7px}.edition{font-size:12px;letter-spacing:1px}main{padding:26px 23px 20px}.intro h1{font-size:32px;line-height:1.6;letter-spacing:4px;margin:12px 0}.sub{font-size:13px;max-width:285px;margin:8px auto 25px}.workbench{display:block;margin-top:12px}.side{display:none}.wheel-label{margin:0 8px}.wheel-frame{margin-top:17px;padding:9px}.wheel-frame:before{inset:4px}.center{border-width:5px;gap:5px}.center span{font-size:18px;letter-spacing:1px}.center small{font-size:10px;letter-spacing:0}.status{font-size:12px;margin-top:24px}footer{margin-top:30px;flex-direction:column;text-align:center;gap:14px}summary{text-align:center}details{text-align:left}.eyebrow{font-size:12px}.reading{padding:22px}.mobile-break{display:initial}}@media(prefers-reduced-motion:reduce){#wheel{transition-duration:.05s}}
