/* Material 3: tonal surfaces, rounded shapes, state layers, semantic colors. */
:root{font-family:"Roboto","Noto Sans SC","Microsoft YaHei","PingFang SC",Arial,sans-serif;font-size:16px;line-height:1.65;color:#1f1f1f;background:#f8fafd;--primary:#0b57d0;--on-primary:#fff;--primary-container:#d3e3fd;--on-primary-container:#041e49;--surface:#f8fafd;--surface-low:#f0f4f9;--surface-container:#e9eef6;--surface-high:#e3e9f2;--secondary-container:#e8f0fe;--on-surface:#1f1f1f;--on-surface-variant:#444746;--outline:#747775;--outline-variant:#dce2ea;--blue:var(--primary);--border:var(--outline-variant);--elevation-1:0 1px 3px #1f1f1f14,0 1px 2px #1f1f1f0a;--elevation-2:0 4px 12px #1f1f1f12,0 1px 3px #1f1f1f0a}
*{box-sizing:border-box}body{margin:0}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button,input{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed;background:#1f1f1f0c;color:#1f1f1f61;border-color:transparent;box-shadow:none}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--primary);outline-offset:3px}
.wrap{max-width:1160px;margin:auto;padding:0 32px}header{position:sticky;top:0;z-index:10;background:#f8fafdf5;border-bottom:1px solid var(--outline-variant);backdrop-filter:blur(16px)}.topbar{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-size:23px;font-weight:500;letter-spacing:-.4px;color:var(--on-surface);display:flex;align-items:center;gap:12px}.brand:hover{text-decoration:none}.mark{display:grid;place-items:center;background:var(--primary-container);color:var(--primary);border-radius:14px;width:44px;height:44px}.mark svg{width:26px;height:26px}nav{display:flex;gap:6px;align-items:center}nav a{color:var(--on-surface-variant);font-size:14px;font-weight:500;min-height:44px;padding:10px 18px;border-radius:24px;transition:background .18s}nav a:hover{background:var(--surface-container);text-decoration:none}nav a[aria-current]{color:var(--on-primary-container);background:var(--primary-container)}nav .button{margin-left:12px}
.intro{padding:36px 0 24px}h1{font-size:36px;font-weight:500;letter-spacing:-.8px;line-height:1.35;margin:0 0 12px}h2{font-size:22px;font-weight:500;line-height:1.5;margin:0 0 20px}h3{font-size:18px;font-weight:500}.lead{margin:0;color:var(--on-surface-variant)}.notice{background:var(--secondary-container);border:0;border-radius:24px;padding:24px 28px;margin-bottom:28px;font-size:15px;color:var(--on-primary-container)}.notice p{margin:0 0 8px}.notice strong{font-weight:600}.quicklinks{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.quicklinks a{display:inline-flex;align-items:center;min-height:36px;border:1px solid #a8c7fa;border-radius:10px;background:#ffffff6b;color:var(--on-primary-container);padding:5px 16px;font-size:14px;font-weight:500;transition:background .18s,border-color .18s}.quicklinks a:hover{text-decoration:none;background:var(--primary-container);border-color:var(--primary)}
.panel{background:#fff;border:1px solid var(--outline-variant);border-radius:24px;margin-bottom:28px;overflow:hidden;box-shadow:0 1px 2px #1f1f1f04}.panel-head{padding:24px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px}.panel-head h2{margin:0;display:flex;align-items:center;gap:12px}.category-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:var(--primary);background:var(--secondary-container);flex-shrink:0}.category-icon svg{width:23px;height:23px}.small{font-size:14px;color:var(--on-surface-variant)}.panel-head>.small{background:var(--surface-low);border-radius:20px;padding:6px 14px}.table{width:100%;border-collapse:collapse;text-align:left}.table th{font-size:14px;font-weight:500;color:var(--on-surface-variant);background:var(--surface-low);padding:12px 28px}.table th:first-child{width:60%}.table td{padding:18px 28px;border-top:1px solid #edf0f4}.table tr{transition:background .18s}.table tbody tr:hover{background:#f8fafd}.product-cell{display:flex;gap:16px;align-items:center}.mail-icon{width:44px;height:44px;flex-shrink:0;background:var(--surface-low);display:grid;place-items:center;color:var(--primary);border-radius:14px}.mail-icon svg{width:24px;height:24px}.product-title{font-size:16px;font-weight:500}.detail{font-size:14px;color:#5f6368;margin-top:4px}.price{font-size:20px;font-weight:500;color:var(--primary);white-space:nowrap;font-variant-numeric:tabular-nums}.unit{font-size:12px;font-weight:500;margin-left:5px;color:#5f6368}.stock{font-size:14px;color:#5f6368;white-space:nowrap}.stock-label{display:inline-flex;align-items:center;border-radius:8px;padding:4px 10px;background:var(--surface-low)}
.button{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;min-height:40px;background:var(--primary);border:1px solid transparent;color:var(--on-primary);border-radius:24px;padding:9px 24px;font-size:14px;font-weight:500;text-decoration:none;white-space:nowrap;transition:box-shadow .18s,background .18s}.button:hover{background:#084fbe;box-shadow:var(--elevation-1);text-decoration:none}.button:active{background:#0646a9;box-shadow:none}.button.secondary{background:var(--primary-container);color:var(--on-primary-container)}.button.secondary:hover{background:#c2d7f8;box-shadow:none}.button:disabled,.button:disabled:hover{background:#1f1f1f0c;color:#1f1f1f61;box-shadow:none}
.section{padding:28px}.steps,.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.steps>div,.reasons>div{background:var(--surface-low);border-radius:20px;padding:22px}.step-number{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--on-primary-container);background:var(--primary-container);font-weight:500;margin-bottom:14px}.steps h3,.reasons h3{margin:0 0 10px}.steps p,.reasons p{margin:0;color:var(--on-surface-variant);font-size:15px}.payment-note{margin:20px 0 0;padding:16px 20px;background:#fff3d9;color:#674c12;font-size:14px;border-radius:16px}.terms{padding-left:24px;margin-bottom:0;font-size:15px;color:var(--on-surface-variant)}.terms li{margin:12px 0;padding-left:4px}.terms li::marker{color:var(--primary)}.guides{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.guides a{display:flex;align-items:center;min-height:68px;padding:16px 18px;border-radius:16px;background:var(--surface-low);color:var(--on-surface);font-size:15px;transition:background .18s}.guides a:hover{background:var(--primary-container);text-decoration:none}.footer{padding:12px 32px 36px;color:#5f6368;font-size:14px;display:flex;justify-content:space-between;gap:12px}
.breadcrumb{font-size:14px;padding:28px 0 22px;color:#5f6368}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start;margin-bottom:32px}.article{padding:36px 40px;background:#fff;border:1px solid var(--outline-variant);border-radius:28px}.article h1{font-size:32px}.article h2{margin-top:30px;font-size:21px}.article p{color:var(--on-surface-variant);margin:16px 0;line-height:1.95}.article-meta{display:inline-flex;font-size:14px;color:#5f6368;background:var(--surface-low);border-radius:8px;padding:5px 12px;margin:4px 0 16px}.aside{background:var(--secondary-container);border:0;border-radius:24px;padding:24px;position:sticky;top:104px}.aside h2{font-size:20px;color:var(--on-primary-container)}.aside p{font-size:15px;color:var(--on-surface-variant)}.aside .button{width:100%}.aside>a:last-child{font-size:14px}.related{border-top:1px solid var(--outline-variant);padding-top:24px;margin-top:30px}.related a{display:block;border-radius:12px;padding:12px 16px;background:var(--surface-low);margin:10px 0;font-size:15px}.related a:hover{background:var(--primary-container);text-decoration:none}.article-cta{background:var(--secondary-container);border:0;border-radius:20px;margin-top:28px;padding:24px}.article-cta p{margin:0 0 16px}.article-cta .button{color:white}
dialog{border:0;padding:0;border-radius:28px;width:min(580px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow-y:auto;box-shadow:0 12px 40px #1f1f1f33;color:var(--on-surface);background:var(--surface-low)}dialog[open]{animation:dialog-in .2s cubic-bezier(.2,0,0,1)}dialog::backdrop{background:#1f1f1f66}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:24px 28px 12px}.modal-head h2{margin:0;font-size:24px}.close{display:grid;place-items:center;border:0;background:transparent;border-radius:50%;width:40px;height:40px;font-size:26px;color:var(--on-surface-variant);line-height:1}.close:hover{background:var(--surface-high)}.modal-body{padding:8px 28px 28px}.modal-body h3{margin:8px 0}.modal-body p{font-size:15px}.quantity-row{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid var(--outline-variant);gap:12px}.quantity-row label{font-size:14px}.quantity-row input{width:92px;min-height:48px;background:#fff;border:1px solid var(--outline);border-radius:8px;padding:8px 12px;margin-left:8px}.quantity-row input:focus{border:2px solid var(--primary);padding:7px 11px;outline:0}.total{font-size:26px;font-weight:500;color:var(--primary)}.checkout-status{padding:16px;background:#fff3d9;border-radius:16px;font-size:14px;line-height:1.8;color:#674c12}.address{display:block;word-break:break-all;font-family:monospace;background:#fff;border:1px solid var(--outline-variant);border-radius:12px;padding:16px;font-size:14px}.checkbox{display:flex;align-items:flex-start;gap:12px;font-size:14px;margin:20px 0;color:var(--on-surface-variant)}.checkbox input{width:18px;height:18px;flex-shrink:0;margin:4px 0 0;accent-color:var(--primary)}.dialog-actions{display:flex;gap:10px;flex-wrap:wrap}.toast{min-height:24px;font-size:14px;color:var(--primary);margin-top:12px}
.ripple{position:absolute;border-radius:50%;pointer-events:none;background:currentColor;opacity:.14;transform:scale(0);animation:ripple-out .5s ease-out;z-index:-1}html{scroll-behavior:smooth;scroll-padding-top:104px}.notfound{padding:70px 32px;min-height:60vh}@keyframes ripple-out{to{transform:scale(1);opacity:0}}@keyframes dialog-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:900px){.wrap{padding:0 24px}.table th,.table td{padding-left:20px;padding-right:20px}.table th:first-child{width:auto}.product-cell{gap:12px}.article-layout{grid-template-columns:minmax(0,1fr) 240px;gap:18px}.article{padding:28px}}
@media(max-width:760px){.wrap{padding:0 16px}.topbar{min-height:76px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px;gap:10px}.brand{font-size:21px}.mark{width:38px;height:38px;border-radius:12px}nav{gap:2px;flex-wrap:wrap}nav a{padding:8px 12px;font-size:14px;min-height:40px}nav .button{margin-left:4px;padding:8px 16px}h1{font-size:28px}.intro{padding-top:28px}.notice{padding:20px;border-radius:20px}.quicklinks{margin-top:16px;gap:8px}.quicklinks a{padding:5px 12px}.panel{border-radius:20px;margin-bottom:20px}.panel-head{padding:20px}.panel-head h2{font-size:19px;gap:10px}.category-icon{width:34px;height:34px}.panel-head>.small{max-width:120px;text-align:right;font-size:12px;padding:6px 10px}.table th,.table td{padding:14px 10px}.table th:first-child,.table td:first-child{padding-left:20px}.table th:last-child,.table td:last-child{padding-right:20px}.table th:nth-child(3),.table td:nth-child(3){display:none}.product-cell{gap:8px}.mail-icon{display:none}.product-title{font-size:15px}.detail{font-size:14px}.price{font-size:19px}.unit{display:block;margin-left:0}.table .button{min-height:40px;padding:8px 16px}.section{padding:22px}.steps,.reasons{grid-template-columns:1fr;gap:12px}.steps>div,.reasons>div{padding:20px}.guides{grid-template-columns:1fr 1fr;gap:10px}.guides a{padding:14px}.article-layout{grid-template-columns:1fr}.article{padding:24px;border-radius:24px}.article h1{font-size:27px}.aside{position:static}.footer{flex-direction:column;padding-top:8px;padding-bottom:28px}html{scroll-padding-top:140px}}
@media(max-width:460px){.topbar{padding-top:14px;gap:12px}nav{width:100%;justify-content:space-between;gap:0}nav a{padding:8px 10px;font-size:14px}nav .button{margin:0;padding:8px 12px}.panel-head{gap:8px;padding:18px 16px}.panel-head>.small{max-width:100px}.table th:first-child,.table td:first-child{padding-left:16px}.table th:last-child,.table td:last-child{padding-right:16px}.table th,.table td{padding:14px 7px}.table .button{padding:8px 14px}.notice{padding:18px}.section{padding:20px}.guides{grid-template-columns:1fr}.article{padding:22px}.article h1{font-size:25px}.modal-head{padding:20px 22px 10px}.modal-body{padding:6px 22px 22px}.quantity-row{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

.payment-qr{text-align:center;margin:16px 0}.payment-qr img{display:block;margin:0 auto;max-width:100%;height:auto;border-radius:12px;background:#fff}.payment-qr p{max-width:340px;margin:8px auto}

.article-toc{padding:16px 20px;border-radius:16px;background:var(--surface-container,#eef3fc);margin:20px 0}.article-toc h2{font-size:1rem;margin:0}.article-toc ul{padding-left:20px;margin-bottom:0}.article-toc li{margin:8px 0}.article h2[id]{scroll-margin-top:100px}.guide-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:24px}.guide-cards h3{font-size:1.1rem}.guide-cards p{line-height:1.8}

@media(min-width:761px){.reasons{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Google brand accents with readable tonal surfaces. */
[data-google-color="blue"]{--item-price:#1967d2;--item-brand:#4285f4;--item-ink:#174ea6;--item-tone:#e8f0fe;--item-hover:#d2e3fc}
[data-google-color="red"]{--item-price:#d93025;--item-brand:#ea4335;--item-ink:#a50e0e;--item-tone:#fce8e6;--item-hover:#fad2cf}
[data-google-color="yellow"]{--item-price:#fbbc05;--item-brand:#fbbc05;--item-ink:#744600;--item-tone:#fef7e0;--item-hover:#feefc3}
[data-google-color="green"]{--item-price:#188038;--item-brand:#34a853;--item-ink:#0d652d;--item-tone:#e6f4ea;--item-hover:#ceead6}
.table tbody tr[data-google-color]{background:var(--item-tone)}
.table tbody tr[data-google-color]:hover{background:var(--item-hover)}
.table tr[data-google-color] td:first-child{box-shadow:inset 4px 0 var(--item-brand)}
.table tr[data-google-color] .mail-icon{background:#ffffffb3;color:var(--item-ink)}
.table tr[data-google-color] .price{color:var(--item-price);font-weight:700}
.table tr[data-google-color] .button:not(:disabled){background:var(--item-brand);color:#171717;font-weight:600}
.table tr[data-google-color] .button:not(:disabled):hover{filter:brightness(.9)}
.reasons>div[data-google-color]{background:var(--item-tone);border-top:4px solid var(--item-brand)}
.reasons>div[data-google-color] h3{color:var(--item-ink)}

/* Random Google tonal surfaces throughout the interface. */
[data-google-surface="blue"]{--random-brand:#4285f4;--random-ink:#174ea6;--random-tone:#e8f0fe;--random-hover:#d2e3fc}
[data-google-surface="red"]{--random-brand:#ea4335;--random-ink:#a50e0e;--random-tone:#fce8e6;--random-hover:#fad2cf}
[data-google-surface="yellow"]{--random-brand:#fbbc05;--random-ink:#744600;--random-tone:#fef7e0;--random-hover:#feefc3}
[data-google-surface="green"]{--random-brand:#34a853;--random-ink:#0d652d;--random-tone:#e6f4ea;--random-hover:#ceead6}
.mark[data-google-surface],.notice[data-google-surface],.quicklinks a[data-google-surface],.panel-head>.small[data-google-surface],.steps>div[data-google-surface],.guides a[data-google-surface],.article-toc[data-google-surface],.article-cta[data-google-surface],.aside[data-google-surface],nav a[aria-current][data-google-surface]{background:var(--random-tone);color:var(--random-ink)}
.mark[data-google-surface]{color:var(--random-brand)}
.quicklinks a[data-google-surface]{border-color:var(--random-brand)}
.quicklinks a[data-google-surface]:hover,.guides a[data-google-surface]:hover{background:var(--random-hover)}
.steps>div[data-google-surface] .step-number{background:var(--random-brand);color:#171717}
.steps>div[data-google-surface] h3{color:var(--random-ink)}

.rainbow-title{color:#4285f4}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
 .rainbow-title{background-image:linear-gradient(90deg,#ea4335 0%,#fbbc05 12.5%,#34a853 25%,#4285f4 37.5%,#ea4335 50%,#fbbc05 62.5%,#34a853 75%,#4285f4 87.5%,#ea4335 100%);background-size:200% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:google-title-flow 7s linear infinite}
}
@keyframes google-title-flow{from{background-position:100% 50%}to{background-position:0% 50%}}
@media(prefers-reduced-motion:reduce){.rainbow-title{animation:none}}

#address-block .payment-qr img,#address-block .address{transition:filter .2s ease}#address-block.payment-locked .payment-qr img,#address-block.payment-locked .address{filter:blur(9px);user-select:none;pointer-events:none}

.article .context-link{text-decoration:underline;text-underline-offset:3px}
