@font-face{font-family:Xiaolai;src:url('xiaolai-common.woff2') format('woff2');font-display:swap}:root{--note-size:1;--page:#fffdf8;--card:#fff;--text:#514655;--soft:#f7eef6;--line:#e4d8e5;--muted:#957f96;--ink:var(--text)}*{scrollbar-color:#cdb8d4 transparent}body{background:var(--page);color:var(--text)}header{height:76px;max-width:1100px;padding:10px 22px;gap:10px}.brand{gap:10px;min-width:0}.brand img{width:49px;height:49px;border-radius:14px}.brand span{font-size:19px;letter-spacing:0}.brand small{font-size:9px;letter-spacing:1.5px}.header-actions{display:flex;gap:6px;align-items:center}header button{padding:8px 10px;background:var(--card);border-color:var(--line)}main{max-width:1040px;padding:4px 22px 28px}.hero{min-height:110px;border-radius:22px;padding:20px 26px;overflow:visible;gap:12px}.hero h1{font-size:26px;line-height:1.4;margin:0;letter-spacing:0}.hero h1 span{display:inline}.hero p{margin:5px 0;font-size:12px}.hero .primary{margin:0;white-space:nowrap}.hero .eyebrow,.cloud{display:none}.hero>div:not(.hero-stickers){display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%}.hero-copy{display:flex;flex-direction:column}.hero .doodle{position:absolute;right:12px;top:-16px;font-size:26px;transform:rotate(12deg)}.stats{display:flex;gap:12px;margin:13px 0 18px}.stats>div{padding:9px 13px;border-radius:15px;gap:8px;flex:1;flex-direction:row}.stats>div:last-child{display:none}.stats b{font-size:20px}.stats span{font-size:11px}.section-title h2{margin:6px 0;font-size:19px}.section-title h2 small{display:none}#collectionCount{font-size:11px;color:var(--muted)}.tools{display:grid;grid-template-columns:minmax(0,1fr) 135px;gap:8px;margin:12px 0}.search{background:var(--card);border-color:var(--line)}.search input{font-size:13px}.extra-filters{display:flex;gap:8px;margin:0 0 15px}.extra-filters select{flex:1;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px}.tools select{background:var(--card);border-color:var(--line)}.entry{background:var(--card)!important;border-color:var(--line);box-shadow:3px 3px 0 var(--line);padding:18px}.entry h3{font-size:18px;margin:10px 0}.entry p{font-size:13px;color:var(--muted)}.entry-bottom{display:flex;justify-content:space-between;margin-top:15px;font-size:11px;color:var(--muted)}.entry-stars{color:#c29c50}.pagination{display:flex;align-items:center;justify-content:center;gap:20px;margin:25px 0}.pagination button{padding:9px 15px;background:var(--card);border-color:var(--line)}#pageInfo{color:var(--muted);font-size:12px}.empty{background:var(--card);border-color:var(--line)}.empty-jester{font-size:44px}footer{margin:20px 0;font-size:10px}dialog{background:var(--page);color:var(--text)}.reader-toolbar{background:var(--soft)}.reader-toolbar span{display:none}.reader-toolbar{flex-wrap:wrap}.reader-options{display:flex;align-items:center;gap:8px;padding:9px 15px;background:var(--soft);position:sticky;top:60px;z-index:5}.reader-options select,.reader-options button{font-size:12px;border:1px solid var(--line);border-radius:10px;padding:8px;background:var(--card)}.reader-options label{display:flex;align-items:center;gap:5px;font-size:11px}.art-tools{top:112px}.font-control{width:120px;accent-color:#a480b4}#noteBody,#noteBody h1,.paper-writing,.paper-section h3,.paper-date,.paper-rating,.paper-footer,.paper-kicker,.art-buttons button,.art-buttons .sticker-add{font-family:Xiaolai,cursive}.paper-writing{font-size:calc(20px * var(--note-size));line-height:2.05;letter-spacing:.5px;padding:6px 0;white-space:pre-wrap}.paper-section h3{font-size:calc(18px * var(--note-size));margin-bottom:16px}.paper-section{margin:30px 0}#noteBody h1{font-size:calc(31px * var(--note-size));line-height:1.6}.paper-date{font-size:calc(15px * var(--note-size))}.paper-rating{font-size:calc(17px * var(--note-size))}.paper-footer{font-size:calc(12px * var(--note-size))}#noteBody[data-paper=left]{padding-left:67px;background-repeat:repeat-y;background-size:30px 30px;background-position:4px 0}#noteBody[data-paper=left]:before{left:45px;top:0}#noteBody[data-paper=book]{padding:0;background:none;border:0;box-shadow:none;min-width:650px;min-height:0;border-radius:14px}#noteBody[data-paper=book]:before,#noteBody[data-paper=book]:after{display:none}.book-reader{max-width:1250px!important}.book-spread{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;overflow:hidden;border-radius:12px;box-shadow:0 10px 26px #51465526;background:#fff9ed}.book-leaf{min-width:0;padding:35px 28px 40px;background-color:#fff9ee;background-image:repeating-linear-gradient(transparent,transparent 39px,#eae3d92b 40px);min-height:650px;display:flex;flex-direction:column}.left-leaf{border-right:2px solid #d9c7ba;box-shadow:inset -18px 0 22px -20px #68555780}.right-leaf{box-shadow:inset 18px 0 22px -20px #68555780}.book-leaf .paper-section{margin:18px 0}.book-leaf .paper-footer{margin-top:auto}.book-leaf .paper-kicker{flex-wrap:wrap}.book-leaf h1{font-size:calc(25px * var(--note-size))!important}.book-leaf .paper-writing{font-size:calc(17px * var(--note-size))}.book-leaf .paper-date{font-size:calc(13px * var(--note-size))}.settings-grid{display:grid;gap:18px}.settings-grid label{display:flex;align-items:center;justify-content:space-between;gap:10px}.settings-grid select{padding:9px;border:1px solid var(--line);border-radius:9px;background:var(--card)}.settings-grid input[type=range]{flex:1}.settings-grid .button-row{display:flex;gap:9px}.settings-grid p{font-size:12px}.account-avatar{width:56px;height:56px;object-fit:cover;border-radius:50%;background:#eee2f4}.photo-tools{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.photo-tools button,.photo-tools .file{font-size:12px;padding:9px 11px}.photo-preview{display:block;width:100%;max-height:360px;object-fit:contain;border-radius:15px;background:repeating-conic-gradient(#f2edf5 0% 25%,#fff 0% 50%) 0/20px 20px}.cutout-status{font-size:12px;line-height:1.7;color:var(--muted)}#portraitPreview[hidden]{display:none}.doodle-row{display:flex;gap:12px;font-size:24px;align-items:center}.doodle-row span:nth-child(2n){transform:rotate(-9deg)}.doodle-row span:nth-child(2n+1){transform:rotate(9deg)}#profileOpen{display:flex;align-items:center;gap:5px}#profileOpen img{width:23px;height:23px;object-fit:cover;border-radius:50%}#artOpacity{width:70px;accent-color:#b694c8}.highlighter-label{font-size:11px;display:flex;align-items:center;gap:5px}.art-buttons{align-items:center}.share-paper{display:flex;gap:8px;align-items:center;margin-bottom:15px}.share-paper select{padding:8px;background:var(--card);border:1px solid var(--line);border-radius:8px}
:root[data-theme=dark]{--page:#171923;--card:#252736;--text:#eee2ee;--soft:#302c40;--line:#484054;--muted:#b6a6bc;--ink:#eee2ee;--muted:#b8a7bc}html[data-theme=dark] .hero{background:linear-gradient(110deg,#3d2c43,#2c334b,#253e3b)}html[data-theme=dark] .stats>div{background:#3b3445}html[data-theme=dark] .stats>div:nth-child(2){background:#283f37}html[data-theme=dark] .primary{background:#b397d0;color:#201d2a}html[data-theme=dark] .brand{color:var(--text)}html[data-theme=dark] .search input,html[data-theme=dark] input,html[data-theme=dark] textarea,html[data-theme=dark] select{color:var(--text);background:var(--card);border-color:var(--line)}html[data-theme=dark] #reader{background:#201e2b}html[data-theme=dark] #noteBody{background-color:#302e3a;color:#f1e4df;background-image:radial-gradient(circle at 13px 15px,#1e1b29 5px,transparent 6px);border-color:#554657;box-shadow:3px 5px 0 #161421}html[data-theme=dark] #noteBody:after{background-image:linear-gradient(135deg,transparent 50%,#201e2b 51%)}html[data-theme=dark] .paper-writing{background:none;border-bottom:1px solid #62546640}html[data-theme=dark] .paper-section h3{color:#f5e9f0;background:#624755}html[data-theme=dark] .paper-section.tint-1 h3{background:#3a5b4c}html[data-theme=dark] .paper-section.tint-2 h3{background:#514665}html[data-theme=dark] .paper-date,html[data-theme=dark] .paper-rating,html[data-theme=dark] .paper-kicker,html[data-theme=dark] .paper-footer{color:#bfaac7}html[data-theme=dark] .book-spread,html[data-theme=dark] .book-leaf{background-color:#302e3a}html[data-theme=dark] .left-leaf{border-color:#16141c}html[data-theme=dark] .art-tools{background:#242131fa}html[data-theme=dark] .art-buttons button,html[data-theme=dark] .art-buttons .sticker-add{background:#3d344d;border-color:#5b4b68;color:#eee2ee}html[data-theme=dark] .share-options button,html[data-theme=dark] .backup-card{background:#342d43}html[data-theme=dark] .share-options button:nth-child(2n){background:#294238}html[data-theme=dark] #noteMenu{background:#292431;border-color:#584560}html[data-theme=dark] .close{background:#48394e}html[data-theme=dark] .drawing{background:#302a3b}
@media(max-width:700px){header{height:68px;padding:8px 13px}.brand span{font-size:14px}.brand small{font-size:7px;letter-spacing:.8px}.brand img{width:37px;height:37px;border-radius:11px}header button{font-size:11px;padding:8px}.header-actions{gap:4px}#profileOpen span{display:none}main{padding:0 13px 20px}.hero{min-height:92px;padding:16px;border-radius:18px}.hero-copy h1{font-size:19px}.hero p{font-size:10px;line-height:1.7}.hero .primary{font-size:12px;padding:12px}.hero>div:not(.hero-stickers){gap:9px;max-width:100%}.stats{gap:8px;margin:10px 0 16px}.stats>div{padding:9px 12px;flex-direction:row}.stats b{font-size:19px}.tools{grid-template-columns:minmax(0,1fr) 100px}.tools select{max-width:100%;font-size:11px}.search input{font-size:12px}.entry{padding:16px}.entry h3{font-size:17px}#entries{gap:13px}.reader-toolbar{padding:8px}.reader-options{top:52px;padding:7px 9px;gap:6px}.reader-options select{max-width:140px;font-size:11px}.reader-options .font-control{width:84px}.art-tools{top:101px}#noteBody{margin:20px 13px;padding-right:20px}.book-reader #noteBody{margin:15px 12px}.book-leaf{padding:27px 22px}.book-reader{overflow-x:auto}.font-control{width:100px}footer{margin-bottom:10px}dialog{max-height:calc(100dvh - 12px)}#reader{height:auto;max-height:100dvh}}
body{font-family:Xiaolai,'Noto Sans TC',sans-serif}html[data-theme=dark] button{background:var(--card);color:var(--text);border-color:var(--line)}html[data-theme=dark] #artToggle{background:#594768;color:#fff0fd}html[data-theme=dark] .primary{background:#b397d0;color:#201d2a}html[data-theme=dark] #artSave{background:#37614e;color:#e9fff2}.profile-card{display:grid;gap:12px;padding:15px;border:1px solid var(--line);border-radius:16px}.profile-card label{display:block}.button-row{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}#accountDialog details{padding:15px;border:1px solid var(--line);border-radius:12px;margin:18px 0}#accountDialog label{display:block;font-size:12px;margin:12px 0}#accountDialog input,#sharedForm input,#sharedForm textarea{background:var(--card);color:var(--text)}#accountDialog p,#accountDialog details{font-size:12px}.friend-row{display:flex;align-items:center;justify-content:space-between;padding:12px;border-bottom:1px solid var(--line)}.friend-row button{padding:7px 13px}.chat-bubble{padding:12px;margin:9px 22px 9px 0;background:var(--soft);border-radius:14px}.chat-bubble.mine{margin:9px 0 9px 22px;background:#dcecdf;color:#344936}.chat-bubble small{font-size:9px}.chat-bubble p{white-space:pre-wrap;color:inherit}#chatMessages{max-height:380px;overflow:auto}#sharedForm label{display:block;margin:15px 0}#signedSection[hidden],#loginSection[hidden],#chatPanel[hidden]{display:none}@media(max-width:700px){#noteBody[data-paper=book]{min-width:0;width:calc(100% - 24px);margin:15px 12px}.book-leaf{padding:23px 13px;min-height:600px}.book-leaf .paper-writing{font-size:calc(14px * var(--note-size));line-height:2.15}.book-leaf h1{font-size:calc(19px * var(--note-size))!important}.book-leaf .paper-section h3{font-size:calc(14px * var(--note-size));padding:5px 8px;letter-spacing:0}.book-leaf .paper-date{font-size:calc(11px * var(--note-size))}.book-leaf .paper-kicker{font-size:8px}.book-leaf .paper-rating{font-size:calc(13px * var(--note-size));letter-spacing:0}.book-leaf .paper-footer{font-size:9px}.book-leaf .paper-section{margin:17px 0}.book-leaf .paper-section img{width:100%}}
#noteBody.export-book .book-leaf{padding:35px 30px;min-height:680px}#noteBody.export-book .book-leaf .paper-writing{font-size:calc(18px * var(--note-size));line-height:1.95}#noteBody.export-book .book-leaf h1{font-size:calc(29px * var(--note-size))!important}#noteBody.export-book .book-leaf .paper-section h3{font-size:calc(18px * var(--note-size))}#noteBody.export-book .book-leaf .paper-date{font-size:calc(14px * var(--note-size))}#noteBody.export-book .book-leaf .paper-kicker{font-size:11px}#noteBody.export-book .book-leaf .paper-footer{font-size:12px}
.hero-stickers{position:absolute;display:flex;right:9px;top:-19px;gap:0;pointer-events:none}.hero-stickers img{width:45px;height:45px;object-fit:contain;transform:rotate(9deg);filter:drop-shadow(1px 3px 1px #9e709626)}.hero-stickers img:first-child{transform:rotate(-12deg)}.footer-doodles{display:flex;align-items:center;justify-content:center;gap:9px}.footer-doodles img{width:31px;height:31px;object-fit:contain}#builtinStickers{display:flex;gap:7px;align-items:center;padding-top:10px;flex-wrap:wrap}#builtinStickers[hidden]{display:none}#builtinStickers button{width:45px;height:45px;padding:3px;background:var(--card);border-color:var(--line)}#builtinStickers img{width:100%;height:100%;object-fit:contain}@media(min-width:701px){footer{align-items:center;gap:12px}}


/* Paper colors are shared by reading and raster/PDF export. */
:root{--paper-color:#fffaf0;--book-color:#fff9ee}
:root[data-theme=dark]{--paper-color:#302e3a;--book-color:#302e3a}
#noteBody{background-color:var(--paper-color)}
#noteBody[data-paper=book],html[data-theme=dark] #noteBody[data-paper=book]{background:transparent;box-shadow:none;border:0}
.book-spread,.book-leaf,html[data-theme=dark] .book-spread,html[data-theme=dark] .book-leaf{background-color:var(--book-color)}
.sketch-frame,html[data-theme=dark] .sketch-frame{background:transparent}
.sticker-process{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0;font-size:12px}.sticker-process label{display:flex;align-items:center;gap:4px}

.download-apk{display:inline-block;font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:10px;text-decoration:none}