
.hero .collage>svg{position:absolute;inset:0;display:block;width:100%;height:100%}
.collage-dark-ink{display:none}
:root[data-theme=dark] .collage-dark-ink{display:block}
:root[data-theme=dark] .collage-replacement-copy{filter:url(#collage-light-ink)}
footer.foot-note{padding:30px 0 22px}
footer.foot-note .footer-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:24px;min-height:0;margin-bottom:18px}
.footer-bar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;padding:0 24px}
.footer-center{display:flex;flex-direction:column;align-items:center;gap:12px}
.footer-actions{display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:16px}
.footer-actions>*{flex-shrink:0}
.footer-post-actions{display:flex;align-items:center;gap:18px}
.footer-info-links{display:flex;align-items:center;gap:15px}
.footer-info-link{font:13px var(--f-body);color:var(--ink);padding:10px 0;white-space:nowrap}
.footer-info-link:hover{text-decoration:underline;text-underline-offset:3px}
.footer-info-link:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:2px}
.footer-separator{color:var(--muted);font-size:12px}
.footer-note{font:13px var(--f-body);color:var(--ink);padding:10px 0;white-space:nowrap}
.footer-note:hover{text-decoration:underline;text-underline-offset:3px}
.footer-actions .footer-add{order:0;white-space:nowrap}
.footer-add-wrap{position:relative;display:inline-flex}
.footer-flower{position:absolute;bottom:calc(100% + 12px);left:50%;width:49px;height:64px;transform:translateX(-50%) rotate(-8deg);color:var(--ink);pointer-events:none}
.footer-flower svg{display:block;width:100%;height:100%;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.footer-message{margin:0;font:12px/1.5 var(--f-body);color:var(--muted);white-space:nowrap}
.footer-copyright{display:flex;flex-wrap:wrap;align-items:center;align-content:center;column-gap:4px;min-height:38px;margin:0;text-align:left;font:12px/1.6 var(--f-body);color:var(--ink)}
.footer-copyright span{white-space:nowrap}
#footerBackTop{justify-self:end;background:var(--ink);color:var(--bg);font-size:13px;white-space:nowrap}
.back-top-short{display:none}
footer.foot-note .footer-layout .dmg{position:static;justify-self:start;max-width:205px}
footer.foot-note .footer-layout .footer-scrawl{position:static;justify-self:end;max-width:170px}
@media(max-width:760px){footer.foot-note{padding-bottom:16px}footer.foot-note .footer-layout{display:none}.footer-bar{grid-template-columns:minmax(0,1fr) auto;column-gap:10px;row-gap:10px;padding:0 20px}.footer-actions{justify-content:flex-start;gap:6px}.footer-copyright{grid-column:1/-1;min-height:0;font-size:11px;line-height:1.4}.footer-note,.footer-message{font-size:11px}.footer-actions .footer-add{font-size:12px;padding:9px 11px}#footerBackTop{font-size:12px;padding:9px 10px}.back-top-full{display:none}.back-top-short{display:inline}}
@media(max-width:360px){.footer-bar{column-gap:6px}.footer-actions{gap:4px}.footer-note,.footer-message{font-size:10px}.footer-actions .footer-add{font-size:11px;padding-inline:8px}#footerBackTop{font-size:11px;padding-inline:8px}}
@media(max-width:760px){footer.foot-note{padding-top:72px}.footer-flower{width:34px;height:44px;bottom:calc(100% + 42px)}}
.controls{position:sticky;top:0;z-index:30;background:var(--bg);border-bottom:1px solid #00157522;margin-bottom:15px}
.composer-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.composer .composer-heading .ctitle{margin:4px 0 0}
.composer-close{display:grid;place-items:center;flex:none;width:38px;height:38px;padding:0;background:transparent;border:1px solid #c8bb83;border-radius:50%;color:#0b1c60;font:28px/1 Arial,sans-serif}
.composer-close:hover,.composer-cancel:hover{background:#f0e9d8}
.composer-buttons{display:flex;align-items:center;gap:10px;margin-left:auto}
.composer .composer-cancel{background:transparent;color:#0b1c60;border:1px solid #918968;box-shadow:none}
.composer .composer-buttons .send{margin-left:0}
.composer-close:focus-visible,.composer-cancel:focus-visible{outline:2px solid #2145d5;outline-offset:3px}
.sort{margin-left:8px;padding-left:12px}
.sort button{white-space:nowrap;padding-inline:10px}
.wall-meta{display:flex;justify-content:space-between;align-items:center;margin:14px 0 20px;gap:12px;font-size:12px;color:var(--muted)}
.wall-meta .hint-label{font-family:var(--f-mono);font-size:11px}
#myHeading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:22px 0 12px}
.my-heading-title{display:flex;flex-direction:column;align-items:flex-start;gap:15px}
.back-all{background:transparent;color:var(--ink);border:1px solid currentColor;padding:9px 15px;font-size:13px;white-space:nowrap}
.back-all:hover{background:var(--panel)}
#myHeading h2{font:400 30px var(--f-head);margin:0;color:var(--ink)}
#myHint{font-size:13px;line-height:1.6;margin:0 0 25px;max-width:760px}
.wall-scene{min-height:0}
.load-area{text-align:center;padding:24px 0 6px;color:var(--muted);font-size:12px}
.load-area .btn{padding:13px 27px}
.minis{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.card .rstamp{position:relative;padding-right:40px}
.rstamp .report-flag{position:absolute;right:0;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;color:#e72b3c;padding:6px;width:32px;height:32px;border-radius:6px}
.rstamp .report-flag:hover{color:#c8172c;background:#e72b3c12}
.rstamp .report-flag:focus-visible{outline:2px solid #c8172c;outline-offset:2px}
.share-story{white-space:nowrap;font-size:12px;padding:5px 0}
.card .foot{gap:10px}.card .time,.card .minis{padding-left:10px}
#backTop{position:fixed;right:24px;bottom:22px;z-index:60;background:var(--ink);color:var(--bg);box-shadow:0 5px 18px #00157526;font-size:13px}
.toast{z-index:80;bottom:80px!important}
.wall-dialog{padding:26px;border:1px solid #c5b77e;border-radius:18px;background:#fff9e8;color:#0b1c60;width:min(540px,calc(100vw - 32px));max-height:85dvh;overflow:auto;box-shadow:0 20px 80px #0003}
.wall-dialog::backdrop{background:#06113f88}
.wall-dialog h2{font:400 27px var(--f-head);margin:6px 0 17px;color:#071575}
.wall-dialog p{font-size:14px;line-height:1.6}
.wall-dialog .dialog-hint{font-size:12px;color:#485279}
.wall-dialog .dialog-eyebrow{font:11px var(--f-mono);letter-spacing:.08em;color:#485279}
.wall-dialog input,.wall-dialog select{width:100%;border:1px solid #b4ae97;border-radius:8px;padding:12px;color:#071575;background:#fffef7;font-size:13px;min-width:0}
.wall-dialog textarea{display:block;width:100%;min-height:125px;resize:vertical;border:1px solid #b4ae97;border-radius:8px;padding:12px;color:#071575;background:#fffef7;font:14px/1.5 var(--f-body)}
.wall-dialog label{display:block;margin:16px 0 8px;font-size:12px;font-weight:700}
.dialog-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px}
.wall-dialog .btn:not(.primary){background:transparent;border:1px solid #b4ae97;color:#071575}
.info-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.info-close{display:grid;place-items:center;flex:none;width:36px;height:36px;padding:0;border:1px solid #b4ae97;border-radius:50%;background:transparent;color:#071575;font:27px/1 Arial,sans-serif}
.info-close:hover{background:#eee5ca}
.info-close:focus-visible{outline:2px solid #2145d5;outline-offset:3px}
.info-dialog h3{font:700 14px/1.5 var(--f-body);margin:22px 0 5px;color:#071575}
.info-dialog h3+p{margin-top:5px}
.how-steps{list-style:none;counter-reset:steps;padding:0;margin:22px 0}
.how-steps li{position:relative;counter-increment:steps;padding-left:40px;margin:18px 0;font:14px/1.6 var(--f-body)}
.how-steps li::before{content:counter(steps);position:absolute;left:0;top:0;display:grid;place-items:center;width:27px;height:27px;border:1px solid #b4ae97;border-radius:50%;font-size:12px}
.how-steps strong,.how-steps span{display:block}
.info-rules{border-top:1px solid #d9ceaa;margin-top:24px}
.info-dialog .dialog-actions{justify-content:flex-end}
@media(max-width:1100px){.footer-bar{grid-template-columns:minmax(0,1fr) auto;gap:12px}.footer-copyright{grid-column:1/-1}.footer-actions{justify-content:flex-start;gap:12px}}
@media(max-width:760px){.footer-actions{flex-wrap:wrap;row-gap:8px;column-gap:6px}.footer-post-actions{flex-basis:100%;gap:12px}.footer-info-links{gap:12px}.footer-info-link{font-size:11px}.footer-bar>#footerBackTop{align-self:end;margin-bottom:1px}.footer-flower{bottom:calc(100% + 86px)}}
@media(max-width:360px){.footer-bar{padding-inline:14px}.footer-post-actions,.footer-info-links{gap:9px}.footer-info-link{font-size:10px}}
#shareText{font-family:var(--f-quote);font-size:25px;font-weight:700;line-height:1.15;letter-spacing:-.025em}
#storyDialog{width:min(600px,calc(100vw - 32px));padding:24px}
#storyContent .card{margin:22px auto 0!important;min-height:0}
#storyRef{font-size:11px;color:#485279}
#storyDialog .dialog-actions{margin:0}

.empty-state{grid-column:1/-1;padding:35px;text-align:center;border:1px dashed #00157540;border-radius:10px}
.empty-state h2{font:400 24px var(--f-head)}
@media(max-width:1350px){.controls{flex-wrap:wrap;gap:3px;padding:8px}.controls .chips{flex-basis:100%}.sort{margin-left:auto;border:0;padding-left:0}.sort button{padding-block:5px}.controls .chip{padding:7px 11px;font-size:13px}}
@media(max-width:760px){.controls{padding:8px 0;gap:3px}.controls .chips{padding-bottom:5px}.sort button{font-size:13px}.wall-meta .hint-label{display:none}#myHeading{align-items:flex-start}#myHeading h2{font-size:26px}#addAnother{font-size:12px;padding:9px 13px}#backTop{right:15px;bottom:16px;font-size:12px;padding:10px 17px}.wall-dialog{padding:21px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* Center the flower and Add yours on the same axis as Load more stories. */
.footer-bar {grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.footer-copyright {grid-column:1;grid-row:1}
.footer-actions {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  grid-column:2;
  grid-row:1;
  column-gap:18px;
}
.footer-note-actions {display:flex;align-items:center;justify-content:flex-end;gap:16px;white-space:nowrap}
.footer-post-actions {display:contents}
.footer-add-wrap {grid-column:2;grid-row:1;justify-self:center}
.footer-info-links {grid-column:3;grid-row:1;justify-self:start}
.footer-bar>#footerBackTop {grid-column:3;grid-row:1}
.footer-flower {bottom:calc(100% + 12px)}
@media(max-width:1100px) {
  .footer-actions {grid-column:1/-1}
  .footer-copyright {grid-column:1/3;grid-row:2}
  .footer-bar>#footerBackTop {grid-row:2;align-self:center}
}
@media(max-width:600px) {
  .footer-actions {row-gap:9px;column-gap:10px}
  .footer-note-actions {grid-column:1/-1;grid-row:2;justify-content:center;gap:10px}
  .footer-info-links {grid-column:1/-1;grid-row:3;justify-self:center}
}

/* Leave room for the same paper width as the mobile wall. */
@media(max-width:760px){#storyDialog{width:calc(100% - 8px);max-width:calc(100% - 8px);padding:18px 12px}}

/* Keep the copy confirmation in the same button without moving the layout. */
#shareCopy{min-width:126px}

/* Approved footer drawing and caption */
footer.foot-note .footer-layout .shovel-scrawl{max-width:none;display:flex;align-items:center;gap:9px;color:var(--ink);font-size:18px;line-height:1.08}.shovel-scrawl span{white-space:nowrap}.shovel-scrawl .approved-shovel{width:56px;height:66px;object-fit:contain;flex:none}@media(max-width:1000px){footer.foot-note .footer-layout .shovel-scrawl{display:none}}

/* Preserve the approved drawing's alpha outline, using readable theme ink. */
:root[data-theme=dark] .shovel-scrawl .approved-shovel{display:none}
:root[data-theme=dark] .shovel-scrawl::after{content:"";display:block;width:56px;height:66px;flex:none;background:currentColor;-webkit-mask:url('/assets/shovel-approved.png') center/contain no-repeat;mask:url('/assets/shovel-approved.png') center/contain no-repeat}
