html,body,#root{height:100%;margin:0}body{background:#0c1a24;color:#eaf2f8;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}.app{position:relative;height:100%;display:flex;align-items:center;justify-content:center}canvas{width:100%;height:100%;position:absolute;inset:0}.hud{position:absolute;top:10px;left:10px;right:10px;display:flex;justify-content:space-between;gap:10px;z-index:2}.card{background:#00000073;border:1px solid rgba(255,255,255,.12);padding:8px 12px;border-radius:8px}.concept{position:absolute;bottom:20px;left:50%;transform:translate(-50%);max-width:80ch;background:#0000008c;padding:12px 16px;border-radius:8px;border:1px solid rgba(255,255,255,.12);z-index:2}.controls{position:absolute;bottom:20px;right:20px;display:flex;gap:8px;z-index:2}.btn{background:#193345;color:#eaf2f8;border:1px solid #2a4a5e;padding:8px 12px;border-radius:6px}.book-overlay{position:fixed;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:5}.book-panel{width:min(80vw,860px);max-height:80vh;background:#101418;color:#dfe7ee;border:1px solid rgba(255,255,255,.12);border-radius:12px;box-shadow:0 10px 30px #0000008c;display:flex;flex-direction:column}.book-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.08)}.book-content{padding:16px;overflow:auto}.book-level{color:#9bd1ff;font-weight:700;margin-bottom:8px}.book-pages{display:grid;grid-template-columns:1fr 1fr;gap:16px}.page{background:linear-gradient(135deg,#12161a,#0f1317);border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:14px;box-shadow:inset 0 0 0 1px #ffffff05,0 8px 20px #00000059;min-height:220px}.page.flip-left{animation:flipL .18s ease-out;transform-origin:left center}.page.flip-right{animation:flipR .18s ease-out;transform-origin:right center}@keyframes flipL{0%{transform:rotateY(0)}to{transform:rotateY(-20deg)}}@keyframes flipR{0%{transform:rotateY(0)}to{transform:rotateY(20deg)}}.page h4{margin:0 0 8px;color:#a3e3ff;font-size:1rem}.book-text{font-size:1.02rem;line-height:1.6}.book-empty{opacity:.8}.level-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:6}.level-panel{width:min(78vw,700px);background:#0f1419;color:#e5eef6;border:1px solid rgba(255,255,255,.12);border-radius:12px;box-shadow:0 12px 36px #0009;padding:20px;text-align:center}.level-panel h2{margin:0 0 10px}.level-actions{display:flex;justify-content:center;gap:10px;margin-top:12px}