/* Subscription, account and legal pages. Loaded after guide.css and reuses its
   palette: paper and cream grounds, forest green, copper, Mincho headings. */
:root{--ease:cubic-bezier(.22,.8,.24,1);--shell:#ece6d8;--core:#fffdf8;--hair:#ddd5c4;--ok:#2f6b4f;--warn:#9a5a1d}
html{background:#f1ecdf}
body{min-height:100vh;display:flex;flex-direction:column}
.bill-header{gap:clamp(12px,3vw,30px)}
.bill-nav{display:flex;gap:clamp(12px,2.2vw,24px);align-items:center}
.bill-nav a{font-size:12px;text-decoration:none;color:#566659;white-space:nowrap;padding:4px 0;border-bottom:1px solid transparent;transition:color .35s var(--ease),border-color .35s var(--ease)}
.bill-nav a:hover,.bill-nav a[aria-current="page"]{color:var(--copper);border-color:currentColor}
.bill-locale select{padding:7px 10px;background:#fffdf7;border:1px solid #cfd6c7;color:#244a3a;font:12px var(--sans)}
.bill-main{max-width:1180px;width:100%;margin:0 auto;flex:1 0 auto;padding-top:clamp(30px,5vw,64px);padding-bottom:clamp(60px,8vw,110px)}
.bill-narrow{max-width:760px;margin:0 auto}
.bill-reveal{animation:bill-rise .9s var(--ease) both;animation-delay:var(--d,0ms)}
@keyframes bill-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.bill-reveal.d1{--d:120ms}.bill-reveal.d2{--d:200ms}.bill-reveal.d3{--d:280ms}
@media(prefers-reduced-motion:reduce){.bill-reveal{animation:none}}
.bill-eyebrow{display:inline-block;color:var(--copper);font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;border:1px solid #d9b9a6;padding:4px 10px;background:#fbf3ea}
.bill-h1{font:500 clamp(32px,4.6vw,56px)/1.25 var(--serif);letter-spacing:.01em;margin:18px 0 16px;text-wrap:balance}
.bill-lead{font-size:15px;line-height:1.95;color:#526257;max-width:640px;margin:0}
.bill-section{margin-top:clamp(48px,7vw,92px)}
.bill-section-title{font:500 clamp(24px,2.6vw,34px)/1.35 var(--serif);margin:10px 0 22px}
/* Double-bezel: a paper shell holding a cream core. */
.bezel{background:var(--shell);border:1px solid var(--hair);padding:6px;box-shadow:0 22px 50px -34px #193e3455}
.bezel-core{background:var(--core);border:1px solid #e9e2d2;padding:clamp(20px,3.2vw,34px);box-shadow:inset 0 1px 0 #fff}
.bill-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,70px);align-items:center}
.plan-cards{display:grid;gap:12px}
.plan-card{display:grid;grid-template-columns:1fr auto;gap:6px 18px;align-items:center;padding:20px 22px;border:1px solid #e3dccb;background:#fffefa;transition:transform .5s var(--ease),border-color .5s var(--ease),box-shadow .5s var(--ease)}
.plan-card:hover{transform:translateY(-2px);border-color:#cdb79f;box-shadow:0 16px 30px -24px #6b3d2a66}
.plan-card h3{font:500 21px/1.3 var(--serif);margin:0}
.plan-card p{grid-column:1;margin:0;color:#68766a;font-size:12px;line-height:1.7}
.plan-price{grid-row:1/span 2;grid-column:2;text-align:right;font:500 30px/1 var(--serif);color:var(--forest);white-space:nowrap}
.plan-price small{display:block;font:11px/1.6 var(--sans);color:#7c877b;margin-top:6px}
.plan-card .bill-button{grid-column:1/-1;margin-top:10px;justify-self:start}
.plan-card.featured{border-color:#c99d7d;background:linear-gradient(180deg,#fffaf2,#fffefa)}
.bill-button{display:inline-flex;align-items:center;gap:22px;justify-content:space-between;background:var(--copper);color:#fffaf0;border:0;font:700 12px var(--sans);letter-spacing:.04em;text-decoration:none;padding:12px 12px 12px 18px;cursor:pointer;transition:background .4s var(--ease),transform .4s var(--ease)}
.bill-button .arrow{display:grid;place-items:center;width:26px;height:26px;background:#ffffff1f;transition:transform .45s var(--ease)}
.bill-button:hover{background:#873f2e}
.bill-button:hover .arrow{transform:translate(2px,-2px)}
.bill-button:active{transform:scale(.98)}
.bill-button.quiet{background:var(--forest)}
.bill-button.quiet:hover{background:#285947}
.bill-button[disabled]{background:#b9b3a6;cursor:not-allowed}
.bill-button[disabled] .arrow{transform:none}
.text-link-button{background:none;border:0;padding:6px 0;color:#964a36;font:700 12px var(--sans);text-decoration:none;border-bottom:1px solid #c79a85;cursor:pointer}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.compare>.bezel{display:flex}.compare>.bezel>.bezel-core{flex:1}
.compare h2{font:500 22px/1.35 var(--serif);margin:0 0 14px;display:flex;gap:10px;align-items:center}
.compare h2 span:first-child{display:grid;place-items:center;width:34px;height:34px;border:1px solid currentColor;font:18px var(--serif)}
.compare ul{list-style:none;margin:0;padding:0}
.compare li{padding:11px 0 11px 22px;border-top:1px solid #ece5d6;position:relative;color:#4e5f52;line-height:1.75}
.compare li:before{content:"";position:absolute;left:2px;top:20px;width:8px;height:8px;border-radius:50%;background:#9db8a5}
.compare .paid h2{color:var(--copper)}
.compare .paid li:before{background:var(--copper)}
.notice{border-left:3px solid #c9a77d;background:#f4eee2;padding:12px 15px;color:#4e5a4f;font-size:13px;line-height:1.75;margin:0 0 18px}
.notice.good{border-color:#5f9b7a;background:#e7f0e8}
.notice.warn{border-color:#c98a4e;background:#f8ece0}
.notice.error{border-color:var(--copper);background:#f8e8e1;color:#7c3a29}
.steps{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px;align-items:start}
.steps-left{display:grid;gap:16px}
.step-label{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-size:10px;font-weight:700;line-height:1.6;letter-spacing:.18em;color:var(--copper);text-transform:uppercase;margin:0 0 6px}
.step-label b{display:grid;place-items:center;width:24px;height:24px;border:1px solid currentColor;font:13px var(--serif);letter-spacing:0}
.step-title{font:500 23px/1.35 var(--serif);margin:0 0 14px}
.plan-options{display:grid;gap:10px}
.plan-option{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;border:1px solid #e3dccb;padding:15px 16px;cursor:pointer;background:#fffefa;transition:border-color .4s var(--ease),background .4s var(--ease)}
.plan-option:has(input:checked){border-color:var(--copper);background:#fff7ee}
.plan-option input{accent-color:var(--copper);width:17px;height:17px;margin:0}
.plan-option strong{display:block;font:500 17px var(--serif)}
.plan-option small{display:block;color:#6d796f;font-size:11px;line-height:1.6}
.plan-option .plan-price{font-size:22px;grid-row:auto;grid-column:auto}
.account-box{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:14px}
.confirm-list{margin:0 0 18px;border-top:1px solid #e6dfcf}
.confirm-list div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px solid #e6dfcf}
.confirm-list dt{font-weight:700;color:#344a3d;font-size:12px;line-height:1.7}
.confirm-list dt small{display:block;font-weight:400;color:#8a9387;font-size:11px}
.confirm-list dd{margin:0;color:#46574b;font-size:13px;line-height:1.8}
.confirm-list dd strong{font:500 18px var(--serif);color:var(--forest)}
.confirm-ja{margin:0 0 18px;border:1px solid #e6dfcf;background:#fbf8f1}
.confirm-ja summary{cursor:pointer;padding:11px 14px;font-size:12px;font-weight:700;color:#4b5d50}
.confirm-ja dl{margin:0;padding:0 14px 6px}
.check{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;font-size:13px;line-height:1.75;color:#3f5045;margin:4px 0 18px;cursor:pointer}
.check input{width:18px;height:18px;margin:3px 0 0;accent-color:var(--copper)}
.check a,.confirm-list a,.legal-body a,.bill-fineprint a{color:#964a36;text-underline-offset:3px}
.bill-fineprint{font-size:11px;color:#7a8578;line-height:1.7;margin:12px 0 0}
.status-line{display:flex;align-items:center;gap:10px;font:500 20px/1.4 var(--serif);margin:0 0 20px}
.status-dot{width:10px;height:10px;border-radius:50%;background:#b4b9ad;flex:none}
.status-dot.good{background:#4c8b67;box-shadow:0 0 0 5px #4c8b6722}
.status-dot.warn{background:#c98a4e;box-shadow:0 0 0 5px #c98a4e22}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #e6dfcf;margin:0 0 22px}
.facts div{padding:13px 14px 13px 0}
.facts .wide{grid-column:1/-1;border-bottom:1px solid #efe9dc}
.facts dt{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8a9387;margin-bottom:5px}
.facts dd{margin:0;font:500 16px/1.45 var(--serif);color:#2d4337;overflow-wrap:anywhere}
.actions{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
.spinner{width:34px;height:34px;border:2px solid #e2d8c6;border-top-color:var(--copper);border-radius:50%;animation:bill-spin 1.1s cubic-bezier(.5,.15,.35,.9) infinite;margin-bottom:18px}
@keyframes bill-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.spinner{animation-duration:3s}}
.bill-foot{max-width:1180px;width:100%;margin:0 auto;padding:28px clamp(22px,5vw,86px) 42px;border-top:1px solid var(--line);display:grid;gap:12px;font-size:12px;color:#637167}
.bill-foot nav{display:flex;flex-wrap:wrap;gap:8px 18px}
.bill-foot a{text-decoration:none}
.bill-foot a:hover{color:var(--copper)}
.bill-foot p{margin:0;font-size:11px;color:#8a9387;line-height:1.7}
/* Legal documents */
.legal-main{max-width:900px}
.draft-banner{border:1px dashed #c98a4e;background:#fbf1e4;color:#7a4a1f;font-size:12px;line-height:1.8;padding:12px 15px;margin:0 0 22px}
.legal-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 26px;padding:0;list-style:none}
.legal-tabs a{display:block;padding:7px 13px;border:1px solid #d8d2c2;background:#fffdf7;font-size:12px;text-decoration:none;color:#4f6255;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
.legal-tabs a[aria-current="true"]{background:var(--forest);border-color:var(--forest);color:#fff8ea}
.legal-body{border-top:2px solid var(--copper);padding-top:6px}
.legal-body h2{font:500 clamp(24px,3vw,32px)/1.35 var(--serif);margin:22px 0 6px}
.legal-body h3{font:500 19px/1.45 var(--serif);margin:30px 0 8px;color:#2d4337}
.legal-body h4{font-size:14px;margin:20px 0 6px;color:#2d4337}
.legal-body p,.legal-body li{font-size:14px;line-height:1.95;color:#46574b}
.legal-body ol,.legal-body ul{padding-left:22px}
.legal-meta{font-size:12px;color:#8a9387}
.legal-meta span{white-space:nowrap}
.legal-note{font-size:12px;color:#6d5a3c;background:#f5efe2;padding:9px 12px;margin:10px 0 0}
.spec{width:100%;border-collapse:collapse;margin:14px 0 6px}
.spec th,.spec td{text-align:left;vertical-align:top;padding:12px 10px;border-bottom:1px solid #e6dfcf;font-size:13px;line-height:1.85}
.spec th{width:28%;font-weight:700;color:#344a3d;background:#f7f3ea}
mark.todo{background:#fde7c6;color:#7a4a1f;padding:0 3px}
@media(max-width:860px){.bill-hero,.compare,.steps{grid-template-columns:1fr}.facts{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.bill-header{flex-wrap:wrap}.bill-nav{order:3;width:100%;justify-content:flex-start}.bill-locale{margin-left:auto}
.plan-card{grid-template-columns:1fr}.plan-price{grid-row:auto;grid-column:1;text-align:left}.plan-card p{grid-column:1}
.confirm-list div{grid-template-columns:1fr;gap:4px}.spec th,.spec td{display:block;width:100%}.spec th{border-bottom:0;padding-bottom:4px}
.facts{grid-template-columns:1fr}.bezel-core{padding:20px 18px}}
.bill-section-tight{margin-top:22px}
/* Korean wraps between words, not syllables. */
html[lang="ko"] .bill-main,html[lang="ko"] .bill-foot,.legal-body:lang(ko){word-break:keep-all;overflow-wrap:anywhere}