:root{--bg:#f4efe3;--paper:#fffdf7;--ink:#1f1b16;--muted:#6b6257;--accent:#b7572e;--shelf-dark:#5c371f;--shelf-light:#7f4e2d;--line:#dfd4c5}*{box-sizing:border-box}body,html{margin:0;padding:0;color:var(--ink);background:radial-gradient(circle at 10% 10%,#fffef9 0,#f3ecde 55%,#ece2d2 100%);font-family:Avenir Next,Noto Sans JP,sans-serif}a{color:inherit;text-decoration:none}main{min-height:100dvh}.container{width:min(1100px,100% - 2rem);margin:0 auto}.page-header{position:-webkit-sticky;position:sticky;top:0;z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgb(244 239 227/85%);border-bottom:1px solid var(--line)}.page-header-inner{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 0}.brand{font-family:Baskerville,"Noto Serif JP",serif;font-size:1.3rem;letter-spacing:.04em}.nav{display:flex;gap:.9rem;color:var(--muted);font-size:.92rem}.nav-mobile{display:none}.page-footer{border-top:1px solid var(--line);background:rgb(244 239 227/78%)}.page-footer-inner{display:flex;justify-content:space-between;align-items:center;min-height:56px;color:var(--muted);font-size:.88rem}.footer-version{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.hero{padding:4rem 0 2rem}.hero-brand{display:inline-flex;align-items:center;gap:.7rem}.hero-brand img{display:block}.hero-brand-logo{width:clamp(154px,27vw,294px);height:auto}.hero h1{margin:0 0 .6rem;font-family:Baskerville,"Noto Serif JP",serif;font-size:clamp(2rem,4.2vw,3rem)}.hero p{margin:0;color:var(--muted)}.home-shelf-main{padding:1.1rem 0 2rem}.home-shelf-frame{position:relative;isolation:isolate;border-radius:18px;border:1px solid rgb(78 46 23/60%);padding:1rem;background-color:#6a4026;background-image:url(/backgrounds/shelf-wood.png),linear-gradient(180deg,rgb(28 16 8/26%),rgb(255 220 168/7%) 18%,rgb(0 0 0/24%));background-size:480px auto,cover;background-position:50%,50%;background-repeat:repeat,no-repeat;background-blend-mode:soft-light,normal;box-shadow:inset 0 1px 0 rgb(255 230 198/28%),inset 0 -14px 24px rgb(36 21 11/30%),0 14px 28px rgb(33 20 10/18%)}.home-shelf-frame:before{inset:.45rem;border-radius:14px;border:1px solid rgb(255 226 178/24%);box-shadow:inset 0 1px 0 rgb(255 236 196/24%),inset 0 -2px 0 rgb(47 28 15/46%)}.home-shelf-frame:after,.home-shelf-frame:before{content:"";position:absolute;pointer-events:none;z-index:0}.home-shelf-frame:after{inset:0;border-radius:18px;background:radial-gradient(circle at 50% 14%,rgb(255 220 170/10%) 0,transparent 42%),linear-gradient(90deg,rgb(25 15 9/32%),transparent 10%,transparent 90%,rgb(25 15 9/34%))}.home-shelf-row{position:relative;z-index:1;border-radius:12px;padding:1rem 1rem 1.25rem;background-color:#8a5a37;background-image:linear-gradient(180deg,rgb(255 241 212/14%),rgb(24 14 8/20%)),url(/backgrounds/shelf-wood.png);background-size:cover,360px auto;background-position:50%,50%;background-repeat:no-repeat,repeat;background-blend-mode:soft-light,multiply;border:1px solid rgb(145 111 78/35%);box-shadow:inset 0 1px 0 rgb(255 255 255/58%),inset 0 -16px 24px rgb(22 13 7/30%)}.home-shelf-row+.home-shelf-row{margin-top:1rem}.home-shelf-row:after{content:"";position:absolute;left:.7rem;right:.7rem;bottom:-.64rem;height:1.06rem;border-radius:0 0 11px 11px;background:linear-gradient(180deg,rgb(255 224 174/54%) 0 2px,transparent 2px),linear-gradient(180deg,#7f4f2f,#5a351f 58%,#432815);box-shadow:0 8px 14px rgb(20 12 7/28%),inset 0 1px 0 rgb(255 231 193/34%);z-index:0}.home-shelf-row:before{content:"";position:absolute;left:.9rem;right:.9rem;top:0;height:.95rem;border-radius:11px 11px 0 0;background:linear-gradient(180deg,rgb(255 236 201/12%),transparent);pointer-events:none;z-index:0}.home-shelf-row>*{position:relative;z-index:1}.home-shelf-row:last-child:after{display:none}.home-shelf-row-hero .hero{padding:.35rem 0 .2rem}.home-shelf-row-hero .hero h1,.home-shelf-row-hero .hero p,.library-hero-row h1,.library-hero-row p,.marketing-steps>h2{color:#f8ecda;text-shadow:0 1px 2px rgb(24 13 7/58%)}.home-primary-grid .card,.marketing-steps-grid .marketing-step-card{border-color:#cdbca6;background-color:#fbf4e6;background-image:linear-gradient(180deg,rgb(255 255 255/38%),rgb(246 233 212/58%)),url(/backgrounds/paper.png);background-size:cover,220px auto;background-repeat:no-repeat,repeat;background-position:50%,50%;background-blend-mode:normal,multiply;box-shadow:inset 0 1px 0 rgb(255 255 255/72%),0 10px 18px rgb(37 23 12/22%),inset 0 2px 0 rgb(255 245 226/45%)}.book-panel{--spine-w:14px;position:relative;display:block;padding:0;overflow:hidden}.book-panel-content{width:calc(100% - var(--spine-w));max-width:calc(100% - var(--spine-w));margin-right:var(--spine-w);padding:1rem .95rem 1rem 1rem;display:grid;grid-gap:.8rem;gap:.8rem;align-content:start}.book-panel-spine{position:absolute;top:0;right:0;bottom:0;width:var(--spine-w);writing-mode:vertical-rl;-webkit-text-orientation:mixed;text-orientation:mixed;display:flex;align-items:center;justify-content:center;font-family:Baskerville,"Noto Serif JP",serif;font-size:0;color:transparent;border-left:1px solid rgb(107 66 39/54%);background:linear-gradient(90deg,rgb(11 15 24/92%),rgb(8 11 19/94%) 46%,rgb(5 8 14/95%)),url(/backgrounds/spine.png);background-size:cover,120px auto;background-position:50%,50%;background-repeat:no-repeat,repeat;background-blend-mode:normal,screen;box-shadow:-7px 0 10px rgb(0 0 0/18%),inset -2px 0 0 rgb(255 233 176/20%),inset -1px 0 0 rgb(0 0 0/26%),inset 1px 0 0 rgb(255 240 185/18%),inset -1px 0 0 rgb(0 0 0/35%);text-shadow:0 0 1px rgb(255 236 174/36%);border-radius:0;overflow:hidden}.book-panel-spine:before{background-image:url(/backgrounds/spine.png);background-size:72px auto;background-repeat:repeat;background-position:50%;opacity:.62;mix-blend-mode:normal;filter:contrast(1.2) saturate(1.08)}.book-panel-spine:after,.book-panel-spine:before{content:"";position:absolute;inset:0;pointer-events:none}.book-panel-spine:after{background:linear-gradient(180deg,rgb(255 255 255/10%),rgb(0 0 0/18%)),linear-gradient(90deg,rgb(255 255 255/42%),rgb(255 248 218/22%) 8%,transparent 32%,transparent 74%,rgb(0 0 0/22%))}.book-panel-spine.tone-1{background-image:linear-gradient(90deg,#4a1d30,#3b1626 48%,#2c0f1c)}.book-panel-spine.tone-2{background-image:linear-gradient(90deg,#50371a,#3f2b13 48%,#2d1e0c)}.book-panel-spine.tone-3{background-image:linear-gradient(90deg,#1d3e61,#16314d 48%,#10243a)}.book-panel-spine.tone-4{background-image:linear-gradient(90deg,#2d4820,#223717 48%,#17270f)}.book-panel-spine.tone-5{background-image:linear-gradient(90deg,#5a2d18,#482313 48%,#35190d)}.marketing-steps{padding:.1rem 0 .2rem}.marketing-steps h2{margin:0 0 .75rem;font-family:Baskerville,"Noto Serif JP",serif;font-size:clamp(1.25rem,2.6vw,1.8rem)}.marketing-steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));grid-gap:.75rem;gap:.75rem}.marketing-step-card{position:relative;border:1px solid #d6cab8}.marketing-step-card h3{margin:0 0 .45rem;font-size:1rem}.marketing-step-image{display:block;width:100%;height:auto;margin-top:.65rem;border-radius:10px;border:1px solid #d8ccb9;background:#fff8eb}.grid{display:grid;grid-gap:1rem;gap:1rem}.card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:1rem;box-shadow:0 12px 26px rgb(77 56 26/7%)}.form-grid{display:grid;grid-gap:.7rem;gap:.7rem}.profile-panels{display:grid;grid-gap:.9rem;gap:.9rem}.profile-form textarea{min-height:120px}.profile-section{border:1px solid #ded4c6;border-radius:10px;padding:.75rem;display:grid;grid-gap:.65rem;gap:.65rem}.profile-section-title{margin:0;font-size:1rem}.profile-userid-row{display:flex;align-items:flex-end;gap:.55rem}.profile-userid-row label{flex:1 1 auto}.profile-userid-row button{flex:0 0 auto}.profile-public-url{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem}.profile-copy-btn{white-space:nowrap;padding:.46rem .72rem;border-radius:8px;font-size:.84rem}.app-toast{position:fixed;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:120;background:#d1e7dd;color:#0f5132;border:1px solid #badbcc;border-radius:10px;padding:.55rem .85rem;font-size:.88rem;box-shadow:0 10px 24px rgb(0 0 0/25%)}.app-toast--warning{background:#fff3cd;color:#664d03;border-color:#ffecb5}.app-toast--error{background:#f8d7da;color:#842029;border-color:#f5c2c7}.app-toast--success{background:#d1e7dd;color:#0f5132;border-color:#badbcc}.create-or{margin:0;text-align:center;letter-spacing:.08em}.create-steps{display:grid;grid-gap:.35rem;gap:.35rem}.create-step-current{margin:0;font-size:.9rem;font-weight:700;color:#3f3123}.create-steps span{border:1px solid #d8cdbb;background-color:#f7f3ea;background-image:linear-gradient(180deg,rgb(255 255 255/68%),rgb(243 235 220/80%)),url(/backgrounds/paper.png);background-size:cover,260px auto;background-repeat:no-repeat,repeat;background-position:50%,50%;border-radius:8px;padding:.42rem .6rem;font-size:.86rem;color:#786a58}.create-steps span.is-active{border-color:#6a4324;background:linear-gradient(180deg,#84552f,#5f3b21);color:#fff;font-weight:700;box-shadow:inset 0 0 0 1px rgb(255 222 175/32%),0 2px 8px rgb(48 30 16/26%)}.create-step-actions{display:flex;justify-content:space-between;gap:.5rem}.create-step-actions button{min-width:110px}.create-step-actions .is-secondary{background:#7b6e5e}.paste-preview{margin-top:.45rem;min-height:4.8rem;max-height:4.8rem;resize:none;background:#f7f3ea}.paste-preview:-moz-read-only{cursor:pointer}.paste-preview:read-only{cursor:pointer}.paste-preview-wrap{position:relative}.paste-count{position:absolute;top:.7rem;right:.7rem;z-index:1;font-size:.78rem;color:#7a6e61;background:rgb(255 255 255/72%);border:1px solid #d8cdbb;border-radius:999px;padding:.08rem .45rem}.modal-backdrop{position:fixed;inset:0;z-index:60;display:grid;place-items:center;background:rgb(15 12 9/48%);padding:1rem}.modal-card{width:min(520px,100%);background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:1rem;box-shadow:0 16px 36px rgb(0 0 0/24%)}.modal-card h3{margin:0 0 .6rem}.modal-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:.8rem}.modal-actions button:first-child{background:#7b6e5e}button,input,select,textarea{font:inherit}input,select,textarea{width:100%;border:1px solid #c9bda9;border-radius:10px;padding:.7rem .8rem;background:#fff}textarea{min-height:240px;resize:vertical}button{border:none;border-radius:10px;padding:.7rem 1rem;background:var(--accent);color:#fff;cursor:pointer}.library-hero-row h1{margin:0;font-family:Baskerville,"Noto Serif JP",serif;font-size:clamp(1.8rem,4.2vw,2.6rem)}.library-hero-row p{margin:.35rem 0 0}.library-book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-gap:.8rem;gap:.8rem}.library-book-panel{text-decoration:none;padding:0;min-height:280px;--cover-a:#1d3e61;--cover-b:#10243a;--cover-edge:#0b1b2a;--cover-gold:#d8ba70}.library-book-panel .book-panel-content{position:relative;overflow:hidden;min-height:280px;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle at 18% 12%,rgb(255 255 255/10%) 0,transparent 40%),linear-gradient(145deg,var(--cover-a) 0,var(--cover-b) 64%,var(--cover-edge) 100%),url(/backgrounds/spine.png);background-size:cover,cover,180px auto;background-repeat:no-repeat,repeat;border-right:1px solid rgb(28 18 10/46%);box-shadow:inset 0 1px 0 rgb(255 237 186/12%),inset 0 -10px 20px rgb(2 6 12/26%)}.library-book-panel .book-panel-content:before{content:"";position:absolute;inset:.6rem;border-radius:10px;border:1px solid rgb(218 188 118/64%);box-shadow:inset 0 0 0 1px rgb(245 223 167/40%),inset 0 0 0 7px rgb(15 28 43/36%),inset 0 0 0 8px rgb(218 188 118/44%);pointer-events:none}.library-book-panel .book-panel-content:after{content:"";position:absolute;inset:.88rem;border-radius:8px;border:1px solid rgb(215 183 111/42%);background:radial-gradient(circle at .6rem .6rem,rgb(216 186 112/86%) 0 2px,transparent 3px),radial-gradient(circle at calc(100% - .6rem) .6rem,rgb(216 186 112/86%) 0 2px,transparent 3px),radial-gradient(circle at .6rem calc(100% - .6rem),rgb(216 186 112/86%) 0 2px,transparent 3px),radial-gradient(circle at calc(100% - .6rem) calc(100% - .6rem),rgb(216 186 112/86%) 0 2px,transparent 3px),linear-gradient(90deg,transparent 18%,rgb(216 186 112/76%) 18% 82%,transparent 82%) top 1.22rem center /100% 1px no-repeat,linear-gradient(90deg,transparent 18%,rgb(216 186 112/76%) 18% 82%,transparent 82%) bottom 1.22rem center /100% 1px no-repeat;pointer-events:none}.library-book-title{margin:0;font-family:Baskerville,"Noto Serif JP",serif;font-size:1.1rem;line-height:1.6;padding:1rem .95rem .18rem;color:var(--cover-gold);text-align:center;text-wrap:balance;text-shadow:0 1px 0 rgb(0 0 0/35%),0 0 6px rgb(236 206 137/24%)}.library-open-chip{margin:0 auto;width:-moz-fit-content;width:fit-content;border-radius:999px;border:1px solid rgb(216 186 112/58%);background:rgb(8 17 27/32%);color:var(--cover-gold);font-size:.78rem;font-weight:700;letter-spacing:.02em;padding:.24rem .66rem;box-shadow:inset 0 1px 0 rgb(255 236 185/12%)}.library-book-panel.tone-1{--cover-a:#4a1d30;--cover-b:#32101f;--cover-edge:#210b15}.library-book-panel.tone-2{--cover-a:#583a1c;--cover-b:#38240f;--cover-edge:#261808}.library-book-panel.tone-3{--cover-a:#214973;--cover-b:#132f4c;--cover-edge:#0c2135}.library-book-panel.tone-4{--cover-a:#325326;--cover-b:#1f3618;--cover-edge:#14250f}.library-book-panel.tone-5{--cover-a:#63311a;--cover-b:#42200f;--cover-edge:#2b1509}.reader{width:min(900px,100% - 1.5rem);margin:1.2rem auto 2rem}.flip-reader{display:grid;grid-gap:.8rem;gap:.8rem;justify-items:center}.reader-immersive .page-footer,.reader-immersive .page-header{display:none}.reader.reader-immersive-container{width:100%;margin:0}.immersive-reader{width:100%;min-height:100dvh;position:relative;background:radial-gradient(circle at center,#efe4d1 0,#ddccb1 100%);overflow:hidden}.reader-device-gate{display:grid;place-items:center;padding:1rem}.reader-device-gate-card{width:min(480px,100%);border:1px solid #d8ccb9;border-radius:16px;background:rgb(255 255 255/85%);padding:1.1rem;box-shadow:0 14px 34px rgb(0 0 0/14%);text-align:center}.reader-device-gate-card h2{margin:0 0 .55rem;font-size:1.05rem;color:#2b2218}.reader-device-gate-card p{margin:0;color:#5c4f40;line-height:1.6}.reader-device-gate-qr-shell{width:min(78vw,280px);height:min(78vw,280px);margin:.9rem auto .75rem;display:grid;place-items:center}.reader-device-gate-qr{display:block;width:100%;height:100%;border-radius:10px;background:#fff;opacity:0;transition:opacity .12s ease}.reader-device-gate-qr.is-loaded{opacity:1;border:1px solid #d8ccb9;padding:.5rem}.reader-device-gate-url{margin-top:.5rem!important;font-size:.78rem;color:#7e705f!important;word-break:break-all}.lib-flip-shell{width:100%;min-height:100dvh;display:grid;place-items:center;padding:1rem 0}.lib-flip-book{filter:drop-shadow(0 16px 30px rgb(0 0 0/20%))}.lib-flip-page{height:100%;background:linear-gradient(180deg,#fffefb,#f6f1e8);border:1px solid #d8ccb9;border-radius:4px;-webkit-padding-start:.5rem;padding-inline-start:.5rem;-webkit-padding-end:.18rem;padding-inline-end:.18rem;padding:.45rem .72rem 1.2rem .2rem;position:relative;overflow:hidden}.lib-flip-page:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,rgb(120 105 84/5%) 0,rgb(120 105 84/5%) 1px,transparent 0,transparent 24px);pointer-events:none}.lib-flip-page-inner{height:100%;width:100%;min-height:100%;writing-mode:vertical-rl;-webkit-text-orientation:mixed;text-orientation:mixed;line-height:1.9;font-size:1.02rem;white-space:pre-wrap;color:#261d15;text-align:start}.lib-flip-page-no{position:absolute;left:.35rem;bottom:.2rem;margin:0;font-size:.66rem;color:#8a7b67}.reader-overlay{position:fixed;left:0;right:0;z-index:50;pointer-events:none;opacity:0;transform:translateY(-10px);transition:opacity .2s ease,transform .2s ease}.reader-overlay.bottom{top:auto;bottom:0;transform:translateY(10px)}.reader-overlay.is-visible{opacity:1;transform:translateY(0)}.reader-overlay-inner{pointer-events:none;margin:.6rem auto;width:min(920px,100% - 1rem);border-radius:12px;border:1px solid rgb(255 255 255/20%);background:rgb(23 18 13/72%);color:#f8efe4;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.7rem .9rem}.reader-overlay.is-visible .reader-overlay-inner{pointer-events:auto}.reader-overlay-top{display:flex;justify-content:space-between;align-items:center}.reader-overlay-bottom .meta{color:#f8efe4}.reader-overlay.bottom .reader-overlay-inner{margin:.2rem auto;padding:.36rem .9rem}.reader-overlay-bottom .meta-title{font-weight:700}.reader-overlay-bottom-row{display:flex;justify-content:space-between;align-items:center;gap:.9rem}.reader-back-link{display:inline-flex;align-items:center;gap:.45rem;font-size:.9rem;color:#f8efe4}.reader-back-link i{font-size:.82rem}.reader-manage-trigger{width:34px;height:34px;border-radius:999px;border:1px solid rgb(255 255 255/36%);background:rgb(255 255 255/14%);color:#f8efe4;display:inline-flex;align-items:center;justify-content:center;padding:0}.reader-manage-trigger i{font-size:.9rem}.reader-action-dialog-backdrop{position:fixed;inset:0;z-index:70;background:rgb(8 6 4/48%);display:grid;place-items:center;padding:1rem}.reader-action-dialog{width:min(360px,100%);border:1px solid #d8ccb9;border-radius:12px;background:#fff8ec;box-shadow:0 16px 36px rgb(0 0 0/26%);padding:.7rem;display:grid;grid-gap:.5rem;gap:.5rem}.reader-action-dialog button{width:100%}.reader-action-dialog button:last-child{background:#7b6e5e}.reader-nav-links{display:flex;gap:.8rem;font-size:.88rem}.reader-overlay-title{margin:.4rem 0 0;font-size:.94rem}.tap-zone{position:fixed;left:0;width:100%;height:16dvh;border:none;background:transparent;z-index:45;padding:0;-webkit-tap-highlight-color:transparent;outline:none}.tap-zone:active,.tap-zone:focus,.tap-zone:focus-visible{outline:none;box-shadow:none;background:transparent}.tap-zone.top{top:0}.tap-zone.bottom{bottom:0}.tap-zone.side{top:16dvh;bottom:16dvh;height:auto;width:50%;z-index:30}.tap-zone.side.left{left:0}.tap-zone.side.right{left:auto;right:0}.page-strip{display:flex;gap:.8rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.8rem}.page-card{flex:0 0 86vw;max-width:430px;min-height:70dvh;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:1rem;writing-mode:vertical-rl;-webkit-text-orientation:mixed;text-orientation:mixed;line-height:1.9;font-size:1rem;scroll-snap-align:center}.meta{color:var(--muted);font-size:.88rem}@media (min-width:860px){.page-card{flex-basis:360px}}@media (max-width:760px){.home-shelf-main{padding:.55rem 0 1.3rem}.home-shelf-frame{padding:.7rem;border-radius:14px}.home-shelf-row{padding:.75rem .75rem .95rem;border-radius:10px}.home-shelf-row+.home-shelf-row{margin-top:.8rem}.home-shelf-row:after{left:.5rem;right:.5rem;height:.86rem;bottom:-.48rem}.home-shelf-row:before{left:.6rem;right:.6rem;height:.72rem}.marketing-steps-grid{grid-template-columns:1fr}.marketing-step-image{margin-top:.55rem}.book-panel{--spine-w:12px}.book-panel-content{padding:.8rem;gap:.65rem}.book-panel-spine{width:var(--spine-w);font-size:.9rem;letter-spacing:.03em}.library-book-panel,.library-book-panel .book-panel-content{min-height:230px}.page-header-inner{padding:.62rem 0}.brand{font-size:1.1rem}.nav-desktop{display:none}.nav-mobile{display:flex;align-items:center;gap:.44rem}.nav-mobile a{width:34px;height:34px;border-radius:9px;border:1px solid #d8cdbd;background:rgb(255 255 255/60%);color:#5f5244;display:inline-flex;align-items:center;justify-content:center;font-size:.92rem}}