@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=Fredoka+One&family=Caveat:wght@600;700;800&family=DM+Sans:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,700;0,800;1,700;1,800&display=swap");*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--ink:#14120c;--ink2:#302e24;--ink3:#645e4e;--ink4:#9c9484;--paper:#faf7f0;--paper2:#f2ede0;--paper3:#e8e0cc;--paper4:#d9ceb4;--amber:#b8720a;--amberL:#fef0d0;--amber2:#d98c0c;--rust:#a83c14;--rustL:#fce8e0;--pine:#1a5430;--pineL:#d8f0e4;--slate:#1a2e50;--slateL:#d8e8f8;--sky:#2563eb;--skyL:#dbeafe;--skyD:#1d4ed8;--rose:#e11d48;--roseL:#ffe4e6;--sun:#f59e0b;--sunL:#fef3c7;--lime:#16a34a;--limeL:#dcfce7;--violet:#7c3aed;--violetL:#ede9fe;--tangerine:#ea580c;--tangerineL:#ffedd5;--green:#22c55e;--r:16px;--r2:28px;--r3:40px;--sh-magic:0 8px 32px rgba(37,99,235,.18),0 2px 8px rgba(0,0,0,.08);--sh-glow:0 0 0 4px rgba(245,158,11,.28);--sh1:0 4px 20px rgba(20,18,12,.06);--sh2:0 12px 40px rgba(245,158,11,.15)}body{font-family:Nunito,sans-serif;background:var(--paper);color:var(--ink);line-height:1.6;min-height:100vh}.serif{font-family:Playfair Display,serif}.script{font-family:Caveat,cursive}.fun,.playful{font-family:Fredoka One,cursive}.btn,.round{font-family:Nunito,sans-serif}.btn{display:inline-flex;align-items:center;gap:7px;padding:12px 26px;border:none;border-radius:var(--r3);font-size:15px;font-weight:800;cursor:pointer;transition:all .2s cubic-bezier(.34,1.56,.64,1);letter-spacing:.2px;white-space:nowrap}.btn:hover{transform:translateY(-3px) scale(1.03)}.btn:active{transform:scale(.96)}.btn:disabled{opacity:.38;cursor:not-allowed;transform:none!important}.btn-ink{background:var(--ink);color:var(--paper)}.btn-ink:hover{background:var(--ink2);box-shadow:0 5px 20px rgba(20,18,12,.3)}.btn-amber{background:linear-gradient(135deg,var(--sun),var(--tangerine));color:#fff;box-shadow:0 4px 0 #c2440a,0 8px 24px rgba(234,88,12,.35)}.btn-amber:hover{box-shadow:0 6px 0 #c2440a,0 12px 32px rgba(234,88,12,.45)}.btn-amber:active{transform:translateY(2px);box-shadow:0 2px 0 #c2440a}.btn-ghost{background:transparent;color:var(--ink3);border:2px solid var(--paper4)}.btn-ghost:hover{border-color:var(--ink3);color:var(--ink);transform:translateY(-2px)}.btn-sm{padding:8px 16px;font-size:13px}.btn-lg{padding:14px 32px;font-size:16px}.btn-block{width:100%;justify-content:center}.inp{width:100%;padding:12px 16px;border:2px solid var(--paper3);border-radius:var(--r);font-family:Nunito,sans-serif;font-size:15px;font-weight:600;color:var(--ink);background:var(--paper);outline:none;transition:all .2s}.inp:focus{border-color:var(--sun);box-shadow:0 0 0 4px rgba(245,158,11,.2)}.inp::placeholder{color:var(--paper4);font-weight:400}.lbl{display:block;font-size:10px;fontWeight:800;color:var(--ink3);margin-bottom:5px;letter-spacing:.9px;text-transform:uppercase}.card{background:#fff;border-radius:var(--r2);border:2.5px solid var(--paper3);box-shadow:var(--sh1)}.card-h{transition:all .22s cubic-bezier(.34,1.56,.64,1)}.card-h:hover{border-color:var(--sunL);box-shadow:var(--sh2);transform:translateY(-4px) rotate(.3deg)}.opt{border-radius:var(--r2);border:3px solid var(--paper3);padding:18px 12px;cursor:pointer;transition:all .22s cubic-bezier(.34,1.56,.64,1);background:#fff;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative;overflow:hidden}.opt:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,hsla(0,0%,100%,.6) 50%,transparent 60%);transform:translateX(-100%);transition:transform .4s}.opt:hover:before{transform:translateX(100%)}.opt:hover{background:var(--sunL);transform:translateY(-4px) rotate(-1deg);box-shadow:0 8px 24px rgba(245,158,11,.28)}.opt.on,.opt:hover{border-color:var(--sun)}.opt.on{background:linear-gradient(145deg,var(--sunL),#fff8e7);box-shadow:0 0 0 4px rgba(245,158,11,.2),0 8px 24px rgba(245,158,11,.2);transform:scale(1.04)}.badge{display:inline-flex;align-items:center;gap:3px;padding:4px 10px;border-radius:50px;font-size:10px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}.b-a{background:var(--sunL);color:#b45309}.b-p{background:var(--pineL);color:var(--pine)}.b-s{background:var(--slateL);color:var(--slate)}.b-i{background:var(--ink);color:var(--paper)}.bar{height:10px;background:var(--paper3);overflow:visible}.bar,.bar-f{border-radius:50px;position:relative}.bar-f{height:100%;background:linear-gradient(90deg,var(--sky),var(--violet),var(--rose),var(--sun));background-size:200% 100%;animation:rainbowBar 2s linear infinite,width .55s cubic-bezier(.4,0,.2,1);box-shadow:0 0 12px rgba(124,58,237,.4)}.bar-f:after{content:"⭐";position:absolute;right:-10px;top:-8px;font-size:18px;animation:starBounce .6s ease-in-out infinite alternate;filter:drop-shadow(0 2px 4px rgba(245,158,11,.6))}@keyframes up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes in{0%{opacity:0}to{opacity:1}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes pageIn{0%{opacity:0;transform:perspective(700px) rotateY(-8deg) translateX(22px)}to{opacity:1;transform:perspective(700px) rotateY(0) translateX(0)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.18)}to{transform:scale(1)}}@keyframes sparkleIn{0%{opacity:0;transform:scale(0) rotate(-20deg)}60%{transform:scale(1.15) rotate(5deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes floatSlow{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(2deg)}}@keyframes rainbowBar{0%{background-position:0 50%}to{background-position:200% 50%}}@keyframes starBounce{0%{transform:translateY(0)}to{transform:translateY(-4px)}}.au{animation:up .38s ease both}.ai{animation:in .3s ease both}.af{animation:float 3.5s ease-in-out infinite}.as{animation:spin .9s linear infinite}.aps{animation:pageIn .42s cubic-bezier(.22,1,.36,1) both}.ab{animation:bounce 1.8s ease-in-out infinite}.wiggle:hover{animation:wiggle .4s ease}.pop{animation:pop .4s cubic-bezier(.34,1.56,.64,1)}.sparkle{animation:sparkleIn .5s cubic-bezier(.34,1.56,.64,1) both}.float-slow{animation:floatSlow 4s ease-in-out infinite}.overlay{position:fixed;inset:0;background:rgba(20,18,12,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}.modal{background:#fff;border-radius:var(--r2);padding:32px;max-width:410px;width:100%;box-shadow:0 24px 72px rgba(20,18,12,.32)}.book-wrap{perspective:1200px}.book{display:flex;border-radius:2px 16px 16px 2px;overflow:hidden;box-shadow:-8px 6px 32px rgba(0,0,0,.32),8px 8px 44px rgba(0,0,0,.36),inset -2px 0 8px rgba(0,0,0,.14)}.spine{width:20px;flex-shrink:0;background:linear-gradient(180deg,#c8a060,#7c5018 30%,#c8a060 55%,#6c4010 82%,#c8a060);box-shadow:inset -4px 0 10px rgba(0,0,0,.38),inset 2px 0 4px hsla(0,0%,100%,.1)}.bpage{flex:1 1;background:#fff;overflow:hidden}.tag{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:50px;font-size:12px;font-weight:700;font-family:Fredoka One,cursive}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:var(--paper2)}::-webkit-scrollbar-thumb{background:var(--paper4);border-radius:3px}