:root{color:#312117;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 0 0,#ffcf968c,#0000 30%),radial-gradient(circle at 100% 0,#b86c3c38,#0000 25%),linear-gradient(#f7eee3 0%,#eadbc9 100%);font-family:Segoe UI Variable Text,Aptos,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0}button,audio{font:inherit}button:focus-visible{outline-offset:2px;outline:3px solid #d55f2d73}#root{min-height:100svh}.app-shell{min-height:100svh;padding:24px}.device-frame{background:linear-gradient(#ffffffeb,#f4ede4f5),#f9f3eb;border:1px solid #5b39221f;border-radius:32px;width:min(100%,480px);margin:0 auto;padding:20px 18px 28px;box-shadow:0 22px 60px #442b1d2e,inset 0 1px #ffffffbf}.topbar{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.eyebrow,.section-label,.qa-label{text-transform:uppercase;letter-spacing:.14em;color:#8d5f43;margin:0;font-size:.72rem}.topbar h1,.audio-panel h2,.content-header h2,.qa-card h3{color:#23150d;margin:0;font-family:Segoe UI Variable Display,Trebuchet MS,sans-serif}.topbar h1{margin-top:6px;font-size:clamp(2rem,5vw,2.5rem);line-height:.96}.page-counter{text-align:right;color:#5e432f;background:#6c432a14;border-radius:18px;min-width:76px;padding:10px 12px}.page-counter span,.page-counter strong{display:block}.page-counter span{font-size:.75rem}.page-counter strong{font-size:1.4rem}.progress-strip{background:#7550361f;border-radius:999px;height:8px;margin:18px 0 20px;overflow:hidden}.progress-strip span{border-radius:inherit;background:linear-gradient(90deg,#d55f2d,#efb56d);height:100%;transition:width .18s;display:block}.audio-panel,.content-card,.qa-card{background:#fffcf7e0;border:1px solid #5b39221a;border-radius:24px;box-shadow:0 10px 24px #53362414}.audio-panel{z-index:2;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);margin-bottom:18px;padding:16px;position:sticky;top:16px}.audio-panel h2{margin-top:6px;font-size:1.2rem}.audio-player{width:100%;margin-top:14px}.page-rail{scrollbar-width:none;grid-auto-columns:minmax(78px,1fr);grid-auto-flow:column;gap:10px;margin:0 -2px 6px;padding:4px 2px 14px;display:grid;overflow-x:auto}.page-rail::-webkit-scrollbar{display:none}.page-pill{color:#5d402d;text-align:left;cursor:pointer;background:#6c432a14;border:0;border-radius:20px;padding:12px 10px;transition:transform .15s,background-color .15s,color .15s}.page-pill span,.page-pill small{display:block}.page-pill span{font-size:1rem;font-weight:700}.page-pill small{margin-top:4px;font-size:.72rem}.page-pill.active{color:#fff8f1;background:linear-gradient(135deg,#6f3f24,#cf6d3f);transform:translateY(-1px)}.content-card{padding:20px 16px}.content-header{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;display:flex}.content-header h2{margin-top:6px;font-size:1.45rem;line-height:1.08}.tag-row{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.tag{color:#6a4632;background:#f2e8dc;border-radius:999px;padding:8px 10px;font-size:.78rem;font-weight:700}.copy-stack,.qa-stack{gap:12px;display:grid}.copy-stack p,.qa-card p{color:#3d2b1f;margin:0;font-size:1rem;line-height:1.6}.copy-stack p{background:#fffaf4;border-radius:20px;padding:15px 16px}.gap-none{margin-top:0}.gap-lg{margin-top:14px}.gap-xl{margin-top:28px}.qa-card{padding:16px}.qa-card h3{margin-top:8px;margin-bottom:10px;font-size:1.05rem;line-height:1.35}.bottom-bar{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px;display:grid}.nav-button{color:#5d402d;min-height:54px;font:inherit;cursor:pointer;background:#ead7c7;border:0;border-radius:18px;font-weight:700;transition:opacity .15s,transform .15s,background-color .15s}.nav-button.primary{color:#fff8f1;background:linear-gradient(135deg,#7c4529,#d6703e)}.nav-button:hover:not(:disabled),.page-pill:hover{transform:translateY(-1px)}.nav-button:disabled{opacity:.45;cursor:not-allowed}@media (width<=640px){.app-shell{padding:10px}.device-frame{border-radius:28px;width:100%;min-height:calc(100svh - 20px);padding-inline:14px}.content-header{flex-direction:column}.tag-row{justify-content:flex-start}}
