@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');
:root{--bg:#101c17;--paper:#f5f0e4;--ink:#192820;--forest:#1b382a;--dark:#12251d;--gold:#e8bb74;--muted:#a0b0a4;--hair:rgba(226,241,226,.14)}*{box-sizing:border-box}html{min-height:100%}body{margin:0;background:var(--bg);color:#f6f3e8;font-family:'DM Sans',system-ui,sans-serif;min-height:100vh;overflow-x:hidden}.ambient{position:fixed;width:450px;height:450px;border-radius:50%;pointer-events:none;filter:blur(100px);opacity:.17;z-index:-1}.ambient-one{background:#8e7d3a;top:-240px;right:-140px}.ambient-two{background:#2c7654;bottom:-260px;left:-220px}.shell{max-width:720px;padding:26px 22px 25px;margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;padding-bottom:25px;border-bottom:1px solid var(--hair)}.brand{display:flex;align-items:center;gap:12px}.logo{background:var(--gold);color:#183426;font-family:Georgia,serif;font-weight:800;font-size:31px;width:45px;height:45px;border-radius:12px;display:grid;place-items:center;letter-spacing:-5px;padding-right:5px}.logo span{color:#8e542b}.brand strong{font-family:'Playfair Display',Georgia,serif;font-size:29px;letter-spacing:-1.6px;line-height:1}.brand-dot{color:var(--gold)}.brand small{display:block;color:#9dac9d;font-size:9px;letter-spacing:2.1px;font-weight:700;margin-top:4px}.top-actions{display:flex;gap:9px}.icon-btn{border:1px solid #3d5346;background:transparent;color:#e8eddf;border-radius:12px;width:40px;height:40px;font-size:19px;cursor:pointer}.icon-btn:hover{background:#274232}.intro{text-align:center;padding:38px 0 28px}.eyebrow{color:var(--gold);font-size:10px;font-weight:700;letter-spacing:2.3px}.live-dot{display:inline-block;width:7px;height:7px;background:#c6b179;border-radius:50%;margin-right:8px}.intro h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(42px,8vw,62px);line-height:1.11;font-weight:500;margin:15px 0 14px;letter-spacing:-2px}.intro em{color:var(--gold)}.intro p{color:#adbdaf;line-height:1.65;max-width:370px;margin:auto;font-size:14px}.game-card{background:var(--paper);color:var(--ink);border-radius:20px;padding:28px 29px 25px;box-shadow:0 18px 55px rgba(0,0,0,.18)}.game-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.micro{font-size:10px;letter-spacing:1.9px;font-weight:700;color:#6c826e}.game-heading h2{font-family:'Playfair Display',Georgia,serif;font-size:26px;margin:3px 0}.date-pill{border:1px solid #d1d6c9;border-radius:20px;padding:9px 13px;font-size:11px;font-weight:700;color:#546a5c}.game-progress{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin:21px 0 29px}.progress-segment{height:7px;border-radius:10px;background:#d9ded4}.progress-segment.active{background:#b8894c}.progress-segment.past{background:#315d46}.clue-header{display:flex;justify-content:space-between;gap:9px;align-items:center;margin-bottom:12px;font-size:10px;letter-spacing:1.2px;font-weight:700;color:#466c51}.clue-header .muted{color:#8e9a8e}#score-label{color:#98713e;font-size:9px}.quote-box{background:#1d3a2b;color:#fff8e9;border-radius:14px;padding:23px 27px 18px;min-height:188px;position:relative;overflow:hidden}.quote-box:after{content:'✦';position:absolute;right:-13px;bottom:-41px;color:#ffffff09;font-size:180px}.quote-mark{font-family:'Playfair Display',Georgia,serif;font-size:56px;color:var(--gold);height:38px;line-height:1}.quote-text{font-family:'Playfair Display',Georgia,serif;font-size:clamp(19px,4.2vw,24px);line-height:1.54;margin:14px 0 29px;position:relative;z-index:1}.quote-bottom{border-top:1px solid #ffffff25;padding-top:13px;display:flex;justify-content:space-between;color:#a8c0aa;font-size:9px;letter-spacing:1.3px}.quote-ornament{font-size:16px;color:var(--gold)}.hint-box{display:flex;gap:12px;background:#eae6d8;border-radius:12px;padding:15px 17px;margin-top:15px}.hint-icon{font-size:24px;color:#95733e}.hint-box strong{font-size:12px}.hint-box p{font-size:12px;color:#5d6d60;line-height:1.55;margin:4px 0 0}.guess-area{margin-top:24px}.guess-area label{display:block;font-size:10px;font-weight:800;letter-spacing:1.6px;margin-bottom:9px}.input-wrap{position:relative}input{width:100%;font:inherit;font-size:15px;color:#243e30;background:#fffdf8;border:1px solid #c9d2c4;border-radius:10px;padding:15px 16px;outline:none}input:focus{border-color:#35664e;box-shadow:0 0 0 3px #35664e20}.input-note{font-size:11px;color:#718071;min-height:18px;padding-top:6px}.input-note.error{color:#9e4b38}.suggestions{position:absolute;z-index:4;left:0;right:0;top:calc(100% + 2px);background:#fffdf8;border:1px solid #c9d2c4;border-radius:10px;box-shadow:0 12px 28px #162d2427;max-height:200px;overflow:auto}.suggestions button{width:100%;text-align:left;padding:11px 15px;background:none;color:#263c30;border:0;font:inherit;font-size:12px;cursor:pointer}.suggestions button:hover,.suggestions button:focus{background:#ebf0e8}.button-row{display:grid;grid-template-columns:1.3fr 1fr;gap:10px;margin-top:12px}button{font:inherit}.primary-btn,.secondary-btn{border-radius:10px;padding:14px 12px;font-weight:800;font-size:13px;cursor:pointer}.primary-btn{background:#24563a;border:1px solid #24563a;color:#fffdf1;display:flex;justify-content:space-between;align-items:center;padding-left:18px;padding-right:18px}.primary-btn:hover{background:#1c462e}.secondary-btn{background:transparent;border:1px solid #c7d0c2;color:#526755}.secondary-btn:hover{background:#e8eddf}.guess-history{margin-top:15px;display:flex;flex-direction:column;gap:8px}.past-guess{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 13px;border:1px solid #d7ded2;border-radius:8px;font-size:12px}.past-guess span:last-child{color:#8a6142;font-weight:700}.below{display:grid;grid-template-columns:1fr 1px 1fr;align-items:center;gap:20px;margin:22px auto 15px;max-width:515px}.below-stat{display:flex;align-items:center;gap:10px}.tiny-icon{color:var(--gold);font-size:29px}.below-stat strong,.below-stat span:last-child{display:block}.below-stat strong{font-size:12px}.below-stat div span{font-size:10px;color:#9fb0a2;margin-top:3px}.separator{height:28px;background:var(--hair)}footer{border-top:1px solid var(--hair);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:9px;font-size:10px;color:#849b8b}.footer-link{border:0;background:none;color:#d0b580;text-decoration:underline;cursor:pointer;font-size:10px;padding:0}.result-wrap{text-align:center;padding:13px 0 5px}.result-icon{font-size:45px}.result-wrap h3{font-family:'Playfair Display',Georgia,serif;font-size:34px;margin:6px 0}.result-sub{color:#6d7c6e;font-size:13px;line-height:1.5}.book-reveal{background:#e9e6d9;border-radius:12px;padding:18px;margin:22px 0;text-align:left}.book-reveal small{font-size:9px;letter-spacing:1.2px;color:#718272;font-weight:800}.book-reveal h4{font-family:'Playfair Display',Georgia,serif;font-size:23px;margin:8px 0 3px}.book-reveal p{font-size:12px;color:#667668;margin:4px 0}.result-score{display:flex;justify-content:center;gap:35px;margin:20px 0}.result-score div strong{font-family:'Playfair Display',Georgia,serif;font-size:27px;display:block}.result-score div span{font-size:10px;letter-spacing:.7px;color:#708070}.share-btn{width:100%;justify-content:center;gap:9px}.result-note{font-size:11px;color:#718071;margin-top:13px}dialog{border:1px solid #e5e0d6;border-radius:17px;max-width:470px;width:calc(100% - 32px);padding:22px 26px;background:#fbf6ea;color:#1d3025;box-shadow:0 20px 90px #0007}dialog::backdrop{background:#07140cba}.modal-head{display:flex;align-items:center;justify-content:space-between}.modal-head h2{font-family:'Playfair Display',Georgia,serif;font-size:27px;margin:0}.modal-head .icon-btn{color:#37503e;border-color:#d9dacc;width:34px;height:34px}#modal-body{color:#526454;font-size:13px;line-height:1.75}#modal-body ul{padding-left:20px}#modal-body a{color:#255e3d}.modal-metric{display:flex;justify-content:space-between;border-bottom:1px solid #dfdfd5;padding:12px 0}.source-list{padding-left:18px}button:focus-visible{outline:3px solid #da9d50;outline-offset:2px}@media(max-width:520px){.shell{padding:20px 13px}.intro{padding:29px 0 26px}.game-card{padding:21px 17px}.quote-box{padding:20px 20px 15px;min-height:176px}.button-row{grid-template-columns:1fr 1fr}.below{gap:12px}.below-stat div span{font-size:9px}.date-pill{font-size:10px}.brand small{letter-spacing:1.4px}}
/* Bookle v2 visual refresh */
:root{--bg:#10271e;--paper:#fffaf0;--forest:#153e2e;--dark:#0d261c;--gold:#d9b16a;--muted:#aebcb0;--hair:rgba(229,236,217,.15)}
body{background:radial-gradient(ellipse 92% 48% at 50% -8%,#24523a 0%,transparent 75%),linear-gradient(155deg,#11291f,#0d2019);}
.shell{max-width:780px;padding:24px 24px 40px;position:relative;z-index:1}
.topbar{padding-bottom:22px}.logo{width:48px;height:48px;background:#e4c280;border-radius:14px;box-shadow:0 4px 18px #060f0b55}.brand strong{font-size:31px}.brand small{font-size:9px;color:#b8c7b5}
.practice-top{border:1px solid #56755c;border-radius:10px;padding:11px 14px;background:rgba(225,195,131,.10);color:#f0d29c;font-size:12px;font-weight:700;cursor:pointer}.practice-top:hover{background:rgba(225,195,131,.19)}
.intro{padding:36px 0 31px}.intro h1{font-size:clamp(43px,7.2vw,60px);letter-spacing:-1.9px}.intro em{color:#e6bf78}.intro p{max-width:460px;color:#b7c8bb;font-size:14px}.intro-decoration{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:21px;color:#d7b36e;font-size:13px}.intro-decoration span:first-child,.intro-decoration span:last-child{height:1px;width:50px;background:linear-gradient(90deg,transparent,#b4a375)}.intro-decoration span:last-child{transform:rotate(180deg)}
.game-card{background:var(--paper);border:1px solid #eedcb9;border-radius:22px;padding:31px 34px;box-shadow:0 26px 70px #05130d7d,0 2px 8px #05130d22}
.game-heading h2{font-size:30px}.date-pill{color:#3d5b47;background:#f2edde;border-color:#e3d8bf}.micro{color:#57755c}
.game-progress{margin:22px 0 25px;gap:8px}.progress-segment{height:8px;background:#e9e5d8}.progress-segment.active{background:linear-gradient(90deg,#cf9d56,#ecc67f);box-shadow:0 0 0 2px #c99c5722}.progress-segment.past{background:#285e40}
.quote-box{background:radial-gradient(ellipse at 100% 0%,#2d5b42,#173c2a 70%);border:1px solid #3b644a;min-height:204px;padding:26px 30px 20px;border-radius:16px;box-shadow:inset 0 1px 0 #ffffff1c}.quote-box:after{content:'❦';right:-8px;bottom:-70px;font-size:210px;color:#ebcc7a0b}.quote-mark{color:#e8bc77}.quote-text{color:#fff9ea;font-size:clamp(20px,3.6vw,26px);font-weight:500}.quote-bottom{color:#d1dabe}.hint-box{background:#f0ebdb;border:1px solid #e5dbc6;padding:16px 18px}.hint-box strong{font-size:13px;color:#385440}.hint-box p{color:#536758;font-size:13px}
.guess-area{margin-top:25px}.guess-area label{color:#44624e;font-size:10px}.input-wrap{position:relative}.search-icon{position:absolute;top:9px;left:15px;color:#7b927f;font-size:30px;line-height:1;z-index:1;pointer-events:none}.guess-area input{min-height:56px;padding:16px 44px 16px 47px;border:1.5px solid #b9cabb;border-radius:12px;font-size:16px;background:white;color:#163d29;position:relative;z-index:0}.guess-area input:focus{border-color:#287c4e;box-shadow:0 0 0 4px #327b4d20}.guess-area input::placeholder{color:#8da494}input[type="search"]::-webkit-search-cancel-button{cursor:pointer}
.suggestions{z-index:50;top:calc(100% + 6px);border:1px solid #cfddcc;border-radius:13px;max-height:308px;box-shadow:0 18px 40px #132a2159;overflow-y:auto;background:white}.suggestions[hidden]{display:none!important}.suggestion-option{display:flex!important;flex-direction:column;gap:4px;width:100%;padding:12px 16px!important;border-bottom:1px solid #e5ece2!important}.suggestion-option strong{font-size:14px;font-weight:750;color:#204b32}.suggestion-option small{font-size:11px;color:#738b7a}.suggestion-option.is-active,.suggestion-option:hover{background:#e9f3e8!important}.suggestion-option:last-child{border-bottom:none!important}
.input-note{font-size:12px;color:#637c69;padding-top:9px;min-height:25px}.button-row{margin-top:13px;gap:12px}.primary-btn,.secondary-btn{min-height:51px;font-size:14px;border-radius:11px}.primary-btn{background:#1d6544;border-color:#1d6544;box-shadow:0 4px 12px #1c573126}.primary-btn:hover{background:#174f36}.secondary-btn{border:1.5px solid #b7c7b7;background:#f8f5eb;color:#2c593d}.secondary-btn:hover{background:#e9f2e6}.mobile-help{font-size:11px;text-align:center;color:#78917c;margin-top:13px}.guess-history{margin-top:18px}.past-guess{background:#fffdf8}
.below{margin-top:28px}.below-stat strong{font-size:13px}.below-stat div span{font-size:11px}.next-practice-btn{width:100%;margin-top:10px}.book-reveal h4{color:#234b35}
@media(max-width:520px){.shell{padding:16px 12px 35px}.topbar{padding-bottom:18px}.brand strong{font-size:27px}.brand small{font-size:7.5px;letter-spacing:1.3px}.logo{height:43px;width:43px;font-size:29px}.top-actions{gap:6px}.icon-btn{height:36px;width:36px}.practice-top{padding:9px 10px;font-size:11px}.intro{padding:30px 0 24px}.intro h1{font-size:43px}.game-card{padding:20px 17px;border-radius:18px}.game-heading h2{font-size:25px}.quote-box{min-height:192px;padding:20px 20px 17px}.quote-text{font-size:21px}.hint-box{padding:13px}.button-row{gap:8px}.primary-btn,.secondary-btn{padding:12px 10px;font-size:12px}.below{gap:9px}.below-stat{gap:6px}}

/* Upcoming paid feature — no playable unlimited/practice mode until payments are integrated. */
.coming-soon-tag{display:flex;align-items:center;gap:8px;border:1px solid #647d64;background:rgba(225,195,131,.1);color:#f3e6cf;border-radius:10px;padding:10px 13px;font-size:12px;font-weight:700;white-space:nowrap}
.coming-soon-tag span,.coming-soon-result span{background:#e5bd78;color:#1b3025;border-radius:5px;padding:3px 6px;font-size:10px;text-transform:uppercase;letter-spacing:.05em}
.coming-soon-result{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:10px;padding:15px;border:1px dashed #9ba999;border-radius:10px;color:#31533a;font-weight:700;font-size:13px}
@media(max-width:520px){.coming-soon-tag{padding:8px;font-size:10px;gap:5px}.coming-soon-tag span{font-size:8px}}

/* Bookle V4: seasonal and time-of-day backgrounds. Familiar forest + gold remain the identity. */
body{--seasonGlow:#24583a;--seasonAccent:#e6c486;--skyGlow:#24583a;background:radial-gradient(ellipse 100% 48% at 50% -6%,var(--skyGlow) 0%,transparent 76%),radial-gradient(ellipse 65% 42% at 100% 94%,var(--seasonGlow) 0%,transparent 90%),linear-gradient(150deg,#11291f,#0b2118);transition:background-color .5s ease}
body[data-season="halloween"]{--seasonGlow:#573421;--seasonAccent:#edb577;--skyGlow:#304b36}
body[data-season="christmas"]{--seasonGlow:#3b3730;--seasonAccent:#e5d4a7;--skyGlow:#275043}
body[data-season="easter"]{--seasonGlow:#524b63;--seasonAccent:#efdca5;--skyGlow:#315943}
body[data-season="spring"]{--seasonGlow:#365e40;--seasonAccent:#e5cb89;--skyGlow:#386148}
body[data-season="summer"]{--seasonGlow:#4d5930;--seasonAccent:#f3d494;--skyGlow:#2d5d43}
body[data-season="autumn"]{--seasonGlow:#54402c;--seasonAccent:#edc48a;--skyGlow:#31513b}
body[data-season="winter"]{--seasonGlow:#30485d;--seasonAccent:#e4d2a2;--skyGlow:#26443c}
body[data-time="day"]{--skyGlow:#386c50}
body[data-time="dusk"]{--skyGlow:#3e4d3d}
body[data-time="night"]{--skyGlow:#1d3f31}
.season-chip{display:inline-block;margin-left:8px;background:#ffffff12;border:1px solid #f0d29c50;border-radius:99px;padding:6px 9px;color:var(--seasonAccent);font-size:9px;letter-spacing:1.2px;vertical-align:middle}
.intro em{color:var(--seasonAccent)}.brand-dot{color:var(--seasonAccent)}
.account-btn{font-size:23px;color:#e8c88c;flex-shrink:0}
.reader-rank{margin:22px auto 0;padding:17px 22px;display:flex;align-items:center;gap:15px;border:1px solid #d2bd8550;background:linear-gradient(100deg,#274231,#20392b);border-radius:15px;box-shadow:0 10px 25px #0002}
.worm-medallion{width:45px;height:45px;border-radius:50%;display:grid;place-items:center;background:#e1c888;color:#172b20;font-size:23px;flex-shrink:0}
.rank-copy{flex:1;min-width:0}.rank-copy small{color:#c5b585;font-size:9px;letter-spacing:1.5px;display:block}.rank-copy strong{font-family:'Playfair Display',Georgia,serif;color:#fff8e8;font-size:21px;display:block;margin:2px 0}.rank-copy span{color:#bbd2bf;font-size:11px}
.rank-awards{text-align:right}.rank-awards strong{font-size:11px;color:#f3dab0;display:block}.award-link{margin-top:6px;background:none;color:#d5e1d2;font-size:11px;text-decoration:underline;border:0;padding:0;cursor:pointer}
.award-title{font-family:'Playfair Display',Georgia,serif;font-size:19px;color:#254c33;margin:19px 0 12px}.awards-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.award{border:1px solid #dbdccd;background:#eeece3;border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:3px;min-height:130px}
.award.unlocked{border-color:#d3af66;background:#f7f0dc}.award.locked{opacity:.58;filter:grayscale(.6)}.award-icon{font-size:23px}.award strong{font-size:12px;color:#264b32}.award small{font-size:11px;color:#536855;line-height:1.35}.award-status{margin-top:auto;color:#8a6d32;font-size:9px;letter-spacing:1px;font-weight:800}
.rank-panel{display:flex;flex-direction:column;gap:4px;background:#254632;border-radius:11px;color:#fff6e4;padding:15px 18px;margin:12px 0}.rank-panel span{font-size:9px;color:#e6c68c;letter-spacing:1.6px}.rank-panel strong{font-family:'Playfair Display',Georgia,serif;font-size:24px}.rank-panel small{font-size:11px;color:#b9cbbf}.storage-note{font-size:11px;color:#667b69}
@media(max-width:520px){.intro .eyebrow{line-height:2.7}.season-chip{margin-left:4px}.reader-rank{padding:13px;gap:10px}.worm-medallion{width:39px;height:39px;font-size:19px}.rank-copy strong{font-size:17px}.rank-awards strong{font-size:10px}.coming-soon-tag{padding:6px 5px;gap:4px;font-size:9px}.coming-soon-tag span{font-size:7px}.account-btn{font-size:18px;width:33px;min-width:33px}.rank-awards{max-width:108px}}

/* On small screens keep the toolbar inside the viewport. */
@media(max-width:520px){.topbar{flex-wrap:wrap;row-gap:10px}.top-actions{width:100%;justify-content:flex-end}.coming-soon-tag{margin-right:auto}}
