/* 手帳主題：藍色桌面、線圈筆記本、側邊索引標籤、便利貼 */
:root{--desk:#3b78bd;--paper:#fff8d0;--grid:#8fb0d655}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--desk:#0f2342;--paper:#26230f;--grid:#ffffff12}}
body{background:radial-gradient(#ffffff26 1.4px,transparent 1.8px) 0 0/24px 24px,var(--desk)}
header h1{background:none;box-shadow:none;padding:0 6px;font-size:34px;letter-spacing:.06em;color:#ffe066;-webkit-text-stroke:6px #e8588f;paint-order:stroke fill;text-shadow:3px 4px 0 #5a8fd6}
header h1::before{display:none}
.lo{color:#fff8d0}
.book{position:relative;max-width:900px;margin:26px 46px 40px 26px}
@media(min-width:1040px){.book{margin:26px auto 40px}}
.book main{position:relative;z-index:2;max-width:none;margin:0;min-height:70vh;padding:34px 26px 40px 48px;border-radius:6px 14px 14px 6px;background:linear-gradient(var(--grid) 1px,transparent 1px) 0 0/20px 20px,linear-gradient(90deg,var(--grid) 1px,transparent 1px) 0 0/20px 20px,var(--paper);box-shadow:3px 3px 0 #efe7b0,6px 6px 0 #e2d9a0,9px 9px 0 #cfc58b,12px 14px 18px #0005}
.book main::before{content:"";display:block;position:absolute;left:-16px;top:18px;bottom:18px;width:44px;height:auto;transform:none;background:radial-gradient(ellipse 17px 6px at 17px 50%,#e9ecf2 55%,#8d96aa 60% 80%,transparent 85%),radial-gradient(circle at 34px 50%,#1d4d8a 4px,transparent 5px);background-size:44px 38px;background-repeat:repeat-y}
.book main h2{font-family:var(--f-title);font-weight:400;display:inline-block;background:#f6a8c6;color:#3a3316;border-radius:999px;padding:3px 18px;font-size:16px;margin-bottom:14px}
.book #nav{position:absolute;right:-36px;top:34px;width:50px;max-height:none;overflow:visible;padding:0;gap:8px;z-index:1}
.book #nav button{border:3px solid #fff;border-left:0;border-radius:0 12px 12px 0;padding:10px 8px 10px 22px;transform:rotate(var(--rt,0deg));box-shadow:2px 3px 0 #0003;letter-spacing:.12em}
.book #nav button.on{z-index:3;position:relative;transform:translateX(8px);padding-right:8px;box-shadow:3px 4px 0 #0004}
.note{background:none;box-shadow:none;padding:0;min-height:0;filter:drop-shadow(2px 4px 0 #0003)}
.note .pp{background:var(--c);padding:18px 16px 14px;min-height:150px;clip-path:var(--cp)}
.note h3{display:inline-block;background:#f6a8c6;border-radius:999px;padding:1px 14px;font-size:14px;margin:0 0 8px}
.note:nth-child(even) h3{background:#ffffffb8}
.dc{position:absolute;z-index:3;pointer-events:none;filter:drop-shadow(1px 2px 0 #0003)}
.pc{position:relative}
.pc::before{content:"";position:absolute;top:-9px;left:50%;width:54px;height:16px;margin-left:-27px;background:#f6a8c6aa;transform:rotate(-4deg)}
.pc:nth-child(even)::before{background:#bfe3cfcc}
.pc .ch{margin-top:4px}
@media(max-width:600px){.book{margin:22px 46px 30px 22px}.book main{padding:28px 12px 34px 32px}header h1{font-size:28px}.book #nav button{font-size:12px;padding:9px 6px 9px 20px}}
