/* MyDS marketing legal pages (S08, M2 T14 part B): an owner's manual. Divider tabs on top (real links), a cream page, a reading seal, a cookie choices box.
   Ported from the frozen prototype F01-legal; loaded after www.css (tokens, nav, footer, buttons, sample tag live there). The page is complete with no script:
   the seal, the progress line and the Print button are extras that legal.js switches on. */
.ic2{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.leg{position:relative;padding:clamp(92px,13vh,132px) 0 clamp(56px,8vw,112px);background:radial-gradient(60% 50% at 90% 0%,rgb(201 162 74/.14),transparent),radial-gradient(45% 40% at 0% 100%,rgb(201 162 74/.07),transparent),var(--bg);min-height:100svh}
.leg .sh{display:grid;gap:var(--space-4);margin-bottom:var(--space-7)}
.leg .h1{font:800 clamp(40px,5.6vw,88px)/var(--lh-display) var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display);text-wrap:balance;outline:0}
.leg .h1 em{font-style:normal;color:var(--gold)}
[dir="rtl"] .leg .h1{letter-spacing:0}
.leg .btn{min-height:44px}
.dg{display:grid;grid-template-columns:minmax(200px,248px) minmax(0,1fr);gap:clamp(24px,4.5vw,72px);align-items:start}
.mainc{min-width:0}
/* dividers */
.dv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;scroll-margin-top:84px;position:relative;z-index:1}
.dv a{display:grid;gap:6px;align-content:start;min-height:88px;padding:14px 18px 16px;border:1px solid var(--night-line);border-bottom:0;border-radius:12px 12px 0 0;background:var(--night-2);color:var(--text-2);text-decoration:none;transition:background-color var(--dur-base),color var(--dur-base),transform var(--dur-slow) var(--ease-drive)}
.dv a:hover{color:var(--text);transform:translateY(-3px)}
.dv b{font:800 clamp(16px,1.6vw,22px)/1.1 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:-.02em;color:var(--text)}
[dir="rtl"] .dv b{letter-spacing:0}
.dv small{font-size:13px;line-height:1.35;color:var(--text-muted)}
.dv a[aria-current="page"]{background:#F8F3E4;border-color:#F8F3E4;transform:none;box-shadow:0 -10px 28px -14px rgb(201 162 74/.55)}
.dv a[aria-current="page"] b{color:#141414}
.dv a[aria-current="page"] small{color:#5E5B50}
.dv a[aria-current="page"]::after{content:"";height:3px;width:34px;border-radius:2px;background:#C9A24A}
/* side: reading seal + contents */
.side{position:sticky;top:92px;display:grid;gap:var(--space-5)}
.seal{display:none;align-items:center;gap:14px}
.js .seal{display:flex}
.seal svg{width:64px;height:64px;flex:none}
.seal .rg{fill:none;stroke:var(--night-line);stroke-width:4}
.seal .pg{fill:none;stroke:var(--gold);stroke-width:4;stroke-linecap:round;transform:rotate(-90deg);transform-origin:32px 32px;stroke-dasharray:138.2;stroke-dashoffset:138.2;transition:stroke-dashoffset 160ms linear}
.seal .mk2{fill:none;stroke:var(--gold);stroke-width:3.4;stroke-linecap:square;opacity:.35;transition:opacity var(--dur-slow)}
.seal.done .mk2{opacity:1}
.seal.done .pg{filter:drop-shadow(0 0 6px rgb(201 162 74/.7))}
.seal p{font-size:14.5px;color:var(--text-2);line-height:1.3}
.seal b{font:800 24px/1 var(--font-display);color:var(--text)}
.toc summary{cursor:pointer;font:600 12px/1.3 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);list-style:none;min-height:44px;display:flex;align-items:center}
.toc summary::-webkit-details-marker{display:none}
.toc summary::after{content:"";width:7px;height:7px;margin-inline-start:10px;margin-top:-3px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);transition:transform var(--dur-base)}
.toc[open] summary::after{transform:rotate(-135deg);margin-top:3px}
[dir="rtl"] .toc summary{letter-spacing:0;text-transform:none;font-size:14px}
.toc ol{display:grid;gap:2px;margin-top:6px;border-inline-start:1px solid var(--night-line)}
.toc a{display:flex;align-items:center;min-height:44px;padding:8px 14px;margin-inline-start:-1px;border-inline-start:2px solid transparent;font-size:14.5px;line-height:1.35;color:var(--text-2);text-decoration:none;transition:color var(--dur-base),border-color var(--dur-base)}
.toc a:hover{color:var(--text)}
.toc a[aria-current="true"]{color:var(--text);border-inline-start-color:var(--gold);font-weight:600}
.rp{display:none;position:fixed;top:68px;inset-inline:0;height:3px;z-index:49;--p:0;background:linear-gradient(var(--gold),var(--gold)) 0 0/calc(var(--p)*100%) 100% no-repeat}
[dir="rtl"] .rp{background-position:100% 0}
/* the cream page */
.paper{--text:#141414;--text-2:#37352C;--text-muted:#5E5B50;--gold-text:#83641B;--focus:#83641B;--border:rgb(20 20 20/.18);position:relative;color:#141414;padding:clamp(24px,5vw,64px);padding-bottom:clamp(32px,5vw,64px);border-bottom:10px solid transparent;border-radius:0 0 14px 14px;background:linear-gradient(#F8F3E4,#F3ECD6) padding-box,repeating-linear-gradient(-45deg,#C9A24A 0 16px,#F8F3E4 16px 26px) border-box;box-shadow:0 40px 70px -30px rgb(0 0 0/.75);min-height:60vh}
.paper a{color:var(--gold-text)}
.paper .dt{font:800 clamp(30px,4.2vw,58px)/1.02 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:-.03em;outline:0;text-wrap:balance}
[dir="rtl"] .paper .dt{letter-spacing:0}
.meta{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin-top:var(--space-4);font-size:14.5px;color:var(--text-muted)}
.meta .btn[hidden]{display:none}
.lchip{display:inline-flex;border:1px dashed var(--gold-text);color:var(--gold-text);border-radius:var(--radius-full);padding:4px 10px;font:700 11px/1 var(--font-ui);letter-spacing:.1em;text-transform:uppercase}
[dir="rtl"] .lchip{letter-spacing:0;text-transform:none;font-size:12.5px}
.paper .btn-secondary{--fg:#141414;background:#FFFDF6;border-color:rgb(20 20 20/.45)}
.paper .btn-secondary:hover{border-color:#141414}
.dn{margin-top:var(--space-4);max-width:62ch;font-size:15px;color:var(--text-muted)}
.dn.keep{margin-top:var(--space-6)}
.short{margin-top:var(--space-6);padding:20px 22px;border-radius:10px;border-inline-start:4px solid #C9A24A;background:rgb(201 162 74/.15)}
.short h3{font:700 12px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-text);margin-bottom:12px}
[dir="rtl"] .short h3{letter-spacing:0;text-transform:none;font-size:14px}
.short ul{display:grid;gap:10px}
.short li{position:relative;padding-inline-start:26px;font-size:var(--fs-body);font-weight:500;color:#141414}
.short li::before{content:"";position:absolute;inset-inline-start:2px;top:.62em;width:10px;height:10px;border-radius:50%;background:#C9A24A}
.sc{margin-top:var(--space-7);max-width:68ch;scroll-margin-top:96px}
.sc h3{display:flex;gap:14px;align-items:baseline;font:700 clamp(20px,2.2vw,26px)/1.2 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:-.02em;margin-bottom:var(--space-3);outline:0}
.sc h3 i{font:700 13px/1 var(--font-ui);font-style:normal;letter-spacing:.1em;color:var(--gold-text)}
.sc p{color:var(--text-2)}
.sc p+p,.sc p+.bl,.sc .bl+p{margin-top:var(--space-3)}
.sc .bl{display:grid;gap:8px;color:var(--text-2)}
.sc .bl li{position:relative;padding-inline-start:22px}
.sc .bl li::before{content:"";position:absolute;inset-inline-start:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:#C9A24A}
.sc .vf{margin-top:var(--space-3);padding:10px 14px;border:1px dashed var(--gold-text);border-radius:8px;background:rgb(255 255 255/.45);font-size:14.5px;color:var(--text-muted)}
.sc .vf b,.vfy{color:var(--gold-text)}
.vfy{font-size:13px}
.sc .after{margin-top:var(--space-3)}
.paper .smp{--gold-text:#83641B;margin-inline-start:6px}
.tw{margin-top:var(--space-4);overflow-x:auto;border:1px solid var(--border);border-radius:8px;background:rgb(255 255 255/.4)}
.tw:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.tb{width:100%;border-collapse:collapse;font-size:15px}
.tb th,.tb td{padding:11px 14px;text-align:start;border-bottom:1px solid var(--border);vertical-align:top}
.tb tr:last-child>*{border-bottom:0}
.tb thead th{font:700 12px/1.2 var(--font-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.tb tbody th{font-weight:600;color:#141414}
/* cookie choices box */
.fb{--text:#F4F2EC;--text-2:#C6C3BA;--text-muted:#9A978F;--gold-text:#D6B460;--focus:#D6B460;color:#F4F2EC;margin-top:var(--space-6);padding:clamp(18px,3.4vw,34px);border-radius:14px;border:1px solid #2A2A30;background:radial-gradient(60% 80% at 85% 0%,rgb(201 162 74/.16),transparent),#0E0E10;scroll-margin-top:96px;outline:0}
.fb h3{font:800 clamp(20px,2.4vw,28px)/1.1 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:-.02em;margin-bottom:6px}
[dir="rtl"] .fb h3{letter-spacing:0}
.fb .fbp{color:var(--text-2);font-size:15px;margin-bottom:var(--space-5)}
.fuses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,24px)}
.fz{display:grid;justify-items:center;align-content:start;gap:10px;padding:0;text-align:center;color:inherit;font:inherit}
.tgw{display:block;margin:0}
.tg{position:relative;display:block;width:88px;height:46px;margin-top:6px;padding:0;border-radius:999px;border:1px solid #4A4A52;background:#2A2A30;color:#C6C3BA;font:inherit;cursor:pointer;transition:background-color .25s,border-color .25s}
.tg .tt{position:absolute;top:0;bottom:0;inset-inline-end:14px;display:flex;align-items:center;font:800 12px/1 var(--font-ui);letter-spacing:.1em}
[dir="rtl"] .tg .tt{letter-spacing:0;font-size:13px}
.tg .kn{position:absolute;top:3px;inset-inline-start:3px;width:38px;height:38px;border-radius:50%;background:#F4F2EC;color:#141414;display:grid;place-items:center;box-shadow:0 2px 6px rgb(0 0 0/.45);transition:inset-inline-start .3s var(--ease-snap)}
.tg .kn svg{width:18px;height:18px}
.tg[data-on="true"]{background:var(--gold);border-color:var(--gold);color:#141414}
.tg[data-on="true"] .tt{inset-inline-end:auto;inset-inline-start:14px}
.tg[data-on="true"] .kn{inset-inline-start:calc(100% - 41px)}
button.tg:hover{border-color:#F4F2EC}
button.tg:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
.tg.lock{cursor:not-allowed;opacity:.7}
.fnote{display:inline-flex;align-items:center;gap:8px;min-height:38px;font-size:13.5px;color:var(--text-muted)}
.fnote svg{width:16px;height:16px}
.fl{font:700 16px/1.2 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:-.01em}
[dir="rtl"] .fl{letter-spacing:0}
.fs{display:inline-flex;padding:5px 10px;border-radius:var(--radius-full);border:1px solid #3A3A42;font:700 11px/1 var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
[dir="rtl"] .fs{letter-spacing:0;text-transform:none;font-size:12.5px}
.fz[data-on="true"] .fs{border-color:var(--gold);color:var(--gold-text)}
.fd{max-width:27ch;font-size:13.5px;line-height:1.45;color:var(--text-muted)}
.fst{margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid #2A2A30;font-size:14.5px;color:var(--text-2)}
@media (max-width:900px){
  .dg{grid-template-columns:1fr;gap:0}
  .mainc{display:contents}
  .dv{order:1;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:var(--space-5)}
  .dv a{border-bottom:1px solid var(--night-line);border-radius:12px;min-height:80px}
  .dv a[aria-current="page"]{border-color:#F8F3E4}
  .side{order:2;position:static;margin-bottom:var(--space-5)}
  .js .seal{display:none}
  .paper{order:3;border-radius:14px}
  .js .rp{display:block}}
@media (max-width:560px){
  .fuses{grid-template-columns:1fr;gap:var(--space-5)}
  .fz{grid-template-columns:88px minmax(0,1fr);justify-items:start;text-align:start;column-gap:16px;row-gap:8px;align-items:start}
  .fd{max-width:none}
  .fz .tgw{grid-row:1/5}
  .fnote{justify-self:start}}
@media (prefers-reduced-motion:reduce){
  .seal .pg,.seal .mk2,.tg,.tg .kn,.dv a{transition-duration:1ms}
  .dv a:hover{transform:none}}
@media print{
  .nav,.side,.dv,.rp,.ck,.foot,.skip,.leg .sh,.meta .btn,.fb,.keep{display:none!important}
  body,.leg{background:#fff!important}
  .dg{display:block}
  .paper{box-shadow:none;border:0;background:#fff;padding:0;min-height:0}}