/* The delivery time tool, both sides (owner, 2026-10-13). Colours come from the page's own tokens, so the global pages wear the dusk violet and the Japan pages the blue. */
.dt-wrap { width: min(980px, 100% - 32px); margin-inline: auto; padding-block: 28px 56px; display: grid; gap: 14px; }
.dt-wrap h1 { margin: 0; text-wrap: balance; }
.dt-lede { margin: 0; max-width: 42rem; color: var(--muted, #5d6874); font-size: 1.1rem; }
.dt-card { background: var(--warm, #fff); border: 1px solid var(--read-line, #d8dce6); border-radius: 18px; padding: 20px; display: grid; gap: 16px; }
.dt-kinds { display: flex; flex-wrap: wrap; gap: 8px; }
.dt-kind { font: inherit; padding: 10px 16px; border-radius: 999px; border: 2px solid var(--read-line, #d8dce6); background: transparent; color: inherit; cursor: pointer; }
.dt-kind[aria-pressed="true"] { background: var(--accent, #274a78); border-color: var(--accent, #274a78); color: #fff; }
.dt-kind:focus-visible, .dt-when input:focus, .dt-when input:focus-within, .dt-when input:focus-visible, .dt-card input:focus-visible, .dt-card select:focus-visible, .dt-linkbtn:focus-visible { outline: 3px solid var(--accent-bright, #6171c2); outline-offset: 2px; }
.dt-ask { display: grid; gap: 8px; }
.dt-ask[hidden] { display: none; }
.dt-ask fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
.dt-ask legend { font-weight: 700; margin-bottom: 6px; }
.dt-ask label small, .dt-when label small { font-weight: 400; color: var(--muted, #5d6874); }
.dt-card select, .dt-card input[type="number"], .dt-card input[type="datetime-local"] { font: inherit; font-size: 1.05rem; padding: 10px 12px; border-radius: 12px; border: 2px solid var(--read-line, #d8dce6); background: #fff; color: #1d1a2b; max-width: 26rem; width: 100%; box-sizing: border-box; }
.dt-when { display: grid; gap: 6px; }
.dt-linkbtn { justify-self: start; font: inherit; background: none; border: 0; color: var(--accent, #274a78); text-decoration: underline; cursor: pointer; padding: 4px 0; }

#dt-result { display: grid; gap: 14px; }
#dt-result h2 { margin: 0; font-size: 1.35rem; }
.dt-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 14px; }
.dt-col { border: 2px solid var(--read-line, #d8dce6); border-radius: 16px; padding: 16px; display: grid; gap: 12px; align-content: start; }
.dt-col h3 { margin: 0; font-size: 1.05rem; letter-spacing: .04em; text-transform: uppercase; color: var(--muted, #5d6874); }
.dt-priority { border-color: var(--accent, #274a78); background: var(--accent-wash, #eef1f8); }
.dt-row { display: grid; gap: 2px; padding-bottom: 10px; border-bottom: 1px solid var(--read-line, #d8dce6); }
.dt-row:last-of-type { border-bottom: 0; }
.dt-what { color: var(--muted, #5d6874); font-size: .95rem; }
.dt-day { font-size: 1.25rem; }
.dt-date { font-size: 1rem; }
.dt-local { font-size: .9rem; color: var(--muted, #5d6874); }
.dt-count { font-variant-numeric: tabular-nums; font-size: 1.1rem; color: var(--accent-deep, #1d3a63); font-weight: 700; }
.dt-fee { display: grid; gap: 4px; padding: 10px 12px; border-radius: 12px; background: #fff; font-size: .95rem; }
.dt-fee b { font-size: 1.05rem; }
.dt-parts { border: 1px solid var(--read-line, #d8dce6); border-radius: 14px; padding: 14px 16px; }
.dt-parts h3 { margin: 0 0 6px; font-size: 1rem; }
.dt-parts ul { margin: 0; padding-left: 1.2rem; display: grid; gap: 4px; }
.dt-rule, .dt-note, .dt-fine, .dt-none { margin: 0; color: var(--muted, #5d6874); font-size: .95rem; }
.dt-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 8px; counter-reset: s; }
.dt-steps li { counter-increment: s; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--read-line, #d8dce6); font-size: .95rem; }
.dt-steps li::before { content: counter(s); display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; margin-right: .5rem; border-radius: 50%; background: var(--accent, #274a78); color: #fff; font-size: .8rem; }
.dt-steps li.on { border-color: var(--accent, #274a78); font-weight: 700; }
