/* Adapted from the supplied calculator. Shared site styles own the shell and navigation. */
html { min-height:100%; background:#fcf7ee var(--dream-background-image) center top/cover fixed no-repeat; }
body.postage-page { background:transparent; }
.postage-page { --postage-ink:#6d4f53; --postage-muted:#948b94; --postage-pink:#c45c78; }
.postage-page .dreamland-topbar { min-height:42px; padding-top:max(6px,env(safe-area-inset-top)); }
.postage-page .dream-back-pill { min-height:34px; padding-inline:12px; font-size:12px; }
.postage-page .postage-hero { display:flex; align-items:center; gap:10px; min-height:78px; margin:3px 0 8px; padding:5px 2px; border:0; background:none; }
.postage-page .postage-hero .dreamland-card-icon { width:34px; height:34px; flex:0 0 34px; border-radius:11px; background:#fce3e8; font-size:17px; }
.postage-page .postage-hero-copy { min-width:0; }
.postage-page .postage-hero p { margin:0 0 2px; }
.postage-page .postage-hero h1 { font-size:24px; }
.postage-page .postage-hero-copy>span { display:block; margin-top:3px; color:var(--postage-muted); font-size:10px; line-height:1.4; }
.postage-page #postage-rules-open { cursor:pointer; }
.postage-page .postage-region-bar { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:54px; padding:7px 9px 7px 13px; border:1px solid #e9b6c4; border-radius:16px; background:rgba(255,246,248,.96); box-shadow:0 4px 14px rgba(169,95,116,.09); }
.postage-page .postage-region-label { display:flex; align-items:center; gap:5px; flex-shrink:0; color:#9d4c66; font-size:12px; }
.postage-page .postage-region-label span { font-size:15px; }
.postage-page .postage-section { margin-top:9px; padding:11px 11px 10px; border:1px solid rgba(217,120,143,.18); border-radius:16px; background:rgba(255,253,249,.86); box-shadow:0 5px 16px rgba(94,68,61,.045); }
.postage-page .postage-section-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 2px 8px; }
.postage-page .postage-section-head small,.postage-page .postage-result-heading small { color:#c48796; font-size:9px; font-weight:700; letter-spacing:.15em; }
.postage-page .postage-section-head h2,.postage-page .postage-result-heading h2 { margin:2px 0 0; color:var(--postage-ink); font-size:16px; line-height:1.2; }
.postage-page .postage-section-head>span:not(.postage-collapse-title):not(.postage-disclosure) { color:#df9aae; font-size:17px; }
.postage-page .postage-items { display:grid; gap:5px; }
.postage-page .postage-item { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:7px; min-height:49px; padding:5px 8px 5px 10px; border:1px solid rgba(226,196,185,.28); border-radius:11px; background:rgba(255,255,255,.8); }
.postage-page .postage-item-icon { display:none; }
.postage-page .postage-item-icon--pink { color:#c57e91; background:#fce3e8; }
.postage-page .postage-item-icon--blue { color:#8491b0; background:#e9eafb; }
.postage-page .postage-item-icon--yellow { color:#aa8b4f; background:#fbf2d6; }
.postage-page .postage-item-icon--green { color:#7f9b83; background:#e8f1e7; }
.postage-page .postage-item-copy { display:flex; align-items:baseline; flex-wrap:wrap; column-gap:6px; min-width:0; }
.postage-page .postage-item-copy strong { color:var(--postage-ink); font-size:12px; font-weight:650; line-height:1.3; }
.postage-page .postage-item-copy small { color:var(--postage-muted); font-size:10px; line-height:1.3; }
.postage-page .postage-stepper { display:flex; align-items:center; gap:1px; flex-shrink:0; padding:2px; border-radius:999px; background:#f9f0ef; }
.postage-page .postage-stepper button { display:grid; width:28px; height:28px; place-items:center; padding:0; border:0; border-radius:50%; color:#fff; background:var(--postage-pink); font:600 17px/1 system-ui,sans-serif; cursor:pointer; }
.postage-page .postage-stepper button:disabled { color:#bbafb0; background:#eee5e5; cursor:default; }
.postage-page .postage-stepper output { min-width:22px; color:var(--postage-ink); font-size:13px; font-weight:700; text-align:center; }
.postage-page .postage-region { display:grid; grid-template-columns:1fr 1fr; gap:4px; width:min(60%,220px); padding:3px; border-radius:999px; background:#f5e8eb; }
.postage-page .postage-region label { cursor:pointer; }
.postage-page .postage-region input { position:absolute; width:1px; height:1px; opacity:0; }
.postage-page .postage-region span { display:grid; min-height:32px; place-items:center; padding:3px 5px; border:1px solid transparent; border-radius:999px; color:#9a8188; background:transparent; font-size:10px; font-weight:650; text-align:center; white-space:nowrap; }
.postage-page .postage-region input:checked+span { border-color:#e6b5c2; color:#a94f6b; background:#fff; box-shadow:0 2px 6px rgba(169,95,116,.08); }
.postage-page .postage-region input:focus-visible+span { outline:2px solid var(--postage-pink); outline-offset:2px; }
.postage-page .postage-collapsible { padding-block:0; }
.postage-page .postage-collapsible>summary { min-height:53px; margin:0; cursor:pointer; list-style:none; }
.postage-page .postage-collapsible>summary::-webkit-details-marker { display:none; }
.postage-page .postage-collapse-title { display:grid; gap:2px; }
.postage-page .postage-collapse-title>strong { color:var(--postage-ink); font-size:16px; line-height:1.2; }
.postage-page .postage-collapse-title em { margin-left:4px; color:#b35f78; font-size:10px; font-style:normal; font-weight:600; }
.postage-page .postage-disclosure { color:#ad7282; font-size:10px; white-space:nowrap; }
.postage-page .postage-disclosure i { display:inline-block; margin-left:2px; font-size:15px; font-style:normal; transition:transform .2s ease; }
.postage-page .postage-collapsible[open] .postage-disclosure i { transform:rotate(180deg); }
.postage-page .postage-collapsible[open] { padding-bottom:10px; }
.postage-page .postage-result { margin-top:10px; padding:12px; border:1px solid #edc9d1; border-radius:17px; background:linear-gradient(145deg,rgba(255,247,247,.98),rgba(255,253,249,.94)); box-shadow:0 8px 22px rgba(153,91,104,.07); }
.postage-page .postage-result-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.postage-page #postage-reset { padding:7px 10px; border:1px solid rgba(217,120,143,.25); border-radius:999px; color:#a75d72; background:#fff; font:600 11px/1 system-ui,sans-serif; cursor:pointer; }
.postage-page .postage-result-total { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-top:10px; padding:11px 12px; border-radius:12px; background:#f9e8eb; }
.postage-page .postage-result-total span { color:#8a626b; font-size:13px; font-weight:600; }
.postage-page .postage-result-total strong { color:#ad4668; font-size:26px; line-height:1; white-space:nowrap; }
.postage-page .postage-breakdown { display:grid; gap:6px; margin-top:11px; padding:0 2px; }
.postage-page .postage-breakdown>div,.postage-page .postage-threshold>div:first-child { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--postage-muted); font-size:11px; }
.postage-page .postage-breakdown strong,.postage-page .postage-threshold strong { color:var(--postage-ink); font-size:12px; white-space:nowrap; }
.postage-page .postage-threshold { margin-top:10px; padding-top:9px; border-top:1px dashed #e8c9d0; }
.postage-page .postage-progress { height:7px; margin-top:9px; overflow:hidden; border-radius:999px; background:#f0e7e7; }
.postage-page .postage-progress i { display:block; width:0; height:100%; border-radius:999px; background:linear-gradient(90deg,#e6a7b8,#c45c78); transition:width .2s ease; }
.postage-page .postage-result-note { margin:8px 0 0; color:#a66679; font-size:10px; line-height:1.4; }
.postage-page .postage-rules-dialog { width:min(390px,calc(100% - 28px)); max-height:min(580px,calc(100dvh - 48px)); margin:auto; padding:20px; overflow:auto; border:1px solid #ebcbd2; border-radius:22px; color:var(--postage-ink); background:#fffaf7; box-shadow:0 20px 60px rgba(76,49,59,.2); }
.postage-page .postage-rules-dialog::backdrop { background:rgba(73,56,65,.42); backdrop-filter:blur(3px); }
.postage-page .postage-dialog-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.postage-page .postage-dialog-head small { color:#c48796; font-size:9px; font-weight:700; letter-spacing:.15em; }
.postage-page .postage-dialog-head h2 { margin:3px 0 0; font-size:20px; line-height:1.3; }
.postage-page #postage-rules-close { display:grid; width:32px; height:32px; flex:0 0 32px; place-items:center; padding:0; border:0; border-radius:50%; color:#9f7180; background:#f6e9ed; font:22px/1 system-ui,sans-serif; cursor:pointer; }
.postage-page .postage-dialog-intro,.postage-page .postage-dialog-note { margin:14px 0 0; color:#82777d; font-size:12px; line-height:1.6; }
.postage-page .postage-dialog-table { margin-top:14px; overflow:hidden; border:1px solid #ecdde0; border-radius:12px; }
.postage-page .postage-dialog-table>div { display:grid; grid-template-columns:1.2fr 1fr 1fr; align-items:center; min-height:39px; padding:0 10px; gap:5px; border-bottom:1px solid #f0e5e7; font-size:11px; }
.postage-page .postage-dialog-table>div:first-child { color:#9d6073; background:#fbf0f3; }
.postage-page .postage-dialog-table>div:last-child { border-bottom:0; }
.postage-page .postage-dialog-table strong:not(:first-child),.postage-page .postage-dialog-table span:not(:first-child) { text-align:center; }
.postage-page .postage-suisuiming { margin-top:10px; }
.postage-page .postage-breakdown-groups { gap:9px; }
.postage-page .postage-breakdown-group { display:grid; gap:5px; padding:9px 10px; border:1px solid #f0e0e3; border-radius:11px; background:rgba(255,255,255,.64); }
.postage-page .postage-breakdown-group h3 { margin:0 0 1px; color:#a46677; font-size:11px; font-weight:700; }
.postage-page .postage-breakdown-group>div { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--postage-muted); font-size:11px; }
.postage-page .postage-breakdown-group strong { color:var(--postage-ink); font-size:12px; white-space:nowrap; }
.postage-page .postage-goods-total { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-top:9px; padding:8px 2px 0; border-top:1px dashed #e8c9d0; color:#8a626b; font-size:11px; font-weight:650; }
.postage-page .postage-goods-total small { color:var(--postage-muted); font-size:9px; font-weight:400; }
.postage-page .postage-goods-total strong { color:var(--postage-ink); font-size:14px; }
@media(max-width:360px) { .postage-page .postage-item { gap:5px; padding-inline:7px; } .postage-page .postage-stepper button { width:27px; height:27px; } .postage-page .postage-region { width:62%; } .postage-page .postage-region-label { font-size:11px; } }
@media(prefers-reduced-motion:reduce) { .postage-page .postage-progress i { transition:none; } }