:root{--bg: #efeeec;--surface: #ffffff;--surface2: #e6e4e0;--line: #d4d1cb;--text: #111111;--muted: #6b6963;--accent: #111111;--accent-ink: #ffffff;--ok: #1d7a4a;--warn: #9a5b00;--danger: #b3261e;--radius: 18px;--nav-h: 62px;--font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--serif: "Didot", "Bodoni 72", "Bodoni MT", "Playfair Display", "Iowan Old Style", "Palatino Linotype", Georgia, serif;--shelf-bg: #dcdfe0;--all-bg: #efeeec;--glow: rgba(0,0,0,.08);color-scheme:light}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #0b0b0c;--surface: #151516;--surface2: #1f1f21;--line: #2b2b2e;--text: #f1ede4;--muted: #9d9a92;--accent: #eadcb8;--accent-ink: #14110a;--ok: #7fd6a3;--warn: #e8c070;--danger: #ff8a80;--shelf-bg: #151617;--all-bg: #050505;--glow: rgba(234,220,184,.12);color-scheme:dark}}:root[data-theme=dark]{--bg: #0b0b0c;--surface: #151516;--surface2: #1f1f21;--line: #2b2b2e;--text: #f1ede4;--muted: #9d9a92;--accent: #eadcb8;--accent-ink: #14110a;--ok: #7fd6a3;--warn: #e8c070;--danger: #ff8a80;--shelf-bg: #151617;--all-bg: #050505;--glow: rgba(234,220,184,.12);color-scheme:dark}*{box-sizing:border-box}html,body,#app{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:16px/1.55 var(--font);-webkit-text-size-adjust:100%;overscroll-behavior:none}a{color:var(--accent)}h1,h2,h3,h4{line-height:1.2;margin:0 0 .5rem}h1{font:700 1.9rem/1.15 var(--serif)}p{margin:0 0 .8rem}button,select,input,textarea{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.shell{height:100dvh;display:flex;flex-direction:column-reverse}.main{flex:1;min-height:0;overflow:hidden;position:relative}.nav{display:flex;height:calc(var(--nav-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--line)}.nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.7rem;color:var(--muted);text-decoration:none}.nav a.on{color:var(--accent);font-weight:600}.nav .brand{display:none}.center{height:100%;display:grid;place-content:center;text-align:center;padding:2rem;gap:.5rem}.spinner{width:34px;height:34px;border:4px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;margin:auto}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.spinner{animation:none}*{scroll-behavior:auto!important}}.muted{color:var(--muted)}.small{font-size:.85rem}.btn{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:.55rem 1rem;cursor:pointer;text-decoration:none;color:var(--text);display:inline-block;min-height:44px}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}.btn.ghost{border-color:transparent;background:transparent;color:var(--muted);padding-left:0}.btn.danger{color:var(--danger)}.btn.big{padding:.9rem 1.6rem;font-size:1.05rem}.icon-btn{background:none;border:0;color:var(--muted);cursor:pointer;min-width:44px;min-height:44px;display:grid;place-items:center;border-radius:50%}.icon-btn.on{color:var(--accent)}.badge{display:inline-block;font-size:.75rem;padding:.15rem .6rem;border-radius:999px;border:1px solid currentColor;white-space:nowrap}.badge.ok{color:var(--ok)}.badge.warn{color:var(--warn)}.badge.demo{color:var(--muted)}.chip{font-size:.72rem;padding:.1rem .55rem;border-radius:999px;background:var(--surface2)}.chip.understood{color:var(--ok)}.chip.revise{color:var(--warn)}.feed-wrap{height:100%;display:flex;flex-direction:column}.filters{display:flex;gap:.5rem;padding:.6rem 1rem}.filters.wrap{flex-wrap:wrap;padding:0;margin:.75rem 0}.filters select,.search{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.5rem .7rem;min-height:44px;max-width:100%;flex:1;min-width:0}.search{width:100%}.feed{flex:1;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth;overscroll-behavior:contain;outline:none;scrollbar-width:none}.feed::-webkit-scrollbar{display:none}.card{height:100%;scroll-snap-align:start;scroll-snap-stop:always;padding:.5rem 1rem 1rem;display:flex;cursor:pointer}.card-inner{flex:1;max-width:640px;margin:0 auto;width:100%;background:linear-gradient(160deg,var(--surface),var(--surface2));border:1px solid var(--line);border-radius:26px;padding:1.4rem;display:flex;flex-direction:column;gap:.8rem;overflow-y:auto}.card-top{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.book-tag{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);font-weight:600;margin:0}.book-tag a{color:inherit;text-decoration:none}.card h2{font:700 clamp(1.7rem,5.5vw,2.4rem)/1.1 var(--serif);margin:auto 0 0}.insight{font-size:1.15rem;font-weight:500;margin:0}.summary{color:var(--muted);margin:0}.card-visual{background:var(--bg);border-radius:16px;padding:.5rem;cursor:default}.card-foot{margin-top:auto;display:flex;align-items:center;gap:.6rem;padding-top:.5rem}.hint{flex:1;font-size:.75rem;color:var(--muted);text-align:right}.page{height:100%;overflow-y:auto;padding:1.2rem 1rem 3rem;max-width:720px;margin:0 auto;width:100%}.topline{display:flex;justify-content:space-between;align-items:center}.lead{font-size:1.2rem;font-weight:500}.banner{background:var(--surface2);border-left:4px solid var(--accent);border-radius:8px;padding:.6rem .9rem;font-size:.9rem}.actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:.8rem;margin-bottom:1rem}.check{display:flex;gap:.5rem;align-items:center;min-height:36px}.inline{display:flex;gap:.5rem;margin:.6rem 0}.inline input,.notes{flex:1;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:.6rem .8rem;min-width:0}.notes{width:100%;resize:vertical}.sec{margin:1.4rem 0}.sec h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.sec.warn{border-left:4px solid var(--warn);padding-left:.9rem}.sec ol{padding-left:1.3rem;margin:0}.sec li{margin-bottom:.35rem}.example{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.7rem .9rem;margin-bottom:.6rem}.example p{margin:.3rem 0 0}.tag{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.tag.book{color:var(--ok)}.tag.generated{color:var(--muted)}.answer,.answer-box{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.8rem 1rem}.related{display:flex;flex-direction:column;text-decoration:none;color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.7rem .9rem;margin-bottom:.5rem}.row,.book{display:flex;align-items:center;gap:.6rem;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:.7rem .9rem;margin-bottom:.6rem;text-decoration:none;color:var(--text);width:100%;text-align:left;cursor:pointer;justify-content:space-between}.row-main,.book>div{display:flex;flex-direction:column;min-width:0;flex:1}.row-main .muted{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.9rem}.meta{font-size:.78rem;color:var(--muted)}.chapter{margin-top:1.4rem}.tabs{display:flex;gap:.5rem;margin:.8rem 0}.tabs button{flex:1;border:0;background:var(--surface);border-radius:12px;padding:.6rem;cursor:pointer}.tabs button.on{background:var(--accent);color:var(--accent-ink);font-weight:600}.empty{text-align:center;padding:2.5rem 1rem}.ok-text{color:var(--ok)}.err-text{color:var(--danger)}.stat-row{display:flex;gap:.6rem;margin:1rem 0}.stat-row>div{flex:1;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:.8rem;text-align:center;display:flex;flex-direction:column}.stat-row b{font-size:1.8rem;font-family:var(--serif)}.stat-row span{font-size:.8rem;color:var(--muted)}.question{font:700 1.6rem/1.25 var(--serif);margin:1rem 0 1.4rem}.rates{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}.rate{display:flex;flex-direction:column;align-items:center;border-radius:14px;padding:.6rem .2rem}.rate small{color:var(--muted);font-size:.7rem}.rate.again{border-color:var(--danger)}.rate.good{border-color:var(--ok)}.diagram{margin:1rem 0}.diagram svg{width:100%;max-height:300px}.diagram figcaption{text-align:center;font-size:.8rem;color:var(--muted);margin-top:.3rem}.card-visual .diagram{margin:0}.dg-flow{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.9rem;align-items:center}.dg-flow li{background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:.45rem .9rem;position:relative;text-align:center}.dg-flow li:not(:last-child):after{content:"↓";position:absolute;left:50%;bottom:-1.15rem;transform:translate(-50%);color:var(--accent);font-weight:700}.dg-time{list-style:none;margin:0;padding:.6rem 0 0;display:flex;justify-content:space-between;border-top:3px solid var(--accent)}.dg-time li{text-align:center;font-size:.85rem;position:relative;padding-top:.7rem}.dg-time i{position:absolute;top:-1.05rem;left:50%;transform:translate(-50%);width:14px;height:14px;background:var(--bg);border:3px solid var(--accent);border-radius:50%}.dg-cmp{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.dg-cmp>div{background:var(--surface2);border-radius:10px;padding:.6rem}.dg-hier .top{background:var(--accent);color:var(--accent-ink);text-align:center;border-radius:10px;padding:.4rem;font-weight:600}.dg-hier .kids{display:flex;gap:.5rem;margin-top:.6rem}.dg-hier .kids>div{flex:1;background:var(--surface2);border-radius:10px;padding:.5rem;font-size:.85rem}.dg-mx{display:grid;grid-template-columns:auto 1fr;gap:.3rem}.dg-mx .y{writing-mode:vertical-rl;transform:rotate(180deg);text-align:center;color:var(--muted);font-size:.8rem}.dg-mx .grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.dg-mx .grid div{background:var(--surface2);padding:.6rem;border-radius:8px;font-size:.85rem}.dg-mx .x{grid-column:2;text-align:center;color:var(--muted);font-size:.8rem}@media (min-width: 900px){.shell{flex-direction:row-reverse}.nav{flex-direction:column;height:auto;width:180px;padding:1rem .6rem;border-top:0;border-right:1px solid var(--line);justify-content:flex-start;gap:.2rem}.shell{flex-direction:row}.nav .brand{display:block;font:700 1.4rem var(--serif);color:var(--text);padding:.4rem .8rem 1rem;text-decoration:none;flex:none}.nav a:not(.brand){flex:none;flex-direction:row;justify-content:flex-start;gap:.7rem;font-size:.95rem;padding:.6rem .8rem;border-radius:12px}.nav a.on{background:var(--surface2)}.nav .gear{display:flex;margin-top:auto}.card-inner{padding:2rem;max-height:720px;margin-block:auto}.card{padding:1rem}}h1,h2,.card h2,.question,.stat-row b{font-weight:400;letter-spacing:-.02em}h1{font-size:2.4rem}.card{padding:0}.card-inner{background:transparent;border:0;border-radius:0;max-width:680px;padding:1.2rem 1.4rem 1.4rem}.card h2{font-size:clamp(2.8rem,12vw,5.4rem);line-height:1.02;font-weight:400;margin:auto 0 .2rem}.card .insight{font-size:1.1rem;font-weight:400;color:var(--muted);max-width:34ch;line-height:1.45}.book-tag{letter-spacing:.16em;font-size:.7rem;color:var(--muted)}.card-visual{background:var(--surface);border:1px solid var(--line)}.card-foot .hint{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}.badge{letter-spacing:.04em}.sec h3{letter-spacing:.16em;color:var(--muted)}.lead{font:400 1.35rem/1.4 var(--serif)}.nav a{letter-spacing:.02em}@media (min-width: 900px){.card-inner{max-height:none;margin-block:0;padding:2rem 2rem 2.4rem}}.shelf{height:100%;overflow-y:auto;background:var(--shelf-bg);color:var(--text);display:flex;flex-direction:column;padding:1rem 0 1.4rem}.shelf-top{display:flex;justify-content:space-between;align-items:center;padding:0 1.2rem}.wordmark{font:400 1.5rem var(--serif);letter-spacing:-.02em}.pill{background:var(--text);color:var(--bg);border-radius:999px;padding:.5rem 1.3rem;text-decoration:none;font-size:.9rem;letter-spacing:.06em}.shelf-title{font:400 clamp(2rem,7vw,3.2rem)/1.05 var(--serif);letter-spacing:-.03em;padding:1.4rem 1.2rem 0;margin:0}.fan{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2.2rem calc(50% - 95px) 7rem;scrollbar-width:none;outline:none;min-height:440px;align-items:flex-start}.fan::-webkit-scrollbar{display:none}.cover{flex:none;height:290px;scroll-snap-align:center;border:0;border-radius:18px;padding:1.1rem;text-align:left;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;color:var(--ink);background:linear-gradient(155deg,var(--c1),var(--c2));box-shadow:0 14px 30px -14px #00000073;transform-origin:50% 160%;will-change:transform;position:relative}.cover-title{font:400 1.7rem/1.02 var(--serif);letter-spacing:-.02em}.cover-author{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.8}.cover-demo{position:absolute;top:.8rem;right:.8rem;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid currentColor;border-radius:999px;padding:.05rem .5rem;opacity:.8}.shelf-info{text-align:center;padding:0 1.2rem;display:flex;flex-direction:column;gap:.2rem;align-items:center;margin-top:-4.5rem;position:relative;z-index:200}.shelf-info strong{font:400 1.5rem var(--serif)}.shelf-info>span{color:var(--muted);font-size:.85rem}.shelf-actions{display:flex;gap:.5rem;margin-top:.8rem}.shelf .btn{background:transparent;border-color:var(--text);color:var(--text)}.shelf .btn.primary{background:var(--text);color:var(--bg)}.all{height:100%;overflow-y:auto;background:var(--all-bg);color:var(--text);padding-bottom:3rem}.all-top{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;padding:.9rem 1.2rem;font-size:.7rem;letter-spacing:.2em;background:linear-gradient(var(--all-bg) 60%,transparent);align-items:center}.all-top .back{color:inherit;text-decoration:none;letter-spacing:.08em}.mosaic{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:14px;padding:1rem 1.2rem 2rem;max-width:900px;margin:0 auto}.tile{aspect-ratio:1;border:0;border-radius:6px;padding:.8rem;text-align:left;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;color:var(--ink);background:linear-gradient(150deg,var(--c1),var(--c2));transition:transform .15s}.tile:nth-child(2n){transform:translateY(26px)}.tile:hover,.tile:focus-visible{transform:scale(1.04);z-index:1}.tile:nth-child(2n):hover{transform:translateY(26px) scale(1.04)}.tile-name{font:400 1.35rem/1.05 var(--serif);letter-spacing:-.02em;overflow-wrap:anywhere}.tile-count{font-size:.7rem;letter-spacing:.14em;opacity:.75}.tile.everything{background:var(--text);color:var(--bg)}@media (prefers-reduced-motion: reduce){.tile{transition:none}}.filters{align-items:center}.back-link{color:var(--text);text-decoration:none;font-size:1.4rem;padding:0 .3rem;min-width:32px;text-align:center}.theme-btn{flex:none;color:var(--text)}.top-actions{display:flex;align-items:center;gap:.4rem}.card{position:relative}.card-inner{padding-right:4.2rem}.rail{position:absolute;right:.5rem;bottom:4.6rem;display:flex;flex-direction:column;gap:.4rem;z-index:2}.rail .icon-btn{background:var(--surface);border:1px solid var(--line);color:var(--text)}.rail .icon-btn.on{color:var(--accent);border-color:var(--accent)}@media (min-width: 900px){.rail{right:calc(50% - 360px)}}.dg-flow .t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-visual .dg-flow li{max-width:100%}@keyframes rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}@keyframes dash{to{stroke-dashoffset:-24}}@keyframes lit{0%,30%,to{fill:var(--surface2);stroke:var(--line)}8%,22%{fill:var(--glow);stroke:var(--accent)}}@keyframes breathe{0%,to{box-shadow:0 0 0 0 var(--glow)}50%{box-shadow:0 0 0 7px var(--glow)}}@media (prefers-reduced-motion: no-preference){.card.active .book-tag{animation:rise .5s both}.card.active h2{animation:rise .6s .05s both}.card.active .insight,.card.active .summary{animation:rise .6s .18s both}.card.active .card-visual{animation:rise .6s .3s both}:is(.card.active,.detail) .dg-flow li{animation:rise .5s calc(.45s + var(--i) * .22s) both}:is(.card.active,.detail) .dg-flow li:after{animation:pop .3s calc(.7s + var(--i) * .22s) both}:is(.card.active,.detail) .dg-time li{animation:rise .5s calc(.4s + var(--i) * .2s) both}:is(.card.active,.detail) .dg-time i{animation:pop .4s calc(.5s + var(--i) * .2s) both,breathe 2.4s calc(1.4s + var(--i) * .3s) infinite}:is(.card.active,.detail) .dg-cmp>div,:is(.card.active,.detail) .dg-hier .kids>div,:is(.card.active,.detail) .dg-mx .grid div{animation:rise .55s both}:is(.card.active,.detail) .dg-cmp>div:nth-child(2),:is(.card.active,.detail) .dg-hier .kids>div:nth-child(2),:is(.card.active,.detail) .dg-mx .grid div:nth-child(2){animation-delay:.2s}:is(.card.active,.detail) .dg-hier .kids>div:nth-child(3),:is(.card.active,.detail) .dg-mx .grid div:nth-child(3){animation-delay:.35s}:is(.card.active,.detail) .dg-mx .grid div:nth-child(4){animation-delay:.5s}:is(.card.active,.detail) .loop-arrow{stroke-dasharray:8 6;animation:dash 1.1s linear infinite}:is(.card.active,.detail) .node{animation:pop .5s calc(var(--i) * .2s) both;transform-box:fill-box;transform-origin:center}:is(.card.active,.detail) .node-rect{animation:lit calc(var(--n) * 1.4s) calc(.8s + var(--i) * 1.4s) infinite}}@keyframes popx{0%{opacity:0;transform:translate(-50%) scale(.4)}to{opacity:1;transform:translate(-50%)}}@media (prefers-reduced-motion: no-preference){:is(.card.active,.detail) .dg-flow li:after{animation:popx .3s calc(.7s + var(--i) * .22s) both}}.unlock{display:flex;gap:.5rem;width:min(360px,100%);margin:.6rem auto}.unlock input{flex:1;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.6rem .8rem;min-height:44px}
