/* Shared design for the privacy, terms and refund pages */
:root{--paper:#F3F5F4;--white:#fff;--ink:#0F2A30;--ink-2:#435A5E;--line:#CBD5D3;--sea:#1D5C63;--saffron:#D99A1E;--saffron-soft:#F6E7C4;--f:"Readex Pro",system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--paper);color:var(--ink);font:300 17px/1.7 var(--f);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:var(--sea)}
:focus-visible{outline:3px solid var(--saffron);outline-offset:3px;border-radius:4px}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* header band */
.band{background:var(--ink);color:var(--paper);position:relative;overflow:hidden;padding-top:36px;padding-bottom:64px}
.band::before{content:"";position:absolute;inset:0;opacity:.07;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='88' viewBox='0 0 88 88'%3E%3Cg fill='none' stroke='%23F3F5F4' stroke-width='1.2'%3E%3Crect x='27' y='27' width='34' height='34'/%3E%3Crect x='27' y='27' width='34' height='34' transform='rotate(45 44 44)'/%3E%3Cpath d='M0 44h20M68 44h20M44 0v20M44 68v20'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image:radial-gradient(ellipse 55% 90% at 90% 40%,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse 55% 90% at 90% 40%,#000 20%,transparent 70%)}
.ghost{position:absolute;right:-.03em;bottom:-.3em;font-size:clamp(120px,18vw,240px);font-weight:500;line-height:1;color:rgba(217,154,30,.12);pointer-events:none;user-select:none;white-space:nowrap}
.band .wrap{position:relative}
.top{display:flex;align-items:center;justify-content:space-between;padding:22px 0}
.logo{display:flex;align-items:center;gap:10px;font-weight:500;font-size:20px;color:var(--paper);text-decoration:none}
.logo svg{width:30px;height:30px}
.top > a:last-child{font-size:15px;color:#B9C7C8;text-decoration:none}
.top > a:last-child:hover{color:var(--paper)}
.tabs{display:inline-flex;gap:4px;margin-top:40px;padding:4px;background:rgba(243,245,244,.08);border-radius:999px}
.tabs a{font-size:15px;color:#B9C7C8;text-decoration:none;padding:8px 16px;border-radius:999px;transition:background .2s,color .2s}
.tabs a:hover{color:var(--paper)}
.tabs a[aria-current="page"]{background:var(--paper);color:var(--ink);font-weight:500}
h1{font-weight:500;font-size:clamp(36px,5.5vw,56px);line-height:1.08;letter-spacing:-0.02em;margin:26px 0 10px}
.updated{color:#8FA3A5;font-size:15px;margin:0}

/* body */
.layout{display:grid;grid-template-columns:220px 1fr;gap:56px;align-items:start;margin:48px 0 80px}
.toc{position:sticky;top:24px;font-size:15px}
.toc p{font-weight:500;margin:0 0 10px}
.toc ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--line)}
.toc a{display:block;padding:6px 0 6px 16px;margin-left:-1px;border-left:2px solid transparent;color:var(--ink-2);text-decoration:none;line-height:1.4;transition:color .2s,border-color .2s}
.toc a:hover{color:var(--ink)}
.toc a.on{color:var(--ink);border-left-color:var(--saffron)}
article{max-width:680px}
.gist{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:26px 28px;margin-bottom:12px}
.gist h2{font-size:18px;font-weight:500;margin:0 0 12px}
.gist ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.gist li{position:relative;padding-left:30px;line-height:1.5}
.gist li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--saffron-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.2l3 3 6-6.4' fill='none' stroke='%237A5510' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
section{padding:30px 0;border-bottom:1px solid var(--line)}
section:last-child{border-bottom:0}
section h2{font-weight:500;font-size:22px;line-height:1.3;letter-spacing:-0.01em;margin:0 0 10px}
section p{margin:0;color:#2B4247}
section p + p{margin-top:12px}
section b{font-weight:500;color:var(--ink)}
.contact{margin-top:8px;background:var(--ink);color:var(--paper);border-radius:16px;padding:24px 28px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.contact p{margin:0;color:#B9C7C8}
.contact b{color:var(--paper);font-weight:500;display:block}
.contact a{background:var(--saffron);color:var(--ink);text-decoration:none;font-weight:500;padding:12px 18px;border-radius:8px;white-space:nowrap}
.contact a:hover{background:#E7AB2F}
.contact a.copied{background:#DDEEEA;color:#1D6B4A}
footer{border-top:1px solid var(--line);padding:24px 0 40px;font-size:15px;color:var(--ink-2);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
footer nav{display:flex;gap:20px}

@media (max-width:860px){
  .layout{grid-template-columns:1fr;gap:0;margin-top:32px}
  .toc{display:none}
}
@media (max-width:520px){
  body{font-size:16px}
  .top{padding:14px 0}
  .logo{font-size:18px}
  .tabs{margin-top:26px}
  .tabs a{padding:8px 12px;font-size:14px}
  .gist{padding:22px 20px}
  .contact{padding:22px 20px}
  .contact a{width:100%;text-align:center}
}