:root{--bg:#f5f4f0;--surface:#fff;--surface2:#ebe9e3;--text:#111318;--muted:#777b84;--line:rgba(17,19,24,.08);--accent:#6f63df;--ok:#27795d;--bad:#a34444;--shadow:0 24px 70px rgba(17,19,24,.10);--shadow2:0 12px 32px rgba(17,19,24,.07);--max:1180px;--rx:32px;--rl:22px}
body.dark{--bg:#0b0d12;--surface:#12151b;--surface2:#191d24;--text:#f4f5f7;--muted:#9da2ad;--line:rgba(255,255,255,.08);--accent:#998df3;--ok:#6bb79c;--bad:#d88989;--shadow:0 28px 72px rgba(0,0,0,.34);--shadow2:0 15px 36px rgba(0,0,0,.22)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 10% -5%,rgba(111,99,223,.1),transparent 30%),var(--bg);color:var(--text);transition:.25s;overflow-x:hidden}body.lock{overflow:hidden}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}.hidden{display:none!important}.container{width:min(calc(100% - 28px),var(--max));margin:auto}
.nav-shell{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}nav{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.035em}.brand-mark{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:var(--text);color:var(--bg)}.nav-links{display:flex;gap:22px;color:var(--muted);font-size:.88rem}.nav-actions{display:flex;gap:8px;align-items:center}.btn,.icon-btn,.chip,.tab,.tiny{border:0;cursor:pointer;transition:.2s}.btn{padding:10px 14px;border-radius:13px;font-weight:740}.btn.primary{background:var(--text);color:var(--bg)}.btn.secondary{background:var(--surface2);border:1px solid var(--line)}.icon-btn{width:40px;height:40px;border-radius:13px;background:transparent;border:1px solid var(--line)}
.hero{padding:56px 0 28px}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}.kicker{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:760}h1{font-size:clamp(3.4rem,6.7vw,6.4rem);line-height:.91;letter-spacing:-.07em;margin:16px 0 18px}.hero p{color:var(--muted);max-width:560px;line-height:1.7}.hero-link{display:inline-flex;gap:8px;margin-top:22px;font-weight:740;font-size:.9rem}.hero-visual{position:relative;min-height:470px;border-radius:var(--rx);overflow:hidden;background:radial-gradient(circle at 28% 24%,rgba(255,255,255,.2),transparent 25%),linear-gradient(145deg,#171922,#3d376a 58%,#7468d7);box-shadow:var(--shadow)}.orbitbox{position:absolute;top:24px;left:24px;width:62px;height:62px;display:grid;place-items:center}.orbit{position:absolute;border:1px solid rgba(255,255,255,.35);border-radius:50%;animation:pulse 4.8s ease-in-out infinite}.o1{width:58px;height:58px}.o2{width:40px;height:40px;animation-delay:.45s}.o3{width:24px;height:24px;animation-delay:.9s}.core{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(255,255,255,.08),0 0 26px rgba(255,255,255,.38)}@keyframes pulse{50%{transform:scale(1.08);opacity:.65}}.hero-books{position:absolute;inset:88px 24px 24px}.hero-book{position:absolute;width:35%;aspect-ratio:2/3;border-radius:18px;padding:18px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 28px 44px rgba(0,0,0,.24);transition:.45s}.hero-book small{opacity:.72;text-transform:uppercase;letter-spacing:.09em;font-size:.65rem}.hero-book strong{font-size:1.25rem;line-height:1.07}.hero-book:nth-child(1){left:8%;bottom:9%;transform:rotate(-10deg);background:linear-gradient(155deg,#203957,#577b9f)}.hero-book:nth-child(2){left:33%;bottom:14%;z-index:3;transform:rotate(1deg);background:linear-gradient(155deg,#4d3f78,#8f73d0)}.hero-book:nth-child(3){right:7%;bottom:8%;transform:rotate(10deg);background:linear-gradient(155deg,#34594b,#78a089)}
.pitch{padding:14px 0}.pitch-card{border-block:1px solid var(--line);padding:30px 0;display:grid;grid-template-columns:.7fr 1.3fr;gap:38px}.pitch-label{font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:760}.pitch-copy{margin:0;font-size:clamp(1.4rem,2.6vw,2.3rem);line-height:1.18;letter-spacing:-.04em}.pitch-copy span{color:var(--muted)}
.section{padding:28px 0}.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:16px}.section-head h2{margin:0;font-size:clamp(1.65rem,3vw,2.2rem);letter-spacing:-.04em}.section-head p{margin:5px 0 0;color:var(--muted);font-size:.86rem}.swipe,.books{display:grid;grid-auto-flow:column;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 7px}.swipe{grid-auto-columns:minmax(220px,1fr)}.books{grid-auto-columns:minmax(235px,278px)}.category{scroll-snap-align:start;min-height:138px;padding:18px;border-radius:var(--rl);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow2);display:flex;flex-direction:column;justify-content:space-between;transition:.25s;cursor:pointer}.category:hover{transform:translateY(-5px)}.cat-icon{width:52px;height:52px;border-radius:16px;background:var(--surface2);display:grid;place-items:center;border:1px solid var(--line)}.cat-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.category h3{margin:16px 0 3px;font-size:.98rem}.category span{font-size:.78rem;color:var(--muted)}
.search-panel{display:flex;gap:9px;padding:11px;background:var(--surface);border:1px solid var(--line);border-radius:var(--rl);box-shadow:var(--shadow2)}.search-box{flex:1;display:flex;gap:9px;align-items:center;background:var(--surface2);border-radius:13px;padding:0 13px}.search-box input{width:100%;padding:12px 0;background:transparent;border:0;outline:0}.chips{display:flex;gap:7px;overflow-x:auto;padding-top:11px}.chip{flex:none;padding:7px 10px;border-radius:999px;background:transparent;border:1px solid var(--line);color:var(--muted);font-size:.78rem}.chip.active{background:var(--text);color:var(--bg);border-color:var(--text)}
.book-card{scroll-snap-align:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--rl);overflow:hidden;box-shadow:var(--shadow2)}.cover{aspect-ratio:4/5;position:relative;color:#fff}.cover:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.32),transparent 58%)}.cover-label,.cover-title{position:absolute;z-index:2}.cover-label{top:14px;left:14px;font-size:.65rem;background:rgba(255,255,255,.14);padding:6px 8px;border-radius:999px}.cover-title{left:18px;right:18px;bottom:18px;font-size:1.35rem;line-height:1.05;font-weight:780}.book-info{padding:14px}.book-info h3{margin:0;font-size:.96rem}.book-info p{margin:5px 0 0;color:var(--muted);font-size:.78rem}.book-meta{margin-top:12px;text-align:right}.empty{padding:26px;border:1px dashed var(--line);border-radius:var(--rl);color:var(--muted);text-align:center;background:color-mix(in srgb,var(--surface) 65%,transparent)}
.contrib{margin:30px 0 12px;padding:22px 24px;border-radius:var(--rx);background:var(--text);color:var(--bg);display:flex;align-items:center;justify-content:space-between;gap:18px}.contrib h2{margin:0;font-size:clamp(1.4rem,3vw,2rem)}.contrib a{font-size:.88rem;font-weight:740;border-bottom:1px solid currentColor}.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.resource{padding:19px;border-radius:var(--rl);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow2)}.resource strong{display:block}.resource span{display:block;margin-top:5px;color:var(--muted);font-size:.8rem}.resource a{display:inline-block;margin-top:12px;font-size:.8rem;font-weight:740}
.backdrop{position:fixed;inset:0;z-index:100;background:rgba(7,9,13,.48);backdrop-filter:blur(10px);display:grid;place-items:center;padding:18px;opacity:0;pointer-events:none;transition:.2s}.backdrop.open{opacity:1;pointer-events:auto}.modal{width:min(100%,450px);max-height:90vh;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:27px;box-shadow:0 34px 90px rgba(0,0,0,.28);padding:22px}.modal.wide{width:min(100%,620px)}.modal-top{display:flex;justify-content:space-between;gap:14px;margin-bottom:18px}.modal-top h3{margin:0 0 4px;font-size:1.5rem}.modal-top p{margin:0;color:var(--muted);font-size:.85rem}.close-btn{width:36px;height:36px;border-radius:12px;border:0;background:var(--surface2);cursor:pointer}.tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--surface2);padding:4px;border-radius:13px;margin-bottom:16px}.tab{padding:9px;border-radius:10px;background:transparent}.tab.active{background:var(--surface);box-shadow:var(--shadow2)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.field{display:grid;gap:6px;margin-bottom:12px}.field.full{grid-column:1/-1}.field label{font-size:.75rem;color:var(--muted);font-weight:700}.field input,.field select,.field textarea{width:100%;padding:12px 13px;border-radius:13px;background:var(--surface2);border:1px solid var(--line);outline:0}.field textarea{min-height:86px;resize:vertical}.actions{display:flex;justify-content:flex-end;gap:8px}.status{min-height:18px;margin-top:8px;font-size:.75rem}.status.ok{color:var(--ok)}.status.bad{color:var(--bad)}.account-list{display:grid;gap:9px}.account-list .btn{width:100%;text-align:center}
.admin{padding:38px 0 60px}.admin-head{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:18px}.admin-head h1{font-size:clamp(2.7rem,5vw,4.6rem);margin:0}.admin-tabs{display:flex;gap:8px;margin-bottom:15px;overflow:auto}.admin-tabs .tab{border:1px solid var(--line);background:var(--surface)}.admin-tabs .tab.active{background:var(--text);color:var(--bg)}.review-list{display:grid;gap:11px}.review{padding:16px;border-radius:var(--rl);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow2);display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center}.review h3{margin:0 0 4px;font-size:.97rem}.review p{margin:0;color:var(--muted);font-size:.77rem}.review-actions{display:flex;gap:7px;flex-wrap:wrap}.tiny{padding:8px 10px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);font-size:.74rem}.approve{color:var(--ok)}.reject,.delete{color:var(--bad)}.admin-select{padding:8px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);font-size:.74rem}
footer{border-top:1px solid var(--line);padding:24px 0 32px;color:var(--muted);font-size:.82rem}.footer-row{display:flex;justify-content:space-between;gap:18px}.fade{opacity:0;transform:translateY(15px);transition:.65s}.fade.show{opacity:1;transform:none}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-visual{min-height:410px}.nav-links{display:none}.pitch-card{grid-template-columns:1fr;gap:14px}.resource-grid{grid-template-columns:1fr}}@media(max-width:620px){.container{width:min(calc(100% - 20px),var(--max))}.hero{padding:36px 0 20px}h1{font-size:3.3rem}.hero-visual{min-height:335px}.form-grid{grid-template-columns:1fr}.review{grid-template-columns:1fr}.contrib{flex-direction:column;align-items:flex-start}.section{padding:24px 0}}


/* BookVault v3 refinements */
.brand-logo{width:44px;height:44px;object-fit:contain;border-radius:12px;background:#fff;padding:2px;box-shadow:0 6px 18px rgba(0,0,0,.08)}
.nav-links{font-size:1.04rem;font-weight:720;gap:30px}
.nav-links a{position:relative;transition:color .2s ease,transform .2s ease}
.nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:2px;background:currentColor;border-radius:999px;transition:right .25s ease}
.nav-links a:hover{color:var(--text);transform:translateY(-1px)}
.nav-links a:hover:after{right:0}

.hero-visual{animation:heroFloat 7s ease-in-out infinite}
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

.hero-books-all{inset:72px 14px 18px}
.hero-books-all .hero-book{width:29%;aspect-ratio:2/3;padding:14px;border-radius:16px;will-change:transform}
.hero-books-all .hero-book strong{font-size:1.03rem}
.hero-books-all .hero-book small{font-size:.58rem}
.hero-books-all .hb1{left:1%;bottom:8%;transform:rotate(-12deg);background:linear-gradient(155deg,#203957,#577b9f)}
.hero-books-all .hb2{left:18%;bottom:18%;transform:rotate(-6deg);background:linear-gradient(155deg,#5d4a76,#a77a9f)}
.hero-books-all .hb3{left:36%;bottom:23%;z-index:4;transform:rotate(0deg);background:linear-gradient(155deg,#8a5c3b,#bd8a63)}
.hero-books-all .hb4{right:17%;bottom:17%;transform:rotate(6deg);background:linear-gradient(155deg,#34594b,#78a089)}
.hero-books-all .hb5{right:1%;bottom:7%;transform:rotate(12deg);background:linear-gradient(155deg,#334d66,#6280a0)}
.hero-visual:hover .hb1{transform:translate(-8px,-5px) rotate(-14deg)}
.hero-visual:hover .hb2{transform:translate(-4px,-10px) rotate(-7deg)}
.hero-visual:hover .hb3{transform:translateY(-16px)}
.hero-visual:hover .hb4{transform:translate(4px,-10px) rotate(7deg)}
.hero-visual:hover .hb5{transform:translate(8px,-5px) rotate(14deg)}

.category{position:relative;overflow:hidden}
.category:before{content:"";position:absolute;inset:auto -35% -70% -35%;height:130%;background:radial-gradient(circle,rgba(111,99,223,.10),transparent 68%);transform:scale(.8);opacity:0;transition:.35s ease}
.category:hover:before{transform:scale(1);opacity:1}
.cat-icon{transition:.3s cubic-bezier(.2,.8,.2,1)}
.category:hover .cat-icon{transform:translateY(-3px) rotate(-4deg) scale(1.05)}

.swipe,.books{scroll-behavior:smooth;overscroll-behavior-x:contain;cursor:grab}
.swipe:active,.books:active{cursor:grabbing}
.swipe-hint{margin-top:9px;color:var(--muted);font-size:.74rem;opacity:.78;display:none}

.book-card{transition:transform .25s ease,box-shadow .25s ease}
.book-card:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(17,19,24,.12)}
.cover{transition:transform .35s ease}
.book-card:hover .cover{transform:scale(1.015)}
.btn,.icon-btn,.chip,.tiny{transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease}
.btn:hover,.icon-btn:hover,.tiny:hover{transform:translateY(-1px)}
.btn:active,.icon-btn:active,.tiny:active,.chip:active{transform:scale(.98)}

@media(max-width:900px){
  .swipe-hint{display:block}
  .hero-books-all .hero-book{width:31%}
}
@media(max-width:620px){
  .brand-logo{width:39px;height:39px}
  .hero-books-all{inset:64px 8px 12px}
  .hero-books-all .hero-book{width:31%;padding:10px;border-radius:13px}
  .hero-books-all .hero-book strong{font-size:.8rem}
  .hero-books-all .hero-book small{font-size:.49rem}
  .hero-books-all .hb1{left:0}.hero-books-all .hb2{left:17%}.hero-books-all .hb3{left:35%}.hero-books-all .hb4{right:16%}.hero-books-all .hb5{right:0}
}


/* BooksVault v4 hero and branding overrides */
.brand-logo{width:46px;height:46px;object-fit:contain;border-radius:12px;background:rgba(255,255,255,.95);padding:3px;box-shadow:0 10px 24px rgba(0,0,0,.10)}
.hero-visual{animation:none;min-height:470px;display:flex;align-items:center;justify-content:center}
.hero-constellation{position:absolute;inset:48px 34px 34px;display:flex;align-items:center;justify-content:center}
.hero-ring{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.14);animation:gentlePulse 8s ease-in-out infinite}
.ring-1{width:290px;height:290px}.ring-2{width:380px;height:380px;animation-delay:1.2s}
@keyframes gentlePulse{0%,100%{transform:scale(1);opacity:.72}50%{transform:scale(1.03);opacity:1}}
.hero-center{position:absolute;width:126px;height:126px;border-radius:30px;display:grid;place-items:center;background:rgba(255,255,255,.10);backdrop-filter:blur(12px);box-shadow:0 24px 60px rgba(0,0,0,.24);animation:floatCenter 7s ease-in-out infinite}
.hero-center:before{content:"";position:absolute;inset:-12px;border-radius:38px;border:1px solid rgba(255,255,255,.16)}
.hero-center-logo{width:86px;height:86px;object-fit:contain;border-radius:22px;background:rgba(255,255,255,.95);padding:4px}
@keyframes floatCenter{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hero-node{position:absolute;max-width:168px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.18);font-size:.84rem;font-weight:720;line-height:1.25;letter-spacing:.01em;animation:nodeFloat 6.5s ease-in-out infinite}
.hero-node span{display:block}
.node-1{left:2%;top:43%;animation-delay:.1s}.node-2{left:16%;top:14%;animation-delay:.8s}.node-3{right:38%;top:5%;animation-delay:1.5s}.node-4{right:11%;top:20%;animation-delay:2.1s}.node-5{right:0;bottom:13%;max-width:205px;animation-delay:2.8s}
@keyframes nodeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.hero-node:after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.85);box-shadow:0 0 0 7px rgba(255,255,255,.08)}
.node-1:after{right:-18px;top:50%}.node-2:after{right:24px;bottom:-18px}.node-3:after{left:50%;bottom:-18px}.node-4:after{left:-18px;top:50%}.node-5:after{left:-18px;top:34%}
.hero-visual:hover .hero-center{transform:translateY(-10px) scale(1.02)}
.hero-visual:hover .hero-node{background:rgba(255,255,255,.16)}
.hero-books-all,.hero-book{display:none !important}
@media(max-width:900px){.hero-visual{min-height:420px}.hero-constellation{inset:38px 18px 22px}.hero-ring.ring-1{width:220px;height:220px}.hero-ring.ring-2{width:300px;height:300px}.hero-center{width:100px;height:100px}.hero-center-logo{width:68px;height:68px}.hero-node{font-size:.75rem;padding:10px 12px;max-width:132px}.node-1{left:0;top:46%}.node-2{left:6%;top:14%}.node-3{right:30%;top:4%}.node-4{right:0;top:20%}.node-5{right:0;bottom:7%;max-width:150px}}
@media(max-width:620px){.brand-logo{width:40px;height:40px}.hero-visual{min-height:355px}.hero-constellation{inset:34px 12px 16px}.hero-ring.ring-1{width:180px;height:180px}.hero-ring.ring-2{width:238px;height:238px}.hero-center{width:84px;height:84px;border-radius:24px}.hero-center-logo{width:56px;height:56px}.hero-node{font-size:.66rem;padding:8px 10px;border-radius:14px;max-width:110px}.node-1{left:0;top:52%}.node-2{left:3%;top:17%}.node-3{right:24%;top:3%}.node-4{right:0;top:24%}.node-5{right:0;bottom:8%;max-width:124px}}
