/*
 | Buyer-facing licence pages: checkout, release, download refusals.
 | A file rather than a <style> block because the site sends
 | Content-Security-Policy: style-src 'self'.
 |
 | The look is alumdeck.com's own (site-v2/assets/css/tokens.css and site.css): the same paper, ink, fonts,
 | button and form controls, so the checkout does not read as another site. Light only, as the site is.
 | A select stays a real <select> (keyboard, screen readers, the phone's own picker); its open list is styled
 | only where the browser allows it (appearance: base-select) and the pointer is a mouse.
 */
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-stretch:75% 100%;font-display:swap;src:url(/assets/fonts/bricolage-latin.woff2) format("woff2")}
@font-face{font-family:Figtree;font-style:normal;font-weight:300 900;font-display:swap;src:url(/assets/fonts/figtree-latin.woff2) format("woff2")}
:root{--paper:#FBF6EC;--card:#FFFFFF;--ink:#1B1530;--ink-2:#4A4360;--ink-3:#6B6480;--line:#E7DECF;--punch:#FF4F6D;--punch-ink:#C21E45;--punch-50:#FFE3E8;--violet-ink:#5B3BE0;--violet-50:#EEE9FF;--body:Figtree,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;--display:"Bricolage Grotesque",Figtree,Arial,sans-serif;--chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B1530' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
*{box-sizing:border-box}
body{font:1.0625rem/1.6 var(--body);margin:0;padding:2.5rem 1rem 3rem;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
.brand{max-width:34rem;margin:0 auto .75rem;font:800 1.375rem/1 var(--display);letter-spacing:-.01em}
.brand a{display:inline-block;padding:.75rem 0;color:var(--ink);text-decoration:none}
main{max-width:34rem;margin:0 auto;background:var(--card);border-radius:20px;padding:2rem 1.5rem;box-shadow:0 1px 0 rgba(27,21,48,.04),0 18px 40px -18px rgba(27,21,48,.28)}
h1{font:800 clamp(1.625rem,1.3rem + 1.6vw,2.125rem)/1.12 var(--display);letter-spacing:-.02em;margin:0 0 .75rem}
p,ul{margin:0 0 1rem;color:var(--ink-2)}
a{color:var(--punch-ink);text-underline-offset:.15em}
a:focus-visible,button:focus-visible{outline:3px solid var(--violet-ink);outline-offset:3px;border-radius:6px}
code{font:.92em ui-monospace,Menlo,Consolas,monospace;background:var(--paper);padding:.1em .35em;border-radius:6px}
label{display:block;font-weight:700;margin:1.1rem 0 .4rem;color:var(--ink)}
label .small{font-weight:500}
input,select{display:block;width:100%;min-height:48px;font:inherit;padding:11px 14px;border:2px solid var(--ink-3);border-radius:12px;background:var(--paper);color:var(--ink);transition:border-color .15s,box-shadow .15s}
input:hover,select:hover{border-color:var(--ink)}
input:focus-visible,select:focus-visible{outline:none;border-color:var(--violet-ink);box-shadow:0 0 0 4px var(--violet-50)}
select{-webkit-appearance:none;appearance:none;padding-inline-end:44px;background-image:var(--chev);background-repeat:no-repeat;background-position:right 12px center;background-size:20px;cursor:pointer}
select:dir(rtl){background-position:left 12px center}
@media (hover:hover) and (pointer:fine){@supports (appearance:base-select){
  select,select::picker(select){appearance:base-select}
  select::picker-icon{display:none}
  select:open{border-color:var(--violet-ink);box-shadow:0 0 0 4px var(--violet-50)}
  select::picker(select){margin-block:8px;padding:6px;border:0;border-radius:16px;background:var(--card);box-shadow:0 30px 80px -30px rgba(27,21,48,.45),0 0 0 1px rgba(27,21,48,.06);max-height:min(60vh,26rem);overflow:auto}
  option{min-height:44px;padding:8px 12px;border-radius:10px;font-weight:600}
  option:hover,option:focus-visible{background:var(--violet-50)}
  option:focus-visible{outline-offset:-3px}
  option:checked{font-weight:800}
  option::checkmark{order:1;margin-inline-start:auto;content:"";width:7px;height:12px;border:solid var(--violet-ink);border-width:0 2.5px 2.5px 0;transform:translate(-4px,-2px);rotate:45deg}
  optgroup{padding-block:4px;font-weight:800;color:var(--ink-3)}
  optgroup option{color:var(--ink)}
}}
button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;margin:1.5rem 0 1rem;padding:14px 26px;font:700 1.0625rem/1.15 var(--body);color:#fff;background:var(--punch);border:0;border-radius:999px;cursor:pointer;box-shadow:0 12px 24px -12px rgba(255,79,109,.8);transition:translate .15s,box-shadow .15s}
button:hover{background:#F04A66;translate:0 -1px;box-shadow:0 16px 30px -12px rgba(255,79,109,.9)}
.error{color:var(--punch-ink);font-weight:700;background:var(--punch-50);padding:.75rem 1rem;border-radius:12px}
.small{font-size:.9375rem;color:var(--ink-3)}
/* My licence (account.php): one block a licence, facts as label and value, then what the buyer can do.
   White on pink is the owner's choice for every pink button (9 Oct 2026), here as on the website. */
h2{font:800 1.25rem/1.2 var(--display);letter-spacing:-.01em;margin:0 0 .9rem}
.lic{margin:1.5rem 0;padding:1.25rem 1.25rem .5rem;border:1px solid var(--line);border-radius:16px;background:var(--paper)}
.pill{display:inline-block;vertical-align:middle;margin-inline-start:.4rem;padding:.2rem .7rem;border-radius:999px;font:800 .75rem/1.4 var(--body);letter-spacing:.06em;text-transform:uppercase}
.pill.ok{background:#DDF5F7;color:#0E6F78}.pill.late{background:#FFF3D1;color:#8A5A00}.pill.off{background:var(--punch-50);color:var(--punch-ink)}
.facts{margin:0 0 1rem}
.facts dt{font:800 .75rem/1.6 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.facts dd{margin:0 0 .8rem;color:var(--ink);overflow-wrap:anywhere}
.lic code{background:var(--card)}
.acts{display:flex;flex-wrap:wrap;gap:.6rem;margin:0 0 1rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;font:700 1rem/1.15 var(--body);color:#fff;background:var(--punch);border:2px solid var(--punch);border-radius:999px;text-decoration:none}
.btn:hover{background:#F04A66;border-color:#F04A66}
.btn.ghost{color:var(--ink);background:var(--card);border-color:var(--ink)}
.btn.ghost:hover{background:var(--paper)}
@media (max-width:30rem){.acts .btn{width:100%}.lic code{font-size:.8em}}
.foot{margin:1.5rem 0 0;padding-top:1rem;border-top:1px solid var(--line);font-size:.9375rem}
.foot a{display:inline-block;padding:.6rem 0}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}