/* A small reply at the end of each story, never on top of the first-view artwork. */
.connection-card{--reply-accent:#97e9f3;position:relative;margin-top:38px;padding:26px 0 4px;border-top:1px solid #83c9da66;color:#edf9ff;text-align:left;isolation:isolate}
.connection-heading{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.connection-heading>div{min-width:0}.connection-card .connection-eyebrow,.connection-dialog .connection-eyebrow{margin:0 0 8px;font:600 .75rem/1.5 'Noto Sans JP',sans-serif;letter-spacing:.13em;color:#8ee0ef}
.connection-card h3{font-size:1.2rem;line-height:1.65;margin:0;font-weight:600;letter-spacing:0;color:#f4fbff;background:none;-webkit-text-fill-color:currentColor}
.connection-art{flex:0 0 64px;height:80px;background:url('assets/surfboards-atlas-v1.webp') 0 0/200% 200% no-repeat;transform:rotate(-8deg)}
.connection-card[data-theme=travel] .connection-art{display:none}
.connection-card[data-theme=travel]{--reply-accent:#ecd7a8;border-top-style:dashed}
.connection-card[data-theme=travel] .connection-eyebrow{color:#ecd7a8}
.connection-card[data-theme=garage] .connection-art{display:none}
.connection-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
.connection-card .connection-reaction{appearance:none;flex:1 1 220px;display:flex;align-items:center;gap:12px;min-height:80px;padding:14px 16px;background:#f1fbff;color:#063747;border:3px solid #fff;border-radius:6px 18px 6px 18px;box-shadow:3px 4px 0 #30677d7a;font:inherit;text-align:left;cursor:pointer;transition:transform .18s,box-shadow .18s;max-width:100%;overflow-wrap:anywhere}
.connection-card .connection-reaction:hover:not(:disabled){transform:translateY(-3px);box-shadow:3px 7px 0 #30677d7a}
.connection-card .connection-reaction:focus-visible,.connection-change:focus-visible,.connection-dialog :focus-visible{outline:3px solid #e8c56f;outline-offset:4px}
.connection-reaction[aria-pressed=true]{background:#a5e7e6;border-color:#d8ffef;box-shadow:0 0 0 1px #57babb}
.connection-card[data-theme=travel] .connection-reaction{background:#fff7e8;border-radius:2px;box-shadow:2px 4px 0 #554d424d;border:1px solid #e2cfaa;border-left:4px solid #cca862}
.connection-card[data-theme=travel] .connection-reaction[aria-pressed=true]{background:#e6e3bf;border-color:#b2c291}
.reaction-number{font:600 1.5rem/1 'Barlow Condensed',sans-serif;color:#407589;border-right:1px dashed #36657866;padding-right:11px;flex-shrink:0}
.reaction-text{display:grid;gap:7px;min-width:0}.reaction-text strong{font-size:1rem;font-weight:600;line-height:1.6}.reaction-state{font-size:.875rem;line-height:1.5;color:#275d68}
.connection-reaction:disabled{opacity:.65;cursor:wait}
.connection-card .connection-identity,.connection-card .connection-status{font-size:.875rem;line-height:1.7;margin:16px 0 0;color:#c1d9e5;overflow-wrap:anywhere}
.connection-card .connection-status:empty{display:none}.connection-card .connection-status{color:#a5ece6}.connection-card .connection-status.is-error{color:#ffd1b4}
.connection-card .connection-change{display:inline-block;padding:8px 0;min-height:40px;border:0;background:none;color:#bbdbe8;font:inherit;font-size:.875rem;text-decoration:underline;cursor:pointer}.connection-change[hidden]{display:none!important}
.connection-next:empty{display:none}.connection-next{margin-top:20px;padding:20px;border-left:2px solid var(--reply-accent);background:#7daec512;border-radius:0 8px 8px 0}
.connection-next strong{font-size:1rem}.connection-card .connection-next p{font-size:.875rem;line-height:1.8;color:#c1d9e5;margin:10px 0}
.connection-next a{display:block;margin-top:12px;padding:12px 0;color:#ceffff;font-size:1rem;text-decoration:underline;min-height:44px}
.connection-next .connection-schedule{background:#a5e7e6;color:#063747;text-align:center;border-radius:5px;padding:12px;text-decoration:none}
.connection-dialog{box-sizing:border-box;position:fixed;inset:0;margin:auto;width:min(520px,calc(100vw - 24px));max-width:none;height:fit-content;max-height:90svh;overflow-y:auto;border:1px solid #709caf;border-radius:14px;padding:30px;background:#082738;color:#f4fbff;font-family:'Noto Sans JP',sans-serif;text-align:left;box-shadow:0 30px 90px #0008;overscroll-behavior:contain}
.connection-dialog::backdrop{background:#00111bd1;backdrop-filter:blur(5px)}
.connection-dialog[open]{display:block}.connection-dialog form{margin:0;display:block}.connection-dialog h2{font-size:1.55rem;line-height:1.5;margin:0 32px 18px 0;color:#f4fbff;-webkit-text-fill-color:currentColor;background:none;letter-spacing:0}
.connection-dialog .connection-close{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:44px;height:44px;border:0;background:#ffffff12;border-radius:50%;font-size:1.8rem;line-height:1;color:#e4f8ff;cursor:pointer}
.connection-chosen{padding:16px;border-left:3px solid #91e6e8;background:#91e6e815;font-size:1rem;line-height:1.7;color:#e4ffff;margin:0 0 20px}
.connection-dialog .connection-intro{font-size:.875rem;line-height:1.8;color:#c1d9e5;margin:0 0 18px}
.connection-dialog label{display:block;font-size:.875rem;margin:16px 0;color:#eaf7fd}
.connection-dialog input{display:block;box-sizing:border-box;margin-top:7px;width:100%;min-height:48px;padding:12px;border:1px solid #5b8197;border-radius:5px;background:#031e2e;color:#fff;font:inherit;font-size:1rem}
.connection-dialog .connection-consent{display:flex;gap:12px;align-items:flex-start;line-height:1.8;margin-top:22px}
.connection-dialog .connection-consent input{width:20px;height:20px;min-height:20px;margin-top:4px;flex-shrink:0;accent-color:#73ddd8}
.connection-consent small{display:block;font-size:.8125rem;line-height:1.8;margin-top:8px;color:#b4d0dc}
.connection-dialog .connection-submit{display:block;width:100%;padding:15px 12px;border:0;border-radius:5px;background:#a5e7e6;color:#063747;font:600 1rem/1.5 'Noto Sans JP',sans-serif;cursor:pointer;min-height:48px}
.connection-dialog .connection-submit:disabled{opacity:.6;cursor:wait}.connection-dialog .connection-error{color:#ffd1b4;font-size:.875rem;line-height:1.7;margin:12px 0}
.connection-footnote{font-size:.8125rem;line-height:1.7;color:#b4d0dc;margin:14px 0 0}
.connection-trap{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.connection-open{overflow:hidden}.connection-disclosure{margin:22px 0 30px}.connection-disclosure>summary{min-height:44px;padding:12px 0;cursor:pointer;font-size:1rem;color:#ace0f0}
.connection-disclosure .connection-card{margin-top:8px}.connection-card button,.connection-dialog button,.connection-dialog input{touch-action:manipulation}
@media(max-width:600px){.connection-card{margin-top:28px;padding-top:22px}.connection-heading{align-items:center;gap:8px}.connection-card h3{font-size:1.125rem}.connection-art{flex-basis:50px;height:70px}.connection-card .connection-reaction{flex-basis:100%;min-height:76px}.connection-dialog{padding:24px 20px;max-height:92svh}.connection-next{padding:16px}}
@media(prefers-reduced-motion:reduce){.connection-card .connection-reaction{transition:none;transform:none!important}}
.service-finder-entry{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 20px;border:1px solid #6ca7b17a;border-radius:6px;background:#06283ceb;text-align:left}.service-finder-entry p{font-size:.875rem;line-height:1.8;margin:0;color:#d4eaf2}.service-finder-entry button,.service-guide-open{font:600 1rem/1.7 'Noto Sans JP',sans-serif;min-height:48px;padding:12px 20px;border:1px solid #abe5e2;border-radius:5px;background:#a5e7e6;color:#063747;cursor:pointer}.service-guide-open{display:block;width:100%;margin:0 0 22px}.service-guide-choices{display:grid;gap:12px;margin:26px 0}.service-guide-choice{display:flex;align-items:center;gap:16px;width:100%;padding:20px 18px;text-align:left;border:1px solid #588395;border-radius:6px;background:#062333;color:#edf9ff;font:inherit;cursor:pointer}.service-guide-choice>span:nth-child(2){flex:1;min-width:0}.service-guide-choice strong{display:block;font-size:1rem;line-height:1.7;font-weight:500}.service-guide-choice small{display:block;font-size:.875rem;line-height:1.7;color:#9cdddf;margin-top:7px}.service-guide-number{font:600 1.5rem/1 'Barlow Condensed',sans-serif;color:#85c9d4}.service-guide-choice:hover{background:#123948;border-color:#a5e7e6}.service-need-picker{padding:22px;border:1px solid #467884;border-radius:6px;background:#0b2c3b}.connection-card .service-need-picker h4{font-size:1rem;line-height:1.8;margin:0 0 8px;color:#e9f8fe}.connection-card .service-need-note{font-size:.8125rem;color:#bdd4df;line-height:1.8;margin:8px 0 16px}.service-need-options{display:grid;gap:10px}.service-need-choice{width:100%;padding:14px 16px;text-align:left;min-height:50px;font:500 1rem/1.8 'Noto Sans JP',sans-serif;border:1px solid #547f91;border-radius:5px;color:#e8f7ff;background:#092334;cursor:pointer}.service-need-choice[aria-pressed=true]{background:#c3f0e8;color:#0d3b42;border-color:#e6fff7;box-shadow:inset 4px 0 #408d8d}.service-need-choice:disabled,.service-need-send:disabled{opacity:.6;cursor:wait}.service-need-result{border-top:1px solid #456c7b;padding-top:18px;margin-top:20px}.connection-card .service-need-result>p:first-child{font-size:1rem;line-height:1.9;color:#e0f0f7;margin:0 0 12px}.service-need-proof{display:block;font:inherit;font-size:.875rem;line-height:1.8;text-align:left;color:#b0e9e6;background:none;border:0;text-decoration:underline;text-underline-offset:5px;padding:12px 0;min-height:44px;cursor:pointer}.service-need-send{display:block;width:100%;margin-top:16px;border:0;border-radius:5px;padding:15px 16px;min-height:52px;background:#a5e7e6;color:#063747;font:600 1rem/1.8 'Noto Sans JP',sans-serif;cursor:pointer}.service-need-result .service-need-note{margin-bottom:0}.connection-card .service-need-saved{font-size:.875rem;color:#a7e9d9;line-height:1.8;margin:16px 0 0}.service-need-saved:empty{display:none}.connection-lighter{margin:20px 0 0}.connection-lighter>summary{font-size:.875rem;line-height:1.8;color:#bfd8e4;min-height:44px;padding:12px 0;cursor:pointer}.connection-lighter .connection-actions{margin-top:12px}.connection-known{font-size:1rem;line-height:1.8;margin:0 0 14px;color:#d6f3f6}.connection-dialog [hidden]{display:none!important}.connection-chosen{white-space:pre-line}.service-finder-entry button:focus-visible,.service-guide-choice:focus-visible,.service-need-picker button:focus-visible,.service-need-proof:focus-visible,.service-guide-open:focus-visible{outline:3px solid #ead192;outline-offset:4px}@media(max-width:650px){.service-finder-entry{display:block;padding:16px}.service-finder-entry button{width:100%;margin-top:12px;padding:12px}.service-need-picker{padding:18px 14px}.service-guide-choice{padding:16px 14px;gap:12px}.service-need-choice{padding:12px}.service-finder-entry p{font-size:.875rem}}