/* Chapter copy describes an action; background copy holds the philosophy. */
#filing>header .eyebrow,#filing>header>p{display:none}
#filing>header h2{margin:0;font-size:32px;line-height:1.15}
#filing>header{margin-bottom:22px}
#filing .filing-caption{padding-top:92px}
#filing .filing-pdf,#filing .filing-draft{transition:opacity .46s ease-in-out}
#filing .filing-pdf{opacity:1}#filing .filing-draft{opacity:0;pointer-events:none}
#filing [data-writing=true] .filing-pdf{opacity:0}
#filing [data-writing=true] .filing-draft{opacity:1;pointer-events:auto}
#filing .file-anchor{padding:0;border:0;cursor:grab;touch-action:none}
#filing .file-anchor::after{content:'';position:absolute;inset:-12px -18px}
#filing .file-anchor:focus-visible{outline:2px solid #8b692f;outline-offset:8px}
#filing .file-mark.two{width:79.6%}
#filing .file-mark.three{left:12.2%;top:19.05%;width:79.6%;height:1.7%}
#filing .file-mark.four{left:12.2%;top:20.75%;width:23.2%;height:1.7%}
#filing .file-anchor{height:6.8%}
#filing .file-pointer,#filing .file-pile-heading,#filing .file-caret{display:none}
#filing .file-new-pile{padding-top:44px}
#filing #filePileAdd{position:absolute;display:block;top:0;left:12px;width:calc(100% - 12px);padding:0 0 12px;text-align:left;font:italic 14px/22px var(--serif);color:#746e62;background:none;border:0;cursor:pointer;transition:color .2s}
#filing #filePileAdd:disabled{cursor:default}
#filing #filePileAdd:focus-visible{outline:2px solid #8b692f;outline-offset:5px}
#filing [data-aim=true] #filePileAdd,#filing #filePileAdd:hover:not(:disabled){color:#1d1a15}
.file-target-hint{display:block;font:11px/18px -apple-system,sans-serif;color:#8b692f;opacity:0;transition:opacity .25s}
#filing [data-phase=carry] .file-target-hint{opacity:1}
#filing .filed-capsule{height:20px;margin-top:8px;opacity:0;transition:opacity .4s,filter .4s;filter:blur(4px)}
#filing [data-saved=true] .filed-capsule{opacity:1;filter:none}
#filing .file-next-pile{height:22px;margin-top:14px;opacity:.6}
#filing .filing-dock{bottom:0;top:auto}
#filing .dock-carry{display:none}
#filing .file-traveller{position:absolute;border-radius:99px}
#return>header{margin-bottom:16px}
#return>header h2{font-size:34px}
.return-benefit{font:17px/1.5 var(--serif);margin:12px auto 0;max-width:46ch;color:#48443c}
#return .third-caption-band{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0}
#return .third-actions{margin:0 auto 18px;gap:22px}
#return #recallNote{color:#332e24}
#return #recallNote span{color:#8b692f;margin-left:5px}
#return #showReminder,#return #resetWorkspace{font-size:12px;color:#655f54;border-bottom-color:transparent}
#return .recall-editor{height:610px}
#return{padding-bottom:48px}
@media(min-width:1151px) and (max-height:840px){
 #return{padding-top:22px;padding-bottom:38px}
 #return>header h2{font-size:30px}
 #return>header{margin-bottom:10px}
 #return .return-benefit{margin-top:7px;font-size:16px}
 #return .third-actions{margin-bottom:14px}
 #return .recall-editor{height:clamp(500px,calc(100svh - 206px),610px)}
}
@media(max-width:1150px){
 #filing .filing-caption{padding:0;min-height:100px}
 #filing>header h2{font-size:30px}
 #return .recall-editor{height:610px}
 #return .third-actions{margin-bottom:18px}
 #return .return-benefit{max-width:34ch}
}
@media(max-width:600px){
 #return>header h2{font-size:29px}
 #return .return-benefit{font-size:17px}
 #return .third-actions{gap:6px 18px}
 #return .recall-editor{height:570px}
}
@media(prefers-reduced-motion:reduce){#filing .filing-pdf,#filing .filing-draft,#filing .filed-capsule{transition:none}}
@media(min-width:1151px){
 #return>header .return-benefit{max-width:none;width:auto}
 #return .recall-editor{height:640px}
}
@media(min-width:1151px) and (max-height:840px){
 #return .recall-editor{height:clamp(540px,calc(100svh - 184px),640px)}
 #return{padding-top:18px;padding-bottom:32px}
 #return .third-actions{min-height:28px;margin-bottom:12px}
}
#filing .file-anchor:disabled{cursor:default}
@media(max-width:760px){
 #filing .filing-caption{min-height:64px}
 #filing .filing-caption h3{font-size:24px}
}
/* A guided demonstration: invitation sits beside the highlight, outside the app. */
#filing .filing-layout{grid-template-columns:800px 184px}
#filing .composition-view-shell{order:1}
#filing .filing-caption{order:2;padding-top:158px;min-height:0}
#filing .filing-caption h3{font-size:26px;line-height:1.18;margin-bottom:16px}
.filing-invitation{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:22px}
.filing-invitation button{font:14px/1.5 -apple-system,sans-serif;color:#80602c;padding:6px 0;border:0;border-bottom:1px solid #80602c65;background:none;cursor:pointer}
.filing-invitation button:disabled{color:#81796b;border-color:transparent;cursor:default}
.filing-invitation button:focus-visible{outline:2px solid #80602c;outline-offset:5px}
#filing #fileInspect{order:-1;font-size:14px;color:#80602c;border-bottom-color:#80602c65}
#filing #fileReplay[data-quiet=true]{font-size:12px;color:#625b4e;border-bottom-color:transparent}
#filing .file-anchor{cursor:grab;pointer-events:auto;-webkit-appearance:none;appearance:none;z-index:2}
#filing .filing-pdf,#filing .filing-draft{transition:none}
#filing .file-pointer{display:block;pointer-events:none}
#filing .file-hand-open{opacity:0}#filing .file-hand-closed{opacity:1}
#filing #filePileAdd{cursor:default;padding-bottom:0}
#filing .file-new-pile{padding-top:24px}
#filing .filed-capsule{opacity:var(--receipt,0);filter:none;transition:none}
#filing [data-saved=true] .filed-capsule{opacity:var(--receipt,0)}
#filing [data-phase=inspection] .filing-draft{pointer-events:auto}
@media(max-width:1150px){
 #filing .filing-caption{order:-1;padding:0}
 #filing .filing-layout{display:flex;gap:20px}
 .filing-invitation{flex-direction:row;flex-wrap:wrap;gap:12px 22px;margin-top:12px}
}
/* One typography definition for both painting treatments, including text measure. */
html[data-edge] .hero-copy{left:50%;right:auto;width:86vw;transform:translateX(-50%);top:clamp(110px,8vw,160px)}
html[data-edge] .hero h1{font-size:clamp(62px,7.5vw,130px);line-height:1.03}
html[data-edge] .hero-copy p{font-size:clamp(25px,2.25vw,37px);line-height:1.4;margin-top:38px}
@media(max-width:760px){
 html[data-edge] .hero-copy{width:88vw;top:145px}
 html[data-edge] .hero h1{font-size:clamp(44px,10.6vw,74px)}
 html[data-edge] .hero-copy p{font-size:25px;margin-top:30px}
}
@media(min-width:1151px){
 #filing .filing-window{grid-column:1;grid-row:1}
 #filing .filing-caption{grid-column:2;grid-row:1}
}

/* Highlight rectangles follow individual text lines, leaving paper between them. */
#filing .filing-page .file-mark{height:1.38%;transform:translateY(1px)}
/* A generous annotation gutter separates the teaching voice from the app. */
@media(min-width:1151px){
 #filing>header,#filing .filing-layout{width:calc(100% - 112px);max-width:1064px}
 #filing .filing-layout{grid-template-columns:800px minmax(0,200px);gap:64px}
 #filing>header{box-sizing:border-box;padding:0;margin-bottom:24px}
 #filing>header h2{width:800px;margin-left:auto;font-size:32px;line-height:1.15}
 #filing .filing-caption{padding-top:105px}
 #filing .filing-caption h3{max-width:180px;font-size:27px;line-height:1.2}
 #filing .filing-caption>p{max-width:185px;line-height:1.65}
 #filing .filing-invitation{margin-top:24px;min-height:76px}
}
@media(min-width:1151px) and (max-width:1279px){
 #filing>header,#filing .filing-layout{width:calc(100% - 80px)}
 #filing .filing-layout{grid-template-columns:800px minmax(0,1fr);gap:40px}

}

/* Filing receipt: a promise of a place, quieter than the kept notes. */
#filing .filed-capsule{height:calc(var(--receipt,0)*20px);margin-top:calc(var(--receipt,0)*8px);color:rgb(29 26 21 / var(--receipt-ink,.225));font-style:normal}
#filing .filed-capsule i{background:rgb(29 26 21 / var(--receipt-ink,.225))}
#filing #filePileAdd{color:rgb(29 26 21 / calc(.55 + var(--aim-ink,0)*.45));transition:none}

#filing .filing-caption{min-height:245px}
#filing .filing-caption>#filingCopy{min-height:112px}
#filing .filing-invitation button{font-size:14px;line-height:1.5}
@media(min-width:1151px){
 #filing>header h2{width:100%;margin:0;white-space:normal}
 #filing>header{margin-bottom:28px}
 #filing .filing-caption{padding-top:105px}
}
@media(max-width:1150px){
 #filing .filing-caption{min-height:0}
 #filing .filing-caption>#filingCopy{min-height:72px}
}
#filing [data-aim=true] #filePileAdd{color:rgb(29 26 21 / calc(.55 + var(--aim-ink,0)*.45))}
#filing .filing-invitation button:not(:disabled){color:#71501d}
@media(min-width:1151px) and (max-height:760px){
 #filing{padding-bottom:38px;scroll-margin-top:14px}
}

/* The annotation stays beside the filing destination; the window never swaps sides. */
#filing .composition-view-shell{grid-column:1;grid-row:1}
#filing .filing-caption h3{min-height:65px}
#filing .filing-caption .filing-gesture-hint{font:12px/1.5 -apple-system,sans-serif;color:#6d665a;margin:16px 0 0;min-height:18px}
#filing .filing-gesture-hint[hidden]{display:block;visibility:hidden}
#filing .filing-invitation{margin-top:3px;gap:12px}
#filing .filing-pdf{user-select:none;-webkit-user-select:none}
#filing .filing-pdf img{-webkit-user-drag:none;pointer-events:none}
#filing .file-mark{pointer-events:none}
#filing .file-anchor:active{cursor:grabbing}
#filing .file-anchor:disabled{pointer-events:none}
@media(max-width:1150px){
 #filing .filing-caption h3{min-height:0}
 #filing .filing-caption .filing-gesture-hint{margin-top:10px}
 #filing .filing-caption>#filingCopy{min-height:48px}
}
