:root{font-family:Arial,sans-serif;color:#183c3e;background:#f7f7ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;font-weight:700;border:1px solid #c5d4ce;border-radius:12px;background:white;color:#174e4e;padding:13px 22px;cursor:pointer}button:hover{background:#eaf2ed}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,#words:focus-visible{outline:3px solid #da9b2b;outline-offset:4px}[hidden]{display:none!important}header{display:flex;align-items:center;gap:28px;padding:25px 5%;border-bottom:1px solid #dce3d9;background:#fffefa}.brand{font-size:31px;font-weight:800;color:#216d68;text-decoration:none;letter-spacing:-1.5px}.brand>span:first-child{color:#c68a26}.dot{color:#c68a26}.tagline{color:#637675;font-size:14px}header>button{margin-left:auto}main{max-width:1500px;margin:auto;padding:32px 5%}#welcome{position:relative;min-height:510px;padding:55px 0 70px;width:100%;overflow:hidden}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;color:#617969}h1{letter-spacing:-1.3px;font-size:48px;line-height:1.12;font-weight:650;margin:22px 0}#welcome p{color:#61716c;font-size:17px;line-height:1.8}.primary{background:#216d68;color:white;border:0;padding:17px 24px;margin-top:15px}.primary:hover{background:#175550}.primary span{margin-left:28px}.hint{font-size:12px!important}.book-art{position:absolute;right:2%;top:95px;display:flex;transform:rotate(8deg);width:42%;height:280px;box-shadow:8px 22px 0 #dfe8d7;border-radius:12px;overflow:hidden}.book-art>div{width:50%;padding:35px 20px;background:#e5ecd9;font-size:27px;line-height:1.6;color:#326b60}.book-art>div:first-child{border-right:2px solid #c9d6bd;background:#f1dbac}.book-art span{font-size:21px}.book-art em{font-family:Georgia,serif}.book-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.book-heading h1{font-size:27px;margin:8px 0}.sizes{display:flex;gap:8px}.sizes button{padding:12px 17px}.spread{display:grid;grid-template-columns:1fr 1fr;gap:20px;min-height:410px;height:58vh;max-height:750px}figure{margin:0;display:flex;flex-direction:column;justify-content:center;min-width:0;border-radius:18px;background:#e6ecdf;overflow:hidden}figure img{width:100%;max-height:calc(100% - 38px);object-fit:contain}figcaption{font-size:12px;text-align:center;padding:12px;color:#4b685a}.reading-panel{background:white;border:1px solid #dce3d9;border-radius:18px;display:flex;flex-direction:column;min-height:0;overflow:hidden}.reading-heading{display:flex;justify-content:space-between;gap:10px;padding:17px 22px;border-bottom:1px solid #edf0e8;font-size:12px;color:#62746c}#words{font-size:28px;line-height:1.8;padding:24px 30px;overflow:auto;white-space:pre-wrap;color:#000;flex:1}#words .word{display:inline;padding:0;border:0;background:transparent;color:#000;font:inherit;font-weight:400;border-radius:3px}#words .word:hover{background:#e3f0e8}#words .chosen{background:#ffe3a2}nav{display:flex;align-items:center;justify-content:space-between;margin-top:24px;gap:12px}#counter{font-size:13px;color:#61716c}#status{font-size:13px;color:#536c60}#error{color:#9c3528}footer{text-align:center;color:#849184;font-size:12px;padding:20px} @media(max-width:800px){header{gap:10px;padding:18px 5%}.tagline{display:none}.brand{font-size:25px}header button{font-size:12px;padding:11px}#welcome{padding-top:25px}h1{font-size:38px}.book-art{position:relative;width:85%;height:230px;top:auto;right:auto;margin:40px auto 20px}.spread{grid-template-columns:1fr;height:auto;max-height:none;min-height:0}figure{height:30vh;min-height:180px}.reading-panel{height:45vh;min-height:260px}.book-heading h1{font-size:22px}#words{padding:20px}.reading-heading{font-size:11px;padding:15px}.sizes button{padding:10px}nav button{padding:12px 15px}}
/* Welcome artwork and approved brand. */
.brand{display:block;flex-shrink:0;line-height:0}.brand img{width:230px;height:auto;max-height:80px;object-fit:contain}#welcome{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(0,1.35fr);gap:42px;align-items:center;padding:38px 0 45px;overflow:visible}.welcome-copy h1{font-size:clamp(32px,3.5vw,48px)}.welcome-gallery{min-width:0}.slideshow{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:20px;background:#e5ecd9;box-shadow:0 18px 45px #244c381a}.slideshow img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .9s ease}.slideshow #slide-back{opacity:0}.slideshow #slide-back.visible{opacity:1}#slideshow-toggle{position:absolute;z-index:2;right:12px;bottom:12px;padding:9px 13px;font-size:12px;background:#fffef5ed;border:1px solid #ffffff80;box-shadow:0 2px 10px #0002}.gallery-phrases{text-align:center;padding:15px 0 0}.gallery-phrases p{margin:3px 0!important;font-size:15px!important;line-height:1.6!important;color:#326b60!important}.gallery-phrases p:first-child{font-size:12px!important;font-weight:bold;letter-spacing:2px}.gallery-phrases em{font-family:Georgia,serif;font-size:19px}@media(max-width:900px){header{gap:18px}.tagline{display:none}#welcome{grid-template-columns:1fr;gap:25px;padding-top:15px}.welcome-copy h1{font-size:38px}.welcome-gallery{width:100%;max-width:720px;margin:auto}.brand img{width:190px}}@media(prefers-reduced-motion:reduce){.slideshow img{transition:none}}
/* Fit the welcome and reading workspaces to the available viewport. */
html{height:100%;overflow:hidden}body{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}header{flex:0 0 auto;padding:10px 4%;gap:22px}.brand img{width:180px;max-height:56px}header button{padding:10px 18px}body.welcome-mode header{display:none}main{width:100%;flex:1;min-height:0;max-width:1500px;padding:16px 4%;display:flex;flex-direction:column}footer{flex:0 0 auto;padding:10px;font-size:11px}#welcome{flex:1;min-height:0;width:100%;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:34px;padding:10px 0}.welcome-copy{min-width:0}.welcome-brand img{width:clamp(185px,24vw,310px);max-height:95px;object-fit:contain;object-position:left center}.welcome-brand p{font-size:13px!important;margin:0 0 20px!important;line-height:1.4!important}.welcome-copy h1{font-size:clamp(27px,3vw,43px);margin:12px 0 18px}.welcome-copy>p{font-size:15px!important;line-height:1.6!important;margin:12px 0}.welcome-copy .primary{margin-top:9px;padding:14px 23px}.welcome-copy .hint{font-size:11px!important}.welcome-copy .gallery-phrases{text-align:left;padding-top:10px}.welcome-gallery{display:flex;align-items:center;justify-content:center;min-height:0;height:100%;max-width:none}.slideshow{width:min(100%,calc((100dvh - 170px)*1.5));max-height:calc(100dvh - 170px);flex-shrink:1}.book-heading{flex:0 0 auto;margin-bottom:12px}.book-heading h1{font-size:24px;margin:6px 0}.spread{flex:1;min-height:0;height:auto;max-height:none}figure{height:auto;min-height:0}.reading-panel{height:auto;min-height:0}nav{flex:0 0 auto;margin-top:12px}nav button{padding:10px 18px}#reader{display:flex;flex-direction:column;flex:1;min-height:0}#status,#error{flex:0 0 auto;margin:8px 0 0;font-size:12px}#status:empty,#error:empty{display:none}#words{min-height:0}body:not(.welcome-mode) footer{display:none}@media(max-height:700px){.welcome-brand img{max-height:65px;width:240px}.welcome-brand p{margin-bottom:10px!important}.welcome-copy h1{font-size:30px;margin:8px 0 10px}.welcome-copy>p{font-size:13px!important;margin:8px 0}.welcome-copy .primary{padding:12px 20px}.welcome-copy .gallery-phrases{padding-top:3px}.slideshow{width:min(100%,calc((100dvh - 110px)*1.5));max-height:calc(100dvh - 110px)}footer{padding:6px}header{padding:6px 4%}.brand img{max-height:44px}.book-heading h1{font-size:20px}.reading-heading{padding:10px 15px}}@media(max-width:650px){#welcome{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:10px;padding:0}.welcome-brand img{width:180px;max-height:54px}.welcome-brand p{display:none}.welcome-copy h1{font-size:23px;margin:8px 0}.welcome-copy h1 br{display:none}.welcome-copy>p{font-size:12px!important;line-height:1.4!important;margin:6px 0}.welcome-copy .primary{margin:3px 0;padding:10px 18px}.welcome-copy .gallery-phrases{padding:0}.gallery-phrases p{font-size:12px!important}.gallery-phrases p:first-child{font-size:10px!important}.gallery-phrases em{font-size:14px}.welcome-gallery{height:100%;min-height:0}.slideshow{height:100%;width:auto;max-width:100%;max-height:100%;aspect-ratio:3/2}.spread{grid-template-columns:1fr;grid-template-rows:minmax(0,.8fr) minmax(0,1.2fr);gap:10px}.book-heading h1{font-size:18px}.book-heading .eyebrow{display:none}.reading-heading{padding:8px 12px}#words{padding:14px 18px}footer{font-size:9px;padding:5px}}
@media(min-width:651px){.slideshow{width:min(86%,calc((100dvh - 170px)*1.5))}}
.welcome-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:9px 0}.welcome-actions .primary{margin:0}.welcome-actions>button{padding:13px 19px;font-size:14px}.welcome-actions .primary span{margin-left:12px}@media(max-height:700px){.welcome-actions{gap:8px;margin:6px 0}.welcome-actions>button{font-size:13px;padding:11px 15px}}@media(max-width:650px){.welcome-actions>button{font-size:12px;padding:9px 12px}}