.personal-pet-panel.scroll-stage{position:fixed;inset:0;margin:0;padding:0;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;background:transparent;overflow:clip;color:#354a3d;box-shadow:none;overscroll-behavior:contain}
.scroll-stage::backdrop{background:#4c554e40;backdrop-filter:blur(1.5px)}
.scroll-stage::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:var(--unfold,0);
  background:
    radial-gradient(ellipse var(--scroll-floor-radius) 14px at var(--scroll-floor-x) var(--scroll-floor-y),#8f805c48,transparent),
    radial-gradient(ellipse calc(var(--scroll-floor-radius)*1.65) 30px at var(--scroll-floor-x) var(--scroll-floor-y),#fff8dce8 4%,#fff1cb9c 48%,transparent),
    var(--scroll-floor-strands,none),
    radial-gradient(ellipse 66% 9% at var(--scroll-floor-x) var(--scroll-floor-y),#fff3d8b8 0%,#fcebd465 54%,transparent),
    radial-gradient(ellipse 80% 16% at 48% 106%,#fff1deed 18%,#f8e7d8b0 57%,transparent),
    radial-gradient(ellipse 96% 14% at 54% 111%,transparent 66%,#f6ead270 70%,transparent 78%);
}
@media(min-width:1100px) and (min-height:720px){
  .scroll-stage::before{
    /* The strands converge at 76%, 42/160 of the SVG. */
    --scroll-floor-strand-height:clamp(96px,calc(var(--viewport-height)*.15),168px);
    --scroll-floor-strands:url('/art/scroll-floor-light.svg') var(--scroll-floor-strand-left)
      calc(var(--scroll-floor-y) - var(--scroll-floor-strand-height)*.2625)/112% var(--scroll-floor-strand-height) no-repeat;
  }
}
@media(max-width:760px){
  .scroll-stage::before{
    background:
      radial-gradient(ellipse var(--scroll-floor-radius) 9px at var(--scroll-floor-x) var(--scroll-floor-y),#8f805c48,transparent),
      radial-gradient(ellipse calc(var(--scroll-floor-radius)*1.34) 31px at var(--scroll-floor-x) var(--scroll-floor-y),#fff8e5ef,#fff0ccaa 51%,transparent),
      radial-gradient(ellipse 62% 6% at var(--scroll-floor-x) var(--scroll-floor-y),#fff3d493,transparent);
  }
}
.scroll-stage[data-compact]::before{opacity:calc(var(--unfold,0)*.64)}
@media(prefers-reduced-motion:reduce){.scroll-stage::before{opacity:calc(var(--unfold,0)*.55)}}
.scroll-stage canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.scroll-surface{filter:drop-shadow(0 18px 22px #38423835)}
.scroll-mascot{position:absolute;filter:drop-shadow(0 8px 6px #544d342b);pointer-events:none}.scroll-mascot .personal-rabbit-art{width:100%;height:100%;display:block}.scroll-mascot .rabbit-dream{display:none}.scroll-mascot:after{content:'';position:absolute;left:calc(var(--scroll-tail-x) - 7%);top:calc(var(--scroll-tail-y) - 10%);width:14%;height:20%;border-radius:50%;background:radial-gradient(ellipse,#fffcdfaa,transparent 65%);box-shadow:0 0 26px #fff0bd55;opacity:var(--unfold,0)}
.scroll-dismiss{position:absolute;right:24px;top:24px;width:44px;height:44px;border-radius:50%;background:#fafcf6cc;font-size:28px;font-weight:300;color:#50604b;z-index:4}.scroll-dismiss:hover{background:#fff}.scroll-dismiss:focus-visible,.scroll-stage button:focus-visible{outline:2px solid #577551;outline-offset:3px}
.scroll-page{position:absolute;opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .7s ease;pointer-events:none;display:flex;flex-direction:column}.scroll-readable .scroll-page{opacity:1;transform:none;pointer-events:auto}
.scroll-stage .scroll-page header,.scroll-stage .scroll-hint{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.scroll-stage .personal-scroll{flex:1;min-height:0;display:flex;flex-direction:column}.scroll-stage .scroll-ribbon{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;overscroll-behavior:contain;outline-offset:4px;mask-image:linear-gradient(transparent,#000 3%,#000 95%,transparent)}.scroll-stage .scroll-ribbon::-webkit-scrollbar{display:none}
.scroll-stage .scroll-track{position:relative;display:flex;flex-direction:column;padding:8px 8px 26px 0;min-height:100%;height:auto;width:100%}.scroll-stage .scroll-column{position:relative;flex:none;width:100%;min-height:145px;height:calc(var(--reading-height)/3);padding:8px 0 20px 35px;display:block;border:0;background:none}.scroll-stage .scroll-column:before{content:'';position:absolute;left:6px;top:10px;bottom:22px;width:1px;background:linear-gradient(transparent,#7d90723d,transparent)}.scroll-stage .scroll-column:after{content:'• • •';position:absolute;bottom:4px;left:45%;font-size:12px;letter-spacing:5px;color:#8a978a55}
.scroll-stage .scroll-grip{position:absolute;left:-1px;top:6px;width:22px;height:65px;font-size:23px;color:#87977d;cursor:grab;user-select:none;touch-action:pan-y}.scroll-stage .scroll-grip:active{cursor:grabbing}.scroll-stage .scroll-column article{padding:0;min-height:0;border:0;overflow:hidden}.scroll-stage .scroll-column article>p{font:clamp(16px,1.25vw,19px)/1.75 var(--serif);white-space:normal;overflow-wrap:anywhere;margin:10px 0 2px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.scroll-stage time{font-size:clamp(14px,1.2vw,18px);color:#7b8c74;letter-spacing:1px}.scroll-stage .scroll-column h3{font:clamp(22px,1.85vw,28px)/1.45 var(--serif);margin:8px 0;color:#35483a}.scroll-stage .scroll-read{font-size:10px;margin:4px 0 0;padding:4px 0;border:0;color:#86917c;opacity:.75}.scroll-stage .scroll-read:hover{opacity:1;text-decoration:underline}
.scroll-stage .scroll-controls{position:fixed;bottom:30px;left:calc(50% - 90px);width:180px;flex:none;margin:0;display:flex;align-items:center;justify-content:space-between;opacity:.75}.scroll-stage .scroll-controls button{width:34px;height:34px;background:#fafcf54d;border:1px solid #a6b49660;border-radius:50%}.scroll-stage .scroll-controls button:disabled{opacity:.3}.scroll-stage .scroll-position{font-size:10px;color:#68795e;font-variant-numeric:tabular-nums}
.scroll-stage .scroll-detail{overflow:auto;flex:1;min-height:0;max-height:none;padding:0 6px;overscroll-behavior:contain}.scroll-stage .scroll-detail article{padding:15px 0;border:0;line-height:1.9}.scroll-stage .scroll-detail article>p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px}.scroll-stage .scroll-back{font-size:14px;padding:8px 0}.scroll-stage .scroll-caption{position:absolute;bottom:9%;left:44%;font-size:12px;letter-spacing:2px;color:#566252;opacity:var(--unfold,0);pointer-events:none}.scroll-stage .scroll-caption:after{content:'⌄';display:block;text-align:center;font-size:20px;margin-top:8px}.scroll-stage [hidden]{display:none!important}.scroll-stage[data-phase=closing] .scroll-page{opacity:0;transform:translateY(8px);transition-duration:.15s}
.scroll-art-error .scroll-page{background:#fffaf0;padding:20px;border-radius:8px}
@media(max-width:760px){.scroll-stage .scroll-column{min-height:168px;padding-left:22px}.scroll-stage .scroll-controls{bottom:72px;left:20px;width:150px}.scroll-stage .scroll-column h3{font-size:20px;line-height:1.4}.scroll-stage .scroll-column article>p{font-size:15px}.scroll-stage time{font-size:12px;letter-spacing:.3px}.scroll-stage .scroll-dismiss{right:10px;top:10px}.scroll-stage .scroll-caption{left:7%;bottom:11%;font-size:10px;letter-spacing:1px}.scroll-stage .scroll-controls{margin:0}.scroll-stage .scroll-detail article>p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.scroll-stage .scroll-page{transition:none;transform:none}.scroll-stage .rabbit-breath{animation:none}}

body:has(.scroll-stage[open]) .pet-dock{visibility:hidden}.scroll-readable .scroll-page{transform:none}.scroll-page{transition:opacity .5s ease;transform:none}

.scroll-stage .scroll-detail{margin-left:8%;max-height:88%}

/* v3: legible controls, restrained depth and a continuous connection glow. */
.scroll-stage::backdrop{background:#3c49403b;backdrop-filter:blur(1px)}
.scroll-surface{filter:drop-shadow(0 24px 28px #3842382e) drop-shadow(0 2px 2px #b5a88218)}
.scroll-stage .scroll-controls{bottom:25px;left:calc(50% - 112px);width:224px;padding:5px 7px;border:1px solid #f9f8eb85;border-radius:32px;background:#f7f7ebbc;box-shadow:0 5px 20px #3447330d;backdrop-filter:blur(12px);opacity:1}
.scroll-stage .scroll-controls button{width:44px;height:44px;border:0;background:transparent;font-size:18px;color:#536a4e;transition:background .15s ease,transform .15s ease}
.scroll-stage .scroll-controls button:hover:not(:disabled){background:#e4e9d9}.scroll-stage .scroll-controls button:active:not(:disabled){transform:scale(.96)}
.scroll-stage .scroll-position{font-size:11px;color:#53674e}.scroll-stage .scroll-caption{bottom:10%;left:50%;transform:translateX(-50%);white-space:nowrap;color:#4c5d46}
.scroll-stage .scroll-column h3{letter-spacing:.015em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.scroll-stage .scroll-read{font-size:14px;color:#607354;opacity:1;padding:5px 0;transition:color .15s ease}.scroll-stage .scroll-read:hover{color:#314e2d}
.scroll-stage[data-phase=opening] .scroll-mascot:after{animation:scroll-back-glow 1.65s ease-out both}
@keyframes scroll-back-glow{0%{transform:scale(.5);opacity:0}35%{transform:scale(1.7);opacity:1}100%{transform:scale(1);opacity:.6}}
@media(max-width:760px){.scroll-stage .scroll-controls{left:12px;bottom:62px;width:180px;padding:3px 5px}.scroll-stage .scroll-position{font-size:10px}.scroll-stage .scroll-caption{left:20px;bottom:120px;transform:none;font-size:10px}.scroll-stage .scroll-caption:after{display:none}}
@media(prefers-reduced-motion:reduce){.scroll-stage[data-phase=opening] .scroll-mascot:after{animation:none}}

@media(max-width:760px){.scroll-stage .scroll-read{font-size:13px}}
.scroll-context{position:fixed;top:12px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 150px);z-index:4;text-align:center;border:1px solid #f9f8eb85;border-radius:22px;background:#f7f7ebdf;padding:6px 16px;color:#53674d;box-shadow:0 3px 18px #3447330a}
.scroll-context p{font:12px/1.6 var(--sans);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scroll-updates,.scroll-retry{font:12px var(--sans);min-height:44px;color:#536f48;text-decoration:underline;text-underline-offset:4px}
.scroll-entry-meta{font:12px/1.7 var(--sans);color:#74816b;margin:3px 0}
.scroll-column .scroll-entry-meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scroll-unread{display:block;margin:3px 0 6px;color:#557745;font:12px/1.6 var(--sans)}.scroll-context .scroll-unread-summary{font-size:11px;color:#668158}
.reply-unread{margin-left:8px;border-radius:8px;padding:1px 6px;background:#e7efdbb3;color:#557745;font:11px var(--sans)}
.scroll-stage .scroll-column{height:auto;min-height:max(190px,calc(var(--reading-height)/3))}
@media(min-width:761px){
  .scroll-stage:not([data-compact]) .scroll-column{
    min-height:max(156px,calc((var(--reading-height) - 30px)/3));
    padding-block:4px 12px;
  }
  .scroll-stage:not([data-compact]) .scroll-column time{display:block;line-height:1.25}
  .scroll-stage:not([data-compact]) .scroll-column h3{margin:3px 0 1px}
  .scroll-stage:not([data-compact]) .scroll-column .scroll-entry-meta{margin:0}
  .scroll-stage:not([data-compact]) .scroll-column article>p{margin:3px 0 1px}
  .scroll-stage:not([data-compact]) .scroll-column .scroll-read{display:block;margin-top:2px}
}
.scroll-chapters{display:flex;align-items:center;gap:8px;margin:5px 0 0;font:11px/1.6 var(--sans)}.scroll-chapters select{flex:1;min-width:0;max-width:100%;padding:5px 8px;border:1px solid #a6b49660;border-radius:12px;background:#fffdf5;color:#435b3f;font:12px var(--sans)}.scroll-context .scroll-chapter-note{font-size:10px;white-space:normal;max-width:340px;margin-top:4px}.scroll-entry-chapter{font:11px/1.6 var(--sans);color:#73846a;margin:0 0 5px;letter-spacing:.03em}
@media(max-width:760px){.scroll-context:has(.scroll-chapters:not([hidden])){max-width:calc(100vw - 112px)}}
@media(max-width:760px){.scroll-context{top:10px;max-width:calc(100vw - 80px);padding:5px 12px}.scroll-context p,.scroll-entry-meta{font-size:11px}}
.scroll-queue-controls>div{display:flex;justify-content:center;gap:8px}.scroll-queue-controls button{min-height:44px;padding:6px 12px;border:1px solid #a6b49660;border-radius:12px;background:#fffdf5;color:#435b3f;font:12px var(--sans)}.scroll-queue-controls button:disabled{opacity:.5}.scroll-queue-controls[hidden],.scroll-queue-retry[hidden]{display:none}.scroll-context.is-queue .scroll-unread-summary,.scroll-context.is-queue .scroll-updates{display:none}.scroll-context.is-queue .scroll-queue-controls p{white-space:normal;font-size:12px}
.scroll-entry-edited{display:block;margin:3px 0 8px;color:#7a7353;font:12px/1.6 var(--sans)}.entry-editor{margin:18px 0;padding-top:12px;border-top:1px solid #a6b49650}.entry-editor label{display:block;font:12px/1.6 var(--sans);margin:8px 0}.entry-editor input,.entry-editor textarea{display:block;width:100%;min-width:0;box-sizing:border-box;padding:8px;border:1px solid #a6b49670;border-radius:8px;background:#fffdf3c0;color:#435b3f;font:inherit;line-height:1.8}.entry-editor textarea{resize:vertical}.entry-editor button{min-height:44px;padding:5px 10px;border-radius:10px;background:#f6f6e9;color:#435b3f;font:12px/1.6 var(--sans);border:1px solid #a6b49670}.entry-editor button:disabled{opacity:.5}.entry-editor .entry-edit-help,.entry-editor .entry-edit-status{font:12px/1.7 var(--sans);white-space:pre-wrap;overflow-wrap:anywhere}.entry-edit-actions{display:flex;flex-wrap:wrap;gap:8px}.entry-edit-compare{font:12px/1.8 var(--sans);overflow-wrap:anywhere;margin:8px 0}.entry-edit-compare p{white-space:pre-wrap}.entry-editor [hidden]{display:none}
.scroll-stage .scroll-responses{margin-top:22px;border-top:1px solid #aebca14d;padding-top:16px;font:13px/1.8 var(--sans);color:#53664c}.scroll-responses h4{font:18px var(--serif);margin:0 0 12px}.scroll-stage .scroll-reply{padding:12px 0;border-bottom:1px solid #aebca12b}.scroll-stage .scroll-reply strong{font-size:13px;font-weight:500}.scroll-stage .scroll-reply time{display:block;font:11px/1.7 var(--sans);letter-spacing:0;color:#7d8c73}.scroll-stage .scroll-reply p{font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0}.scroll-reply small,.reply-version,.reply-read-status,.reply-send-status{font:12px/1.8 var(--sans);color:#74836b;white-space:pre-wrap;overflow-wrap:anywhere}.scroll-stage .reply-reading-actions{display:flex;flex-wrap:wrap;gap:14px}.scroll-stage .scroll-reply-form{margin-top:16px}.scroll-stage .scroll-reply-form label{display:block;font:13px/1.8 var(--sans)}.scroll-stage .scroll-reply-form textarea{display:block;width:100%;box-sizing:border-box;min-height:88px;max-height:240px;resize:vertical;margin:8px 0;padding:10px;border:1px solid #a9b99a;border-radius:6px;background:#fffdf7b3;color:#3f5139;font:14px/1.8 var(--sans)}.scroll-stage .scroll-responses button{min-height:44px;font:13px var(--sans);color:#48653c;text-align:left}.scroll-stage .reply-submit{border:1px solid #a5b899;border-radius:6px;background:#f1f5e4b8;padding:10px 16px}.scroll-stage .scroll-responses button:disabled{opacity:.55}.scroll-stage .scroll-reply-form textarea:focus{outline:2px solid #9caf88;outline-offset:2px}.scroll-stage .reply-submit:focus-visible{outline:2px solid #829a6d;outline-offset:3px}@media(max-width:760px){.scroll-stage .scroll-responses{margin-top:16px}.scroll-responses h4{font-size:17px}.scroll-stage .reply-submit{width:100%;text-align:center}.scroll-stage .scroll-reply-form textarea{font-size:16px}}

.scroll-stage .scroll-reply.is-notification-target{border-left:2px solid #82966d;background:#fbf5df9c;padding:12px;border-radius:6px;outline:none}.scroll-stage .scroll-reply.is-notification-target:focus-visible{outline:2px solid #82966d;outline-offset:3px}.scroll-stage .reply-locate-status{padding:8px 0;font:12px/1.8 var(--sans);color:#52694c}.scroll-stage .reply-locate-status[hidden],.scroll-stage .reply-latest[hidden]{display:none}
.scroll-stage .reply-target-tag{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:7px;color:#61734f;font:12px/1.7 var(--sans);overflow-wrap:anywhere}

.scroll-stage .scroll-page-more{flex:none;align-self:center;min-height:44px;margin:10px 0 18px;padding:8px 14px;border:1px solid #a6b49660;border-radius:24px;color:#536a4e;background:#f7f7eb80;font:13px/1.6 var(--sans)}
.scroll-stage .scroll-page-more:hover{background:#e4e9d9}

.scroll-stage .scroll-position{white-space:nowrap}
@media(max-width:760px){.scroll-stage .scroll-controls{width:210px}}

.scroll-stage[data-phase=closing] .scroll-page{transform:none}
.scroll-stage .memory-gallery.count-1 .memory-photo{aspect-ratio:4/3;width:100%;height:auto;max-height:360px}
.scroll-stage .memory-photo img{object-fit:contain}
.scroll-stage img[data-scroll-src]:not([src]){opacity:0}
.scroll-stage video[data-scroll-src]{aspect-ratio:16/9;object-fit:contain}
.scroll-media-feedback{display:block;min-height:1.6em;color:#617252;font:12px/1.6 var(--sans);overflow-wrap:anywhere}
.scroll-media-feedback[hidden]{display:block;visibility:hidden}
.memory-photo>.scroll-media-feedback{position:absolute;inset:0;display:grid;place-content:center;padding:12px;pointer-events:none}
.memory-photo>.scroll-media-feedback[hidden]{display:none}
.scroll-media-feedback button{font:inherit;text-decoration:underline;padding:3px 6px;color:inherit;background:transparent}
.scroll-search{display:flex;align-items:center;gap:5px;margin-top:6px;width:100%;max-width:360px}
.scroll-search input{flex:1;min-width:0;width:150px;min-height:36px;box-sizing:border-box;padding:6px 9px;border:1px solid #a6b49670;border-radius:10px;background:#fffdf5;color:#435b3f;font:13px/1.5 var(--sans)}
.scroll-search button{flex:none;min-height:36px;min-width:40px;padding:5px 7px;border:1px solid #a6b49660;border-radius:10px;background:#fffdf5;color:#435b3f;font:12px/1.5 var(--sans)}
.scroll-search button[hidden],.scroll-search[hidden],.scroll-search-status[hidden]{display:none}
.scroll-context .scroll-search-status{margin-top:5px;font:11px/1.6 var(--sans);white-space:normal;overflow-wrap:anywhere;max-width:350px}
.scroll-search-match{background:#dfe8b9b0;color:inherit;border-radius:2px;padding:0}
.scroll-stage .scroll-column article>.scroll-card-match{font:12px/1.6 var(--sans);color:#617252;-webkit-line-clamp:2}
@media(max-width:760px){.scroll-search input{font-size:16px;min-height:44px;width:100px}.scroll-search button{min-height:44px;min-width:44px}.scroll-context:has(.scroll-search){max-width:calc(100vw - 100px)}}
.scroll-date{margin-top:5px;max-width:360px}
.scroll-date summary{padding:3px 6px;min-height:28px;box-sizing:border-box;cursor:pointer;color:#536a4e;font:12px/1.7 var(--sans)}
.scroll-date[hidden],.scroll-date-status[hidden]{display:none}
.scroll-date-form{display:flex;align-items:center;gap:6px;margin-top:5px}
.scroll-date-form input{flex:1;min-width:0;width:145px;box-sizing:border-box;min-height:36px;padding:5px 7px;border:1px solid #a6b49670;border-radius:10px;background:#fffdf5;color:#435b3f;font:14px/1.5 var(--sans)}
.scroll-date-form button{flex:none;min-width:44px;min-height:36px;padding:5px 8px;border:1px solid #a6b49660;border-radius:10px;background:#fffdf5;color:#435b3f;font:12px/1.5 var(--sans)}
.scroll-context .scroll-date-help,.scroll-context .scroll-date-status{max-width:350px;white-space:normal;overflow-wrap:anywhere;font:11px/1.6 var(--sans);margin-top:4px}
.scroll-date-match{background:#e4eac4a8;border-radius:4px;padding:2px 4px}
@media(max-width:760px){.scroll-date summary{min-height:44px;display:flex;align-items:center;justify-content:center}.scroll-date-form input{min-height:44px;font-size:16px}.scroll-date-form button{min-height:44px}}
.scroll-stage .scroll-back{position:sticky;top:0;z-index:2;background:#fbf8edeb}
.scroll-edges{display:flex;gap:6px;margin-top:5px}.scroll-edges button{flex:1;min-height:44px;padding:5px 8px;border:1px solid #a6b49660;border-radius:10px;background:#fffdf5;color:#435b3f;font:12px/1.5 var(--sans)}
.scroll-context .scroll-resume-status{font:11px/1.6 var(--sans);max-width:350px}.scroll-position-retry{font:12px var(--sans);min-height:44px;color:#536f48;text-decoration:underline}.scroll-position-retry[hidden],.scroll-resume-status[hidden]{display:none}
.scroll-stage .scroll-ribbon:focus-visible,.scroll-stage .scroll-detail:focus-visible{outline:2px solid #71896b;outline-offset:-2px;border-radius:6px}.scroll-stage .scroll-column h3:focus-visible{outline:2px solid #71896b;outline-offset:-2px;border-radius:3px}.scroll-stage[data-keyboard] .scroll-caption{left:20px;transform:none;max-width:calc(100% - 320px);font:12px/1.8 var(--sans);letter-spacing:0;white-space:normal}@media(max-width:760px){.scroll-stage[data-keyboard] .scroll-caption{max-width:calc(100% - 170px)}}
.scroll-playback-progress{display:block;margin-top:8px;font:11px/1.6 var(--sans);color:#53694c}.scroll-playback-progress input{display:block;width:100%;min-width:0;min-height:44px;margin:0;padding:0;border:0;background:transparent;accent-color:#71896b;touch-action:pan-y pinch-zoom}.scroll-playback-progress output{display:block;font-variant-numeric:tabular-nums}.scroll-stage .scroll-grip{touch-action:pan-y pinch-zoom}@media(max-width:760px){.scroll-stage .scroll-read,.scroll-stage .scroll-back{min-height:44px;min-width:44px}.scroll-stage .scroll-playback-progress{font-size:12px}}
.scroll-playback-toggle{display:none}@media(max-width:760px){.scroll-playback-toggle{display:block;min-height:44px;min-width:44px;margin-top:8px;padding:5px 9px;border:1px solid #a6b49670;border-radius:8px;background:#f7faf1;color:#435b3f;font:12px/1.6 var(--sans)}}
.scroll-stage .scroll-context{position:absolute}
.scroll-stage[data-compact] .scroll-context{box-sizing:border-box;max-height:clamp(56px,calc(var(--viewport-height) - 260px),160px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.scroll-stage[data-side-tools] .scroll-context{left:12px;top:12px;transform:none;width:230px;max-width:27%;max-height:calc(var(--viewport-height) - 88px);padding:6px 10px}
.scroll-stage[data-compact] .scroll-detail{max-height:none;scroll-padding-top:50px;scroll-padding-bottom:6px}
@media(max-width:1100px){
  /* A Spotify embed needs 280px for its controls, even when the folded paper is narrower. */
  .scroll-stage .scroll-page:has(.scroll-detail:not([hidden]) iframe.spotify){
    left:max(6px,calc((100% - 580px)/2))!important;
    width:min(calc(100% - 12px),580px)!important;
  }
  .scroll-stage .scroll-detail:has(iframe.spotify){
    margin-left:0;padding-inline:6px;scrollbar-width:none;scroll-padding-top:50px;
    background:#fbf8ee;border-radius:12px;
  }
  .scroll-stage .scroll-detail:has(iframe.spotify) .scroll-back{
    display:block;width:100%;padding-inline:8px;text-align:left;background:#fbf8ee;
  }
  .scroll-stage .music-card:has(iframe.spotify){padding:10px 5px}
}
.scroll-stage[data-compact] .scroll-reply-form textarea,.scroll-stage[data-compact] .entry-editor textarea{min-height:44px;height:clamp(44px,calc(var(--reading-height) - 60px),96px);max-height:96px;font-size:16px}
.scroll-stage[data-compact] .scroll-dismiss{right:10px;top:10px}
.scroll-stage[data-compact] .scroll-controls{left:calc(var(--viewport-left) + 12px);top:calc(var(--viewport-top) + var(--viewport-height) - 68px);bottom:auto;width:210px}
.scroll-stage[data-compact] .scroll-read,.scroll-stage[data-compact] .scroll-back{min-height:44px;min-width:44px}
.scroll-stage[data-compact] .scroll-caption{left:20px;bottom:72px;transform:none;font-size:10px;max-width:210px}.scroll-stage[data-compact] .scroll-caption:after{display:none}

.personal-pet-panel.scroll-stage{max-width:100vw;max-height:100dvh}
.official-rabbit-card{display:flex;align-items:center;gap:18px;margin:0 0 28px;padding:24px 28px;border:1px solid #dfe5d5;border-radius:20px;background:linear-gradient(125deg,#faf9ef,#edf2e5);overflow:hidden}.official-rabbit-card>div{flex:1;min-width:0}.official-rabbit-card h2{margin:8px 0 10px;font:26px/1.5 var(--serif);color:#3e573f}.official-rabbit-card p:not(.eyebrow){font:12px/1.8 var(--sans);color:#77826b;margin:0 0 16px}.official-rabbit-art{display:block;flex:none;width:180px;height:120px}.official-rabbit-art .personal-rabbit-art,.official-rabbit-art img{display:block;width:100%;height:100%}.scroll-public-original{min-height:44px;padding:8px 0;color:#536f48;font:13px var(--sans);text-decoration:underline;text-underline-offset:4px}
@media(max-width:760px){.official-rabbit-card{gap:8px;padding:20px 16px;align-items:flex-end}.official-rabbit-card h2{font-size:21px}.official-rabbit-art{width:105px;height:70px}.official-rabbit-card .btn{min-height:44px;padding:10px 12px;font-size:12px}.official-rabbit-card .eyebrow{font-size:10px}}
body:has(.public-scroll-stage[open]) .official-rabbit-art{visibility:hidden}
.scroll-stage.scroll-horizontal .scroll-page{overflow:clip;transform:none}
.scroll-stage.scroll-horizontal .scroll-context{scrollbar-width:none}
.scroll-stage .scroll-ribbon.scroll-continuous{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x pinch-zoom;mask-image:none;overscroll-behavior:contain}
.scroll-stage .scroll-ribbon.scroll-continuous::-webkit-scrollbar{display:none}
.scroll-stage .scroll-continuous .scroll-track{display:block;height:100%;min-height:0;padding:0;column-count:1;column-fill:auto;column-gap:24px}
.scroll-stage .scroll-continuous .scroll-column{min-height:0;height:auto;width:auto;padding:4px 6px 14px}
.scroll-stage .scroll-continuous .scroll-column+.scroll-column{padding-top:22px;border-top:1px solid #9fad975c}
.scroll-stage .scroll-continuous .scroll-column::before,.scroll-stage .scroll-continuous .scroll-column::after{content:none}
.scroll-stage .scroll-continuous .scroll-column article{overflow:visible;margin-inline:auto;max-inline-size:28ic;color:#435747;font:clamp(15px,1.23vw,18px)/1.85 var(--serif);overflow-wrap:anywhere;text-shadow:0 1px #fffdf280}
.scroll-stage .scroll-continuous .scroll-column article>time{display:block;font:11px/1.5 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:.08em;color:#64765c}
.scroll-stage .scroll-continuous .scroll-column h3{display:block;margin:3px 0;font:500 clamp(19px,1.65vw,25px)/1.35 var(--serif);letter-spacing:.03em;color:#344b3d;text-wrap:balance;overflow:visible}
.scroll-stage .scroll-continuous .scroll-entry-meta{font:11px/1.5 var(--sans);color:#637459;white-space:normal}
.scroll-stage .scroll-continuous .scroll-column article>time,.scroll-stage .scroll-continuous .scroll-column h3,.scroll-stage .scroll-continuous .scroll-entry-meta,.scroll-stage .scroll-continuous .scroll-replies-inline h4{break-after:avoid-column}
.scroll-stage .scroll-continuous .scroll-column article>p{display:block;margin:9px 0 0;overflow:visible;white-space:pre-wrap;-webkit-line-clamp:unset;font:inherit}
.scroll-stage .scroll-continuous .scroll-column article p{orphans:2;widows:2}
.scroll-stage .scroll-continuous .note-document .note-text{font:inherit;margin:10px 0 14px}
.scroll-stage .scroll-continuous .note-document .note-heading{font:600 1.1em/1.45 var(--serif);break-after:avoid-column}
.scroll-stage .scroll-continuous .scroll-reply-form label,.scroll-stage .scroll-continuous .reply-inline-actions,.scroll-stage .scroll-continuous .entry-edit-actions{break-inside:avoid-column}
.scroll-stage .scroll-continuous .scroll-replies-inline :is(.scroll-reply,.scroll-reply-form){break-inside:avoid-column}
.scroll-stage .scroll-continuous .reply-inline-actions .reply-submit{width:auto}
.scroll-stage .scroll-continuous textarea{max-block-size:calc(var(--reading-height)*.62);scrollbar-width:none}
.scroll-stage .scroll-continuous iframe,.scroll-stage .scroll-continuous video,.scroll-stage .scroll-continuous .memory-photo{max-block-size:calc(var(--reading-height)*.75);max-inline-size:100%}
.scroll-stage.scroll-horizontal .scroll-controls{top:auto;left:50%;bottom:10%;transform:translateX(-50%);width:auto;gap:9px;padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none}
.scroll-stage.scroll-horizontal .scroll-controls button{min-width:44px;min-height:44px;color:#53664b}
.scroll-stage.scroll-horizontal .scroll-position{color:#54654c;font-variant-numeric:tabular-nums}
.scroll-stage.scroll-horizontal .scroll-caption{display:none}
@media(max-width:760px){
  .scroll-stage.scroll-horizontal .scroll-controls{left:80px;bottom:11%}
}
.scroll-stage[data-compact] .scroll-continuous .scroll-reply-form textarea{min-height:44px;height:44px}
.scroll-stage .scroll-continuous .scroll-replies-inline{margin:18px 0 8px;padding:0 0 0 12px;border:0;border-inline-start:1px solid #91a28164}
.scroll-replies-inline h4{margin:0 0 5px;font:14px/1.6 var(--serif);letter-spacing:.12em;color:#52684b}
.scroll-replies-inline p:empty,.scroll-replies-inline .reply-reading-actions:not(:has(button:not([hidden]))){display:none}
.scroll-stage .scroll-replies-inline .scroll-reply{padding:6px 0;border:0}
.scroll-stage .scroll-replies-inline .scroll-reply time{display:inline;margin-inline-start:8px}
.scroll-stage .scroll-replies-inline .scroll-reply p{margin:2px 0;line-height:1.65}
.scroll-stage .scroll-replies-inline .scroll-reply.is-answer{margin:4px 0 3px 9px;padding-inline-start:10px;border-inline-start:1px solid #aab69870}
.scroll-replies-inline .reply-parent{color:#6c8163}
.scroll-stage .scroll-replies-inline .scroll-reply-form{margin-top:6px}
.scroll-stage .scroll-replies-inline .scroll-reply-form textarea{min-width:0;min-height:54px;height:60px;margin:4px 0 2px;padding:6px 0;border:0;border-bottom:1px solid #91a28180;border-radius:0;background:transparent}
.scroll-stage .scroll-replies-inline .scroll-reply-form textarea:focus{outline:none;border-bottom-color:#576f4e}
.scroll-stage .scroll-replies-inline button{min-height:36px;padding:2px 0}
.scroll-stage .scroll-replies-inline button:hover:not(:disabled),.scroll-stage .scroll-replies-inline .reply-write-note{text-decoration:underline;text-underline-offset:3px}
.reply-inline-actions{display:flex;flex-wrap:wrap;gap:0 18px}
.scroll-replies-inline .reply-inline-actions .reply-submit{font-weight:600}
@media(max-width:760px){.scroll-stage .scroll-replies-inline button{min-height:44px}}