:root{font-family:ui-rounded,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#254b47;background:#eef5f2;font-synthesis:none;--ink:#254b47;--muted:#5a716c;--paper:#fffdf6;--line:#d3e0d8;--accent:#2d6b5e;--reading-size:1}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top right,#fff7df80,transparent 60%)}button,a,select,input{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button,a{touch-action:manipulation}button{min-height:48px;padding:10px 16px;border:1px solid var(--line);border-radius:14px;color:var(--ink);background:var(--paper);cursor:pointer;font-weight:650}button:hover{border-color:#548b78;background:#f3f7ed}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #a15d23;outline-offset:4px}a{color:inherit}h1,h2,p{margin:0}h1{font-size:32px;letter-spacing:-1px;line-height:1.35}h2{font-size:20px}small{line-height:1.6}.shell{max-width:960px;margin:auto;padding:0 28px 30px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-bottom:1px solid var(--line);gap:12px}.topbar a{font-size:14px;text-decoration:none;min-height:48px;display:flex;align-items:center}.topbar button{font-size:24px;min-width:48px;padding:0}.brand{font-size:11px;letter-spacing:2.5px;font-weight:750}.brand span{color:#ab6c2e}.heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:30px 0 22px}.eyebrow{font-size:12px;letter-spacing:2px;color:#55776b;font-weight:700;margin-bottom:9px}.muted{color:var(--muted);font-size:14px;line-height:1.8;margin-top:8px}.heading>button{white-space:nowrap}.harbor{min-height:300px;position:relative;overflow:hidden;border:1px solid #c6dcd3;background:linear-gradient(125deg,#e1efe5,#d8ebeb);border-radius:28px;padding:30px}.harbor-copy{position:relative;z-index:1;max-width:52%}.label{font-size:11px;letter-spacing:1.5px;padding:7px 10px;background:#ffffff80;border-radius:8px;display:inline-block;margin-bottom:16px}.harbor h2{font-size:27px}.harbor p{font-size:13px;line-height:1.8;margin-top:8px;color:#4d7067}.voyage-count{display:flex;align-items:baseline;gap:10px;margin-top:12px}.voyage-count strong{font-size:44px;font-weight:650}.voyage-count span{font-size:12px}.harbor-art{position:absolute;right:0;bottom:22px;width:48%;height:auto}.tower-lights{display:flex;gap:4px;position:relative;z-index:1;margin-top:20px}.tower-lights i{height:8px;flex:1;background:#b9d1c7;border-radius:3px}.tower-lights i.on{background:#c88827;box-shadow:0 0 8px #efc56d}.resume-box{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 22px;background:#fff7e6;border:1px solid #e9dfc7;border-radius:20px;margin-top:16px}.resume-box small{color:var(--muted);display:block}.resume-box strong{display:block;margin-top:5px}.primary{background:var(--accent);color:#fff;border-color:var(--accent)}.primary:hover{background:#24594e;color:white}.islands{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0}.islands button{display:flex;flex-direction:column;gap:5px;align-items:center;padding:16px 6px;border-radius:17px;background:#e5edf1;border-color:#cfdee4}.islands button:nth-child(2){background:#e7eee1;border-color:#d4dfca}.islands button:nth-child(3){background:#f5ebd3;border-color:#e8dbb8}.islands button[aria-pressed=true]{outline:2px solid #3b7063;outline-offset:3px}.islands span{font-size:18px}.islands small{font-size:11px;color:#526862}.shelf-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:16px}.shelf-head>button{font-size:13px}.book-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.book-card{text-align:left;padding:0;overflow:hidden;border:1px solid #d6dfd5;background:var(--paper);border-radius:19px;position:relative;transition:transform .15s;box-shadow:0 4px 9px #29493b04}.book-card:hover{transform:translateY(-3px)}.book-cover{height:126px;display:grid;place-items:center;background:radial-gradient(ellipse at center,#fff6df 0 27%,transparent 28%),linear-gradient(135deg,#dfede7,#c8e0df);font-size:55px;border-bottom:1px solid #d9e3d6}.book-card:nth-child(3n+2) .book-cover{background-color:#eae6d6;background-image:radial-gradient(ellipse at center,#fff6df 0 27%,transparent 28%),linear-gradient(135deg,#e8edda,#e5dfc7)}.book-card:nth-child(3n) .book-cover{background-image:radial-gradient(ellipse at center,#fff6df 0 27%,transparent 28%),linear-gradient(135deg,#f0e5d9,#e4cfc4)}.book-info{padding:14px;display:block}.book-info strong{display:block;font-family:Georgia,serif;font-size:18px;line-height:1.3;min-height:24px}.book-info small{display:block;font-size:12px;color:var(--muted);margin:5px 0 12px}.book-status{font-size:11px;color:#526b60;display:flex;justify-content:space-between;gap:4px}.book-heart{position:absolute;right:12px;top:10px;font-size:22px;color:#924c37}.week-card{margin-top:28px;background:#f9fbf5;border:1px solid var(--line);padding:22px;border-radius:22px}.week-card .shelf-head span{font-size:12px;color:var(--muted)}.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.calendar span{text-align:center;font-size:11px;color:var(--muted)}.calendar b{display:grid;place-items:center;width:36px;height:36px;margin:6px auto 0;border-radius:50%;background:#e9eee4;font-size:15px;color:#5d7267}.calendar .read b{background:#dce9d1;color:#345b3b}.calendar .today b{outline:1px solid #738c72;outline-offset:3px}.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.badges span{background:#f3e8ce;padding:8px 12px;border-radius:10px;font-size:12px}.parent-link{display:block;width:100%;margin-top:20px;text-align:left;background:transparent}.notice{background:#fff2d9;padding:14px;border-radius:12px;line-height:1.7;margin:14px 0;color:#694523;font-size:14px}footer{text-align:center;color:var(--muted);font-size:11px;line-height:2;padding:24px 0 0}.reader-top{display:flex;justify-content:space-between;gap:8px;margin:22px 0}#reader{max-width:680px;margin:auto}#reader h1{font-family:Georgia,serif}#reader .eyebrow{margin-top:26px}.page-progress{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--muted);margin:20px 0 12px}.page-progress div{display:flex;gap:6px}.page-progress i{width:8px;height:8px;border-radius:50%;background:#c9d7cb}.page-progress i.on{background:var(--accent)}.page-card{background:var(--paper);border:1px solid var(--line);border-radius:24px;overflow:hidden;text-align:center;padding-bottom:18px}.scene{min-height:200px;background:radial-gradient(ellipse at 50% 90%,#afc8a6 0 35%,transparent 36%),linear-gradient(#e0eeeb,#f0f0de);display:flex;justify-content:center;align-items:center;gap:24px;padding:26px;font-size:72px;position:relative}.scene span:nth-child(2){transform:translateY(18px);font-size:60px}.scene span:nth-child(3){transform:translateY(-22px);font-size:50px}.sentence{padding:22px 16px 8px;line-height:1.7;text-align:center;font-family:Georgia,serif;font-size:calc(28px * var(--reading-size));color:#243f3c}.word{display:inline;padding:6px 3px;min-height:48px;line-height:1.7;font:inherit;border:0;border-radius:6px;background:none;color:inherit;font-weight:500;text-decoration:underline;text-decoration-color:#b6c7ba;text-underline-offset:7px;text-decoration-thickness:1px}.word.active{background:#f6e1aa;text-decoration:none}.tap-hint{font-size:11px;color:var(--muted);margin:2px 0 14px}.word-help{background:#f0f3e8;margin:0 18px;padding:12px;border-radius:12px;font-size:15px;min-height:48px;line-height:1.6}.text-button{border:0;background:none;font-size:12px;color:var(--muted);margin-top:8px}.page-hint{font-size:15px;line-height:1.8;padding:0 20px}.reader-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.reader-actions button{min-height:56px}.page-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;position:sticky;bottom:0;background:#eef5f2f5;border-top:1px solid var(--line);padding:14px 0 calc(14px + env(safe-area-inset-bottom));margin-top:22px}.page-nav span{font-size:11px;color:var(--muted)}.celebration{max-width:540px;text-align:center;margin:36px auto;padding:32px 16px;background:var(--paper);border-radius:28px;border:1px solid var(--line)}.celebrate-art{font-size:70px;margin-bottom:24px;animation:float 3s ease-in-out infinite}.earned-star{font-size:72px;color:#bb8121;text-shadow:0 5px 24px #eac66c55;margin:18px 0}.celebration p{line-height:1.8}.celebration small{font-size:11px;color:var(--muted)}.celebrate-buttons{display:flex;flex-direction:column;gap:12px;margin:26px 10px}.celebrate-buttons button{min-height:52px}.celebration h1{font-size:27px}dialog{width:min(480px,calc(100% - 32px));max-height:85dvh;overflow:auto;border:1px solid var(--line);border-radius:23px;background:var(--paper);color:var(--ink);padding:24px}dialog::backdrop{background:#203e3966;backdrop-filter:blur(3px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px}.dialog-head button{padding:4px;min-width:48px}dialog label{display:block;margin:20px 0;font-size:14px}select{display:block;width:100%;min-height:48px;margin-top:8px;border:1px solid var(--line);border-radius:10px;padding:8px;background:white;color:var(--ink)}.check-label{display:flex;align-items:center;min-height:48px}.check-label input{width:24px;height:24px;vertical-align:middle;margin-right:12px}.report{padding:16px;background:#eef3e8;border-radius:14px;margin:14px 0}.report h3{font-size:16px;margin:0 0 10px}.report p{font-size:14px;line-height:1.9}.empty{grid-column:1/-1;padding:28px;text-align:center;line-height:1.8;color:var(--muted)}[hidden]{display:none!important}body.contrast{--ink:#142b25;--muted:#31483e;--line:#587064;--accent:#164f40;background:#fff;color:var(--ink)}body.contrast .muted,body.contrast small,body.contrast .book-status,body.contrast .tap-hint{color:#31483e}body.contrast .word{text-decoration-color:#31483e}@keyframes float{50%{transform:translateY(-8px)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media(max-width:600px){.shell{padding:0 18px 20px}.topbar{padding:12px 0}.brand{font-size:9px;letter-spacing:1px}.heading{padding-top:24px}.heading h1{font-size:25px}.heading .muted{font-size:12px}.heading>button{font-size:0;min-width:48px;padding:10px}.heading>button::before{content:'🔊';font-size:20px}.harbor{padding:20px;min-height:273px}.harbor h2{font-size:22px;max-width:150px;line-height:1.4}.harbor-copy{max-width:65%}.harbor-art{width:56%;right:-22px;bottom:27px;opacity:.95}.harbor-copy p{max-width:170px;font-size:12px}.voyage-count strong{font-size:34px}.tower-lights{gap:3px;margin-top:18px;flex-wrap:wrap}.tower-lights i{flex:0 0 calc((100% - 36px)/13);height:5px}.islands{gap:10px;margin:23px 2px}.islands span{font-size:16px}.islands small{font-size:10px}.book-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.book-cover{height:112px;font-size:48px}.book-info{padding:12px}.book-info strong{font-size:17px;min-height:44px}.week-card{padding:16px}.shelf-head h2{font-size:18px}.calendar b{width:30px;height:30px}.resume-box{padding:14px}.resume-box strong{font-size:14px}.scene{min-height:180px;font-size:62px;gap:17px}.scene span:nth-child(2){font-size:52px}.scene span:nth-child(3){font-size:44px}.sentence{padding:18px 12px 8px;font-size:calc(25px * var(--reading-size))}.page-nav span{display:none}.reader-actions button{padding:10px 5px;font-size:14px}#reader h1{font-size:28px}.page-nav button{min-width:115px}footer{font-size:10px}}
/* Keep the listening controls within reach on portrait phones. */
.word{display:inline-block;min-width:44px;min-height:48px}
@media(max-width:600px){.reader-top{margin:12px 0}#reader .eyebrow{margin-top:14px}.scene{min-height:140px}.page-progress{margin-top:14px}.page-nav{margin-top:14px}}
