/* 日记是揭开手札，博客是沿墨线展卷。 */
.archive-ink,.editor-ink{--folio-color:#925749;position:relative}
[data-folio=blog]{--folio-color:#4d7069}
.archive-ink .heading,.editor-ink .heading{position:relative}
.archive-ink .heading::after,.editor-ink .heading::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--folio-color),transparent 78%);
  transform-origin:left;animation:folio-rule .72s ease-out both;pointer-events:none
}
.archive-ink .archive-bar{animation:folio-rule-in .45s .12s both}
.archive-ink[data-folio=diary] .entries li{animation:folio-rule-in .42s ease-out both}
.archive-ink[data-folio=blog] .entries li{animation:folio-index .49s ease-out both}
.archive-ink .entries li:nth-child(2){animation-delay:.045s}
.archive-ink .entries li:nth-child(3){animation-delay:.09s}
.archive-ink .entries li:nth-child(4){animation-delay:.135s}
.editor-ink[data-folio=diary] .editor{transform-origin:center top;animation:folio-open .56s cubic-bezier(.2,.7,.25,1) both}
.editor-ink[data-folio=blog] .editor{animation:folio-scroll .58s ease-out both}
.editor-ink :is(input,textarea,select),.lot-note textarea{transition:box-shadow .24s,border-color .24s,background-color .24s}
.editor-ink :is(input,textarea,select):focus,.lot-note textarea:focus{border-color:var(--folio-color,#925749);box-shadow:inset 0 -2px color-mix(in srgb,var(--folio-color,#925749) 55%,transparent);background-color:#fffcf280}
.editor-ink .preview{scroll-margin-top:5rem}
.editor-ink .preview:not([hidden]){animation:folio-open .4s ease-out both}
@keyframes folio-rule{from{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:.85}}
@keyframes folio-rule-in{from{opacity:0;transform:translateY(.55rem)}}
@keyframes folio-index{from{opacity:.08;transform:translateX(-1.1rem)}70%{opacity:1}}
@keyframes folio-open{from{opacity:0;transform:perspective(900px) rotateX(-5deg) translateY(12px)}}
@keyframes folio-scroll{from{opacity:.25;clip-path:inset(0 100% 0 0 round 2rem)}to{clip-path:inset(0)}}
.entry-upload-count{color:#68594b;font-size:.9em}
.entry-upload-count:empty{display:none}
.entry-upload input::file-selector-button{font:inherit;color:var(--folio-color);background:#f7edda;border:1px solid #ab9273;padding:.38em .72em;margin-inline-end:.7em;cursor:pointer;transition:background-color .2s}
.entry-upload input::file-selector-button:hover{background-color:#ece0c8}
.layout-editor{padding:1rem clamp(.7rem,3vw,1.65rem);border-block:1px solid #99846970;background:linear-gradient(115deg,#9b826412,transparent 75%);min-width:0}
.layout-editor header,.layout-actions{display:flex;gap:.55rem;flex-wrap:wrap;align-items:center}
.layout-editor header{justify-content:space-between}
.layout-editor h2{margin:.25rem 0;font-size:1.65rem}
.layout-guide{font-size:.94em;color:var(--muted)}
.layout-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));gap:.5rem .85rem;margin:.7rem 0}
.layout-fields input[type=range]{width:100%;padding:0;accent-color:var(--folio-color);min-height:1.9rem}
.layout-editor details{border-top:1px solid #99846945;padding:.55rem 0}
.layout-editor summary,.lot-note summary{cursor:pointer;color:var(--folio-color,#824538)}
.layout-editor details[open]>:not(summary),.lot-note[open]>form{animation:folio-rule-in .22s ease-out both}
.layout-editor [data-block-name]{overflow-wrap:anywhere;color:var(--ink)}
.layout-editor textarea{min-height:5.75rem}
.entry-typeset{font-size:var(--entry-size,100%);display:flow-root;overflow-wrap:anywhere}
.entry-piece{margin-block:1.05rem;max-width:100%}
.entry-piece.align-left{margin-inline-end:auto}
.entry-piece.align-center{margin-inline:auto}
.entry-piece.align-right{margin-inline-start:auto}
.entry-typeset.align-left,.entry-piece.align-left{text-align:left}
.entry-typeset.align-center,.entry-piece.align-center{text-align:center}
.entry-typeset.align-right,.entry-piece.align-right{text-align:right}
.article .entry-piece :is(img,video){display:block;width:100%;height:auto;max-height:none;margin:0;object-fit:contain}
.piece-verse,.piece-text{width:fit-content}
.entry-typeset:not(.paper-plain),.entry-piece:not(.paper-plain){padding:clamp(.4rem,2vw,1.2rem)}
.entry-typeset .entry-piece.paper-plain{background:none}
.entry-typeset.paper-wash,.entry-piece.paper-wash{background:linear-gradient(#f5efdf50,#f5efdf1c),url('/paper-landscape.svg') center bottom/100% auto no-repeat}
.entry-typeset.paper-red,.entry-piece.paper-red{background:linear-gradient(125deg,#a84b3f26,transparent 72%),#e8c9ab27;border-inline-start:2px solid #a84b3f70}
.entry-typeset.paper-blue,.entry-piece.paper-blue{background:linear-gradient(145deg,#48686a26,transparent 72%),#b7bfb027;border-inline-start:2px solid #48686a70}
.verse-scroll{display:flex;flex-direction:row-reverse;justify-content:safe center;gap:.36em;overflow:auto;max-width:100%;max-height:75vh;padding:.35em;overscroll-behavior:contain}
.verse-scroll span{writing-mode:vertical-rl;text-orientation:mixed;flex:none;white-space:nowrap;line-height:1.65;letter-spacing:.15em}
.entry-typeset .ink-visible[data-effect=soak]{animation:type-soak .95s ease-out both}
.entry-typeset .ink-visible[data-effect=stroke]{animation:type-stroke .85s cubic-bezier(.25,.55,.28,1) both}
.entry-typeset .piece-verse.ink-visible[data-effect=stroke]{animation:none}
.piece-verse.ink-visible[data-effect=stroke] .verse-scroll span{animation:type-vertical .72s var(--column-delay) cubic-bezier(.25,.55,.28,1) both}
.entry-typeset .ink-visible[data-effect=veil]{animation:type-veil .85s ease-out both}
.entry-typeset .ink-visible[data-effect=seal]{animation:type-seal .55s cubic-bezier(.18,.75,.22,1) both}
.entry-typeset .ink-visible[data-effect=float]{animation:type-float .85s ease-out both}
@keyframes type-soak{0%{opacity:.1;filter:blur(5px);text-shadow:0 0 8px currentColor}60%{opacity:.8;filter:blur(.5px)}}
@keyframes type-stroke{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes type-vertical{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
@keyframes type-veil{from{opacity:0;filter:blur(8px);transform:translateX(-.7em)}}
@keyframes type-seal{0%{opacity:0;transform:scale(1.09) rotate(-1deg)}65%{opacity:1;transform:scale(.99)}}
@keyframes type-float{0%{opacity:.1;transform:translateY(.6em) skewX(-4deg)}55%{transform:translateY(-.13em) skewX(1deg)}}
.lot-note{margin-block:1.25rem 0;padding:.75rem 0;border-top:1px solid #9b82645c}
.lot-note textarea{width:100%;min-height:5rem;margin:.6rem 0}
.lot-note button{margin-inline-end:.6rem}
@media(prefers-reduced-motion:reduce){
  .archive-ink .heading::after,.editor-ink .heading::after,.archive-ink .archive-bar,.archive-ink #archiveEntries a,.archive-ink[data-folio] .entries li,.editor-ink[data-folio] .editor,.editor-ink .preview:not([hidden]),.layout-editor details[open]>:not(summary),.lot-note[open]>form,.entry-typeset .ink-visible[data-effect],.piece-verse.ink-visible[data-effect=stroke] .verse-scroll span{animation:none;transition:none}
}

