.hd-reading-entry { display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; padding:24px; text-align:left; border:1px solid #9b7a48; border-radius:14px; background:linear-gradient(110deg,#292330,#191c29); color:#f1dfb8; font:inherit; cursor:pointer; }
.hd-reading-entry strong { display:block; margin-bottom:7px; font-size:20px; }.hd-reading-entry small { display:block; color:#b9b0a2; line-height:1.6; }.hd-reading-entry > span:last-child { white-space:nowrap; }
.hd-source-reading .hd-source-note { color:#a9a5ab; font-size:13px; line-height:1.7; }
.hd-books { box-sizing:border-box; width:min(940px,calc(100vw - 40px)); height:min(850px,calc(100dvh - 40px)); max-width:none; max-height:none; padding:0; border:1px solid #80613f; border-radius:16px; background:#15161e; color:#efe5d3; overflow:hidden; box-shadow:0 24px 100px #0009; font-family:system-ui,-apple-system,'PingFang SC','Microsoft YaHei',sans-serif; }
.hd-books::backdrop { background:#030711c9; backdrop-filter:blur(6px); }.hd-books-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 24px; border-bottom:1px solid #665139; height:68px; box-sizing:border-box; }
.hd-books button { font:inherit; cursor:pointer; }.hd-books-bar button { border:1px solid #80674b; background:transparent; color:#e7cfaa; padding:9px 13px; border-radius:8px; font-size:14px; }.hd-books button:focus-visible { outline:2px solid #ead2a6; outline-offset:4px; }
.hd-books-body { height:calc(100% - 68px); overflow:auto; overscroll-behavior:contain; }.hd-shelf-heading { padding:36px 32px 24px; }.hd-shelf-heading > span { color:#c8ab7c; font-size:13px; letter-spacing:2px; }.hd-shelf-heading h2 { font-size:28px; margin:12px 0; color:#f3e5cd; }.hd-shelf-heading p { color:#b5afa7; line-height:1.7; margin:0; }
.hd-shelf { padding:0 32px 32px; display:grid; grid-template-columns:1fr 1fr; gap:22px; }.hd-book-item { display:flex; align-items:center; gap:20px; padding:18px; text-align:left; border:1px solid #64533e; border-radius:12px; background:#201f24; color:#eee1ca; min-width:0; }.hd-book-item:hover { border-color:#b08c59; background:#25232a; }
.hd-leather-cover { display:flex; flex-direction:column; justify-content:space-between; flex-shrink:0; width:112px; height:158px; box-sizing:border-box; padding:18px 12px 15px 19px; border:1px solid #947050; border-left:7px solid #422d20; border-radius:3px 7px 7px 3px; color:#eed4a2; box-shadow:3px 5px 9px #0006,inset 0 0 0 3px #61442f; background:radial-gradient(ellipse at 70% 30%,#b0824220,transparent 70%),repeating-linear-gradient(23deg,#ffffff06 0 1px,transparent 1px 3px),linear-gradient(90deg,#593b27,#745333 20%,#68482e); }.hd-leather-cover span { font-size:10px; letter-spacing:1px; }.hd-leather-cover strong { font-weight:500; font-size:16px; line-height:1.6; }
.hd-book-description { display:flex; flex-direction:column; gap:10px; min-width:0; }.hd-book-description > strong { font-size:18px; line-height:1.5; }.hd-book-description > span { font-size:13px; line-height:1.8; color:#bcb6ad; }.hd-book-description small { font-size:11px; line-height:1.7; color:#afa18d; }.hd-book-description .hd-book-open { color:#e2c18d; }
.hd-paper { box-sizing:border-box; min-height:100%; margin:0; padding:48px 72px 50px; color:#302c25; background:radial-gradient(ellipse at 80% 10%,#ffffff65,transparent 70%),repeating-linear-gradient(7deg,#79552f03 0 1px,transparent 1px 4px),linear-gradient(90deg,#e8dfcd 0,#f5efdf 3%,#f8f2e5 50%,#eee6d6 100%); box-shadow:inset 10px 0 20px #6e492719; font-size:18px; line-height:2; text-align:left; }
.hd-paper h2 { color:#433725; margin:8px 0 12px; font-size:30px; line-height:1.6; font-weight:600; }.hd-paper-kicker,.hd-paper .hd-page-reference { font-size:13px; color:#7b6b53; letter-spacing:.5px; }.hd-paper h3 { font-size:16px; color:#69553c; margin:28px 0 15px; }.hd-paper p { margin:0 0 22px; overflow-wrap:anywhere; }.hd-paper-practice { margin-top:32px; padding-top:6px; border-top:1px solid #9e815c40; }.hd-paper .hd-editor-note { color:#7c6b54; font-size:13px; line-height:1.85; margin-top:30px; }.hd-paper-return { border:1px solid #967a53; border-radius:8px; background:#e9ddc8; color:#59462f; padding:12px 18px; }
@media (max-width:650px) { .hd-books { width:100vw; height:100dvh; margin:0; border:0; border-radius:0; }.hd-books-bar { padding:12px 16px; height:64px; }.hd-books-bar > span { font-size:14px; }.hd-books-body { height:calc(100% - 64px); }.hd-shelf-heading { padding:28px 20px 22px; }.hd-shelf { grid-template-columns:1fr; padding:0 20px 28px; gap:16px; }.hd-book-item { padding:18px; }.hd-paper { padding:30px 25px 44px; font-size:17px; line-height:1.95; }.hd-paper h2 { font-size:25px; }.hd-reading-entry { padding:20px; }.hd-reading-entry > span:last-child { font-size:13px; } }
@media (prefers-reduced-motion:no-preference) { .hd-books[open] .hd-paper { animation:hd-page-open .22s ease-out; } @keyframes hd-page-open { from{transform:translateX(8px)}to{transform:none} } }
.hd-source-figure { margin:26px 0 30px; text-align:center; }.hd-source-figure button { display:block; max-width:100%; margin:auto; padding:12px; border:1px solid #b5a58860; border-radius:4px; background:#fff; }.hd-source-figure img { display:block; width:min(100%,280px); height:auto; margin:auto; }.hd-source-figure figcaption { margin-top:12px; color:#7b6b53; font-size:12px; line-height:1.7; }.hd-source-figure figcaption span { display:block; color:#81663f; }
.hd-figure-view { position:absolute; inset:0; z-index:4; display:flex; flex-direction:column; background:#f7f1e5; color:#302c25; }.hd-figure-view[hidden] { display:none; }.hd-figure-view > button { flex-shrink:0; align-self:flex-start; margin:16px; padding:10px 16px; border:1px solid #967a53; border-radius:8px; background:#e9ddc8; color:#59462f; }.hd-figure-scroll { overflow:auto; flex:1; min-height:0; padding:24px; overscroll-behavior:contain; }.hd-figure-scroll img { display:block; width:auto; height:auto; max-width:none; margin:0 auto; background:#fff; }
.hd-source-figure button { box-sizing:border-box; width:min(100%,304px); }.hd-source-figure img { width:100%; }.hd-source-figure-wide button { width:min(100%,444px); }