#lesson.art-notebook{position:fixed!important;inset:auto 0 -18px!important;margin:0 auto!important;width:min(99vw,1500px)!important;height:calc(100dvh - 5px)!important;max-width:none!important;max-height:none!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;overflow:visible!important;color:#243e50;font-family:'Avenir Next',Avenir,system-ui,sans-serif}
#lesson.art-notebook:before,#lesson.art-notebook:after,#lesson.art-notebook>header,#lesson.art-notebook>footer,#lesson.art-notebook #lesson-portrait{display:none!important}
#lesson.art-notebook .art-book-pages{position:absolute!important;inset:0!important;display:block!important;margin:0!important;padding:0!important;height:100%!important;max-height:none!important;overflow:hidden!important;background:url('assets/notebook/open.png') center/100% 100% no-repeat!important;filter:drop-shadow(0 8px 22px #182b2a65)}
.art-notebook .entry-index,.art-notebook .notebook-page{position:absolute!important;top:7%!important;bottom:24px!important;height:auto!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0 12px 32px!important;overflow:auto!important;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin;min-width:0!important;display:block!important}
.art-notebook .entry-index{left:13%!important;width:39%!important}.art-notebook .notebook-page{left:55%!important;width:41%!important}.art-notebook .entry-index:after{display:none!important}
.book-rail{position:absolute;left:1.8%;width:9.4%;top:10%;bottom:30px;display:flex;flex-direction:column;gap:5px;overflow:auto;touch-action:pan-y;scrollbar-width:none}.rail-tab{flex:1;min-height:47px;border:1px solid #877b6133;background:#f8f0e359;box-shadow:inset 0 1px #fff8;border-radius:7px;color:#354b54;padding:7px 1px;font-size:clamp(10px,1.2vw,15px);line-height:1.4;white-space:pre-line}.rail-tab[aria-pressed=true]{background:#b9c8bacc;border-color:#81958b66}.rail-icon{display:block;font-size:19px;margin-bottom:2px}.book-fold{margin-top:6px;flex:.8}
.book-title{font-size:22px;font-weight:600;margin:0 0 2px}.book-subtitle{font-size:12px;opacity:.65;margin:0 0 16px}.book-section-title{font:500 23px 'Avenir Next',sans-serif;margin:0 0 12px}.book-view-tabs{display:flex;margin:0 0 12px;border:1px solid #9b907639;border-radius:6px;background:#c0b69d12}.book-view-tabs button{flex:1;min-width:0;min-height:38px;font-size:12px;padding:6px 2px;background:transparent;color:#546470;border-radius:5px}.book-view-tabs button[aria-pressed=true]{background:#fff7e9a8;color:#213f52;box-shadow:0 0 0 1px #b6a4875c}
.book-context-heading{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;min-height:45px;background:none;border-bottom:1px solid #ae9b752b;font-size:14px;color:#294252;padding:6px 3px}.book-context-heading small{font-size:10px;opacity:.6}.book-item{position:relative;display:block;width:100%;text-align:left;padding:9px 22px 9px 14px;min-height:52px;background:none;border-radius:5px;color:#274354}.book-item[aria-pressed=true]{background:#d6e2e8a8}.book-item-jp{display:block;font-size:15px;line-height:1.5}.book-item small{display:block;font-size:11px;color:#65717a;margin-top:2px}.book-item-mark{position:absolute;right:5px;top:12px}.book-empty{font-size:13px;color:#788079;line-height:1.6}.book-crumb{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#687680;margin-bottom:20px}.book-save{font-size:23px;background:none;color:#274758;min-width:40px;min-height:40px;padding:0}.book-entry-title{font:500 clamp(24px,2.6vw,37px)/1.5 'Hiragino Sans','Yu Gothic',sans-serif;margin:0 0 10px;overflow-wrap:anywhere}.book-reading{font-size:15px;color:#637585;margin:0 0 8px}.book-meaning{font-size:17px;line-height:1.6;margin:0 0 20px}.book-detail-section{border:1px solid #ac9c7a2e;border-radius:7px;padding:13px 14px;margin:14px 0;background:#fffaf52b}.book-detail-section h3{font-size:13px;font-weight:600;margin:0 0 6px}.book-detail-section p{font-size:13px;color:#5c6e78;line-height:1.65;margin:5px 0}.book-example+.book-example{border-top:1px solid #ac9c7a2e;padding-top:9px}.book-memory{background:#becbb12e}.book-reference{font-size:11px;color:#7e8172}
#lesson.art-notebook.cover-state{inset:0!important;width:100vw!important;height:100dvh!important}.cover-state .art-book-pages{background:none!important;overflow:visible!important}.held-notebook{position:absolute;height:108vh;width:88vh;max-width:94vw;left:50%;bottom:-5vh;transform:translateX(-50%);animation:book-pickup .42s ease-out}.held-notebook>img{width:100%;height:100%;object-fit:fill;pointer-events:none}.cover-bookmark{position:absolute;left:78%;width:12.5%;height:9.8%;border:0;background:none;color:#34444c;font-size:clamp(10px,1.8vh,15px);padding:0;min-height:0}.bookmark-0{top:12.6%}.bookmark-1{top:23%}.bookmark-2{top:33.4%}.bookmark-3{top:43.8%}.cover-bookmark:focus-visible,.cover-bookmark:hover{background:#fff4da55;border-radius:10px}.book-back-world{position:absolute;left:max(20px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));background:#203c3b99;color:#fff3df;border:1px solid #fff4;border-radius:20px;padding:10px 18px;min-height:42px;font-size:13px}
@keyframes book-pickup{from{opacity:0;transform:translate(-50%,12%) rotate(-4deg)}to{opacity:1;transform:translate(-50%,0) rotate(0)}}
@media(max-height:500px){.book-title{font-size:18px}.book-subtitle{font-size:10px;margin-bottom:9px}.book-section-title{font-size:18px;margin-bottom:8px}.book-crumb{margin-bottom:10px}.book-entry-title{font-size:25px}.book-reading{font-size:13px}.book-meaning{font-size:14px}.rail-icon{font-size:15px;margin:0}.rail-tab{min-height:42px;font-size:10px;padding:4px 0}.book-rail{gap:3px}.book-detail-section{padding:10px}.book-detail-section p{font-size:12px}.art-notebook .entry-index,.art-notebook .notebook-page{padding-left:8px!important;padding-right:8px!important}.book-view-tabs button{font-size:11px}.book-item-jp{font-size:14px}}
.large-text .art-notebook .book-item-jp,.large-text .art-notebook .book-detail-section p{font-size:18px}.large-text .book-view-tabs button{font-size:13px}.large-text .book-item small{font-size:14px}
@media(prefers-reduced-motion:reduce){.held-notebook{animation:none}}
#lesson.art-notebook.cover-state .art-book-pages{background:none!important;overflow:visible!important}
#lesson.art-notebook #lesson-body:after,#lesson.art-notebook #lesson-body:before{display:none!important}
body.in-notebook #canvas{filter:blur(2px) brightness(.82)}
/* The held book keeps its top edge in view while its cuffs sit below the screen. */
.held-notebook{height:125dvh;width:101.9dvh;max-width:none;top:-6.5dvh;bottom:auto;animation:none}
.cover-close{position:absolute;left:78%;top:55.2%;width:14.5%;height:8%;min-height:38px;padding:0 5px;border:1px solid #a99574;border-radius:7px;background:#e6d9c4;color:#34444c;box-shadow:2px 3px 5px #34251435;font-size:clamp(12px,2vh,16px)}
.art-notebook .notebook-page{padding-left:18px!important;padding-right:18px!important;padding-bottom:48px!important}
.book-crumb{margin-bottom:26px;line-height:1.6;gap:12px}
.book-entry-title{font-size:clamp(30px,3.2vw,44px);line-height:1.5;margin-bottom:13px;font-weight:500}
.book-reading{font-size:16px;line-height:1.7;margin:0 0 17px;color:#74818b}
.book-meaning{font-size:20px;line-height:1.65;margin:0 0 30px}
.book-detail-section{margin:24px 0;padding:19px 18px;border-color:#ac9c7a22;background:#fffaf51c}
.book-detail-section h3{font-size:14px;line-height:1.6;margin:0 0 13px;color:#526978;font-weight:500}
.book-detail-section p{font-size:15px;line-height:1.8;margin:0}
.book-detail-section .example-japanese{font-size:18px;line-height:1.8;color:#294354;margin-bottom:7px}
.book-detail-section .example-translation{font-size:14px;line-height:1.7;color:#74818b}
.book-example+.book-example{padding-top:17px;margin-top:17px}
.book-reference{margin-top:28px;font-size:11px;line-height:1.7}
@media(max-height:500px){.book-crumb{margin-bottom:18px}.book-entry-title{font-size:30px}.book-reading{font-size:14px;margin-bottom:12px}.book-meaning{font-size:17px;margin-bottom:24px}.book-detail-section{padding:15px 14px;margin:20px 0}.book-detail-section p{font-size:14px}.book-detail-section .example-japanese{font-size:17px}.art-notebook .notebook-page{padding-left:12px!important;padding-right:12px!important}}
/* The original cover/hand alpha masks this bookmark, including every hover state. */
.held-notebook{isolation:isolate;transform-origin:53% 82%}
.held-notebook>img{position:absolute;inset:0;z-index:1}
.cover-bookmark{z-index:2}
.cover-close{z-index:0;left:76.8%;top:53.8%;width:16.7%;height:8.8%;padding-left:9%;padding-right:.9%;min-height:0;border-radius:0 9px 9px 0;border-color:#b4b5a8;background:linear-gradient(105deg,#cecec1,#deded2 58%,#e2e2d7);box-shadow:1px 2px 3px #34251425;font-size:clamp(10px,1.8vh,13px)}
.cover-close:hover,.cover-close:focus-visible{background:linear-gradient(105deg,#d8d8cb,#e8e8dd 58%,#edede4);border-color:#a5ae9c}
.cover-close:active{background:linear-gradient(105deg,#bdc5b8,#cdd2c7);transform:none}

/* The open-book index uses the cover's paper bookmark palette and tucked roots. */
.book-rail{left:-.1%;width:10.5%;top:12%;bottom:30px;gap:clamp(6px,1.2vh,10px);overflow:visible;isolation:isolate}
.book-rail .rail-tab{--bookmark:#deded2;position:relative;flex:0 0 clamp(44px,10vh,76px);min-height:44px;width:100%;padding:6px 14px 6px 4px;border:1px solid #9e9c866b;border-right:0;border-radius:10px 0 0 10px;background:linear-gradient(105deg,#fff2,transparent 65%),var(--bookmark);box-shadow:0 2px 3px #34251425,inset 0 1px #ffffffe0;color:#34444c;font-family:'Avenir Next',Avenir,sans-serif;font-size:clamp(10px,1.2vw,15px);font-weight:400;line-height:1.4;white-space:nowrap;transition:transform .18s ease,width .18s ease,filter .18s ease}
.book-rail .rail-tab:after{content:'';position:absolute;inset:0 0 0 auto;width:12px;background:linear-gradient(90deg,transparent,#57482e40);pointer-events:none}
.book-rail .rail-bookmark-0{--bookmark:#ccd6b3}.book-rail .rail-bookmark-1{--bookmark:#e7dcc8}.book-rail .rail-bookmark-2{--bookmark:#d3dddf}.book-rail .rail-bookmark-3{--bookmark:#dfcac6}
.book-rail .rail-tab:hover,.book-rail .rail-tab:focus-visible{filter:brightness(1.05);background:linear-gradient(105deg,#fff4,transparent 65%),var(--bookmark)}
.book-rail .rail-tab[aria-pressed=true]{transform:translateX(-6px);width:calc(100% + 6px);border-color:#7f8e7b99;background:linear-gradient(105deg,#fff3,transparent 65%),var(--bookmark);font-weight:600}
.book-rail .rail-tab:active{filter:brightness(.98)}
.book-rail .book-fold{--bookmark:#deded2;margin-top:0;font-size:clamp(10px,1.1vw,14px)}
@media(max-height:500px){.book-rail{gap:6px}.book-rail .rail-tab{border-radius:8px 0 0 8px;padding-right:10px;padding-left:2px}}
@media(prefers-reduced-motion:reduce){.book-rail .rail-tab{transition:none}}