:root {
    --paper:#fafafa; --white:#ffffff; --ink:#0a0a0a; --body:#404049; --soft:#71717a;
    --sky:#6366f1; --sky-deep:#4f46e5; --sky-tint:#eef2ff; --line:#e5e5e5;
    --green:#059669; --violet:#7c3aed; --amber:#d97706;
    --radius:16px; --shadow:0 8px 24px #0a0a0a0f;
  }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body { margin:0; background:var(--paper); color:var(--ink);
         font-family:'Mona Sans', system-ui, sans-serif; font-size:16px; line-height:1.65; }
  img { max-width:100%; display:block; }
  a { color:var(--sky); }

  /* nav */
  nav { position:sticky; top:0; z-index:50; background:#ffffffe6; backdrop-filter:blur(10px);
        border-bottom:1px solid var(--line); }
  .nav-in { max-width:1200px; margin:0 auto; padding:.7rem 1.4rem; display:flex; align-items:center; gap:2rem; }
  .logo { display:flex; align-items:center; gap:.55rem; text-decoration:none; color:var(--ink); margin-right:auto; }
  .logo img { height:34px; width:34px; mix-blend-mode:multiply; }
  .logo b { font-weight:800; font-size:1.06rem; letter-spacing:-.01em; }
  .logo b span { font-weight:500; color:var(--soft); }
  .nav-links { display:flex; gap:1.5rem; }
  .nav-links a { color:var(--body); text-decoration:none; font-size:.9rem; font-weight:600; }
  .nav-links a:hover { color:var(--sky); }
  .btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; text-decoration:none;
         font-weight:700; font-size:.92rem; border-radius:12px; padding:.72rem 1.25rem; transition:background .18s, color .18s, border-color .18s; }
  .btn-primary { background:var(--sky); color:#fff; }
  .btn-primary:hover { background:var(--sky-deep); }
  .btn-ghost { background:transparent; color:var(--ink); border:1.5px solid var(--line); }
  .btn-ghost:hover { border-color:var(--sky); color:var(--sky); }
  @media (max-width:760px){ .nav-links { display:none; } }

  /* hero */
  .hero { background:linear-gradient(180deg, #eef2ff66 0%, var(--paper) 100%); overflow:hidden; }
  .hero-in { max-width:1200px; margin:0 auto; padding:4rem 1.4rem 3.4rem; display:grid;
             grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:3rem; align-items:center; }
  .hero h1 { font-size:clamp(2rem,4.4vw,3.3rem); font-weight:800; line-height:1.08; letter-spacing:-.025em;
             margin:0 0 1.1rem; text-wrap:balance; }
  .hero h1 em { font-style:normal; color:var(--sky); }
  .freedom { font-family:'Newsreader', serif; font-style:italic; font-weight:500;
             font-size:clamp(1.2rem,2vw,1.5rem); color:var(--sky); margin:0 0 1.1rem; }
  .hero p.sub { color:var(--body); max-width:46ch; margin:0 0 1.7rem; font-size:1.05rem; }
  .hero-ctas { display:flex; gap:.8rem; flex-wrap:wrap; margin-bottom:2rem; }
  .trust { display:flex; gap:2rem; flex-wrap:wrap; }
  .trust div b { display:block; font-size:1.25rem; font-weight:800; letter-spacing:-.02em; }
  .trust div span { font-size:.82rem; color:var(--soft); font-weight:600; }
  .hero-visual { position:relative; animation:settle 1s cubic-bezier(.2,.7,.2,1) both; }
  .hero-visual .photo { border-radius:var(--radius); box-shadow:var(--shadow); aspect-ratio:3/2; object-fit:cover; }
  .hero-visual .chip { position:absolute; left:-14px; bottom:22px; background:#fff; border-radius:14px;
        box-shadow:var(--shadow); padding:.7rem 1rem; display:flex; align-items:center; gap:.6rem; }
  .hero-visual .chip img { height:26px; width:26px; mix-blend-mode:multiply; }
  .hero-visual .chip b { font-size:.85rem; }
  .hero-visual .chip span { display:block; font-size:.72rem; color:var(--soft); font-weight:600; }
  @keyframes settle { from { opacity:0; transform:translateY(16px) scale(.985); } to { opacity:1; transform:none; } }
  @media (prefers-reduced-motion:reduce){ .hero-visual { animation:none; } }
  @media (max-width:900px){ .hero-in { grid-template-columns:1fr; } }

  /* generic section */
  section { padding:4.2rem 0 0; }
  .in { max-width:1200px; margin:0 auto; padding:0 1.4rem; }
  h2 { font-size:clamp(1.5rem,2.8vw,2.15rem); font-weight:800; letter-spacing:-.02em; line-height:1.15; margin:0 0 .6rem; text-wrap:balance; }
  .lede { color:var(--body); max-width:62ch; margin:0 0 2rem; font-size:1.02rem; }

  /* platform / how it works */
  .plat { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:3rem; align-items:center; }
  .plat img { border-radius:var(--radius); box-shadow:var(--shadow); }
  .steps { list-style:none; margin:1.2rem 0 0; padding:0; counter-reset:step; }
  .steps li { position:relative; padding:0 0 1.15rem 3.1rem; counter-increment:step; }
  .steps li::before { content:counter(step); position:absolute; left:0; top:.05rem; width:2.1rem; height:2.1rem;
        border-radius:50%; background:var(--sky-tint); color:var(--sky); font-weight:800; font-size:.95rem;
        display:flex; align-items:center; justify-content:center; }
  .steps li b { display:block; font-weight:700; }
  .steps li span { color:var(--body); font-size:.93rem; }
  @media (max-width:900px){ .plat { grid-template-columns:1fr; } }

  /* families */
  .feature { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:0; background:var(--white);
             border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
  .feature img { height:100%; object-fit:cover; }
  .feature .body { padding:2rem 2.2rem; }
  .fam-name { font-weight:800; letter-spacing:.02em; font-size:1.1rem; margin:0 0 .2rem; }
  .status { display:inline-block; font-size:.72rem; font-weight:700; padding:.18rem .6rem; border-radius:999px;
            background:var(--sky-tint); color:var(--sky-deep); vertical-align:middle; margin-left:.6rem; }
  .feature p { color:var(--body); font-size:.96rem; margin:.5rem 0; }
  .modes { display:flex; gap:1.6rem; flex-wrap:wrap; margin:1rem 0 1.1rem; }
  .modes div b { display:block; font-size:.9rem; }
  .modes div span { font-size:.82rem; color:var(--soft); }
  .maint { font-size:.82rem; color:var(--soft); border-top:1px solid var(--line); padding-top:.9rem; margin-top:1rem; }
  .maint b { color:var(--ink); font-weight:700; }
  @media (max-width:900px){ .feature { grid-template-columns:1fr; } .feature img { max-height:260px; width:100%; } }

  .fam-row { display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); margin-top:1.2rem; }
  .fam { background:var(--white); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
  .fam img { aspect-ratio:16/9; object-fit:cover; width:100%; }
  .fam .body { padding:1.3rem 1.5rem 1.5rem; }
  .fam p { color:var(--body); font-size:.9rem; margin:.4rem 0 .8rem; }
  .fam .fam-name { font-size:1rem; }
  .fam .maint { margin-top:.8rem; padding-top:.7rem; }

  /* research */
  .papers { list-style:none; margin:0; padding:0; background:var(--white); border:1px solid var(--line);
            border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; }
  .papers li { padding:1.1rem 1.6rem; border-top:1px solid var(--line); display:grid;
               grid-template-columns:minmax(0,1fr) auto; gap:.15rem 1.4rem; align-items:baseline; }
  .papers li:first-child { border-top:none; }
  .papers .inst { grid-column:1/-1; font-size:.78rem; font-weight:700; color:var(--soft); letter-spacing:.02em; }
  .papers a.title { color:var(--ink); text-decoration:none; font-weight:700; font-size:.98rem; line-height:1.45; }
  .papers a.title:hover { color:var(--sky); }
  .papers .uses { font-size:.78rem; color:var(--soft); font-weight:600; white-space:nowrap; }
  .papers .uses b { color:var(--sky); }
  .register-note { margin-top:1rem; font-size:.86rem; color:var(--soft); }

  /* benchmark */
  .bench { width:100%; border-collapse:collapse; background:var(--white); border:1px solid var(--line);
           border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
  .bench th { font-family:'Monaspace Argon', ui-monospace, monospace; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--soft);
              font-weight:700; text-align:left; padding:.9rem 1.4rem; background:#f2f6fd; border-bottom:1px solid var(--line); }
  .bench td { padding:1rem 1.4rem; border-bottom:1px solid var(--line); font-size:.94rem; }
  .bench tr:last-child td { border-bottom:none; }
  .f1 { font-weight:800; letter-spacing:-.01em; }
  .lead-row td { background:#f4f8ff; }
  .lead-row .f1 { color:var(--sky); }
  .bar { display:inline-block; height:7px; background:var(--line); border-radius:4px; vertical-align:middle; margin-left:.8rem; }
  .lead-row .bar { background:var(--sky); }
  .bench-note { margin-top:.9rem; font-size:.84rem; color:var(--soft); max-width:70ch; }

  /* swiss band */
  .band { margin-top:4.2rem; position:relative; overflow:hidden; }
  .band img.bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 60%; }
  .band .scrim { position:absolute; inset:0; background:linear-gradient(90deg,#0a0a0ae6 0%,#0a0a0a99 55%,#0a0a0a40 100%); }
  .band .in { position:relative; padding:4.5rem 1.4rem; color:#fff; }
  .band h2 { color:#fff; max-width:20ch; }
  .band .freedom { color:#aac4ff; }
  .band p { color:#c9d6f2; max-width:52ch; font-size:.98rem; }
  .band .quiet { display:grid; gap:1.6rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); margin-top:2rem; max-width:900px; }
  .band .quiet b { display:block; color:#fff; font-weight:800; margin-bottom:.2rem; }
  .band .quiet span { color:#b7c7ea; font-size:.88rem; }
  .band .calm { font-family:'Newsreader',serif; font-style:italic; font-size:1.2rem; color:#aac4ff; }

  /* footer */
  footer { background:var(--white); border-top:1px solid var(--line); }
  .foot-in { max-width:1200px; margin:0 auto; padding:2rem 1.4rem; display:flex; flex-wrap:wrap;
             gap:1.4rem; align-items:center; justify-content:space-between; }
  .ch { display:flex; align-items:center; gap:.75rem; }
  .chflag { width:30px; height:30px; background:#da291c; border-radius:6px; position:relative; flex:none; }
  .chflag::before,.chflag::after { content:""; position:absolute; background:#fff; }
  .chflag::before { width:16px; height:4.5px; left:7px; top:12.75px; }
  .chflag::after { width:4.5px; height:16px; left:12.75px; top:7px; }
  .ch b { display:block; font-size:.9rem; font-weight:800; letter-spacing:.03em; }
  .ch span { font-size:.78rem; color:var(--soft); }
  .foot-tag { font-weight:700; color:var(--sky); font-size:.85rem; letter-spacing:.04em; text-transform:uppercase; }
  .foot-contact { font-size:.84rem; color:var(--soft); }
  a:focus-visible,.btn:focus-visible { outline:2px solid var(--sky); outline-offset:3px; }

/* ---------- mobile ---------- */
.bench-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:var(--radius); }
@media (max-width:760px) {
  section { padding:2.6rem 0 0; }
  .hero-in { padding:2.2rem 1.2rem 2.4rem; gap:1.8rem; }
  .hero h1 { font-size:clamp(1.8rem,8vw,2.3rem); }
  .hero p.sub { font-size:.98rem; }
  .trust { gap:1.1rem 1.6rem; }
  .in { padding:0 1.2rem; }
  .plat { gap:1.6rem; }
  .feature .body { padding:1.4rem 1.3rem; }
  .papers li { grid-template-columns:1fr; padding:1rem 1.2rem; }
  .papers .uses { white-space:normal; }
  .bench { min-width:560px; }
  .band .in { padding:3rem 1.2rem; }
  .foot-in { flex-direction:column; align-items:flex-start; gap:1rem; padding:1.6rem 1.2rem; }
  .steps li { padding-left:2.8rem; }
  .hero-visual .chip { left:10px; bottom:12px; }
}

/* ---------- team & faces ---------- */
.team-grid { display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); }
.person { background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
          overflow:hidden; box-shadow:var(--shadow); text-align:left; }
.person img { aspect-ratio:1; object-fit:cover; width:100%; }
.person .body { padding:1rem 1.2rem 1.2rem; }
.person b { display:block; font-size:.98rem; font-weight:800; }
.person .role { font-size:.82rem; color:var(--body); }
.person .fam-tag { display:inline-block; margin-top:.5rem; font-size:.72rem; font-weight:700;
                   padding:.16rem .55rem; border-radius:999px; background:var(--sky-tint); color:var(--sky-deep); }
.avatars { display:flex; align-items:center; margin-top:.6rem; }
.avatars img { width:30px; height:30px; border-radius:50%; object-fit:cover; border:2px solid #fff;
               margin-left:-8px; box-shadow:0 2px 6px #0a0a0a22; }
.avatars img:first-child { margin-left:0; }
.avatars span { margin-left:.6rem; font-size:.76rem; color:var(--soft); font-weight:600; }

/* ---------- subpages ---------- */
.crumb { font-size:.82rem; font-weight:700; }
.crumb a { text-decoration:none; }
.page-hero { background:linear-gradient(180deg,#eef2ff66 0%,var(--paper) 100%); }
.page-hero .in { padding-top:2.6rem; padding-bottom:2.6rem; display:grid;
                 grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:2.6rem; align-items:center; }
.page-hero img { border-radius:var(--radius); box-shadow:var(--shadow); aspect-ratio:16/10; object-fit:cover; }
.page-hero h1 { font-size:clamp(1.9rem,4vw,2.8rem); font-weight:800; letter-spacing:-.02em; line-height:1.1; margin:.6rem 0 .9rem; }
.page-hero p { color:var(--body); max-width:50ch; }
@media (max-width:860px){ .page-hero .in { grid-template-columns:1fr; } }
.ds-table { width:100%; border-collapse:collapse; background:var(--white); border:1px solid var(--line);
            border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.ds-table th { font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; color:var(--soft); font-weight:700;
               text-align:left; padding:.85rem 1.3rem; background:#f2f6fd; border-bottom:1px solid var(--line); }
.ds-table td { padding:.85rem 1.3rem; border-bottom:1px solid var(--line); font-size:.92rem; }
.ds-table tr:last-child td { border-bottom:none; }
.pill { display:inline-block; font-size:.72rem; font-weight:700; padding:.16rem .6rem; border-radius:999px; }
.pill-live { background:#e5f5ec; color:var(--green); }
.pill-prep { background:#f1eafc; color:var(--violet); }
.pill-new { background:var(--sky-tint); color:var(--sky-deep); }
.cta-band { margin-top:4rem; background:var(--ink); }
.cta-band .in { padding:2.6rem 1.4rem; display:flex; flex-wrap:wrap; gap:1.2rem; align-items:center; justify-content:space-between; }
.cta-band h2 { color:#fff; margin:0; font-size:1.4rem; }
.cta-band p { color:#b7c7ea; margin:.2rem 0 0; font-size:.9rem; }

/* gazette editorial notes */
.gaz-note { grid-column:1/-1; font-family:'Newsreader',serif; font-style:italic;
            color:var(--sky-deep); font-size:.9rem; line-height:1.5; }

/* widgets */
.picker { display:flex; gap:.6rem; flex-wrap:wrap; margin:0 0 1rem; }
.chip { font:inherit; font-weight:700; font-size:.88rem; padding:.55rem 1.1rem; border-radius:999px;
        border:1.5px solid var(--line); background:var(--white); color:var(--body); cursor:pointer;
        transition:background-color .15s, border-color .15s, color .15s; }
.chip:hover { border-color:var(--sky); color:var(--sky); }
.chip.active { background:var(--sky); border-color:var(--sky); color:#fff; }
.picker-out { background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
              box-shadow:var(--shadow); padding:1.3rem 1.5rem; margin-bottom:2rem;
              display:flex; gap:1.2rem; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.picker-out p { margin:0; color:var(--body); max-width:60ch; }
.term-widget { background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
               box-shadow:var(--shadow); padding:1.5rem 1.7rem; margin-top:1.6rem; }
.tw-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:.6rem; }
.tw-head span { font-weight:800; color:var(--sky); }
.term-widget input[type=range] { width:100%; accent-color:var(--sky); margin:.2rem 0 1.2rem; }
.tw-row { display:grid; grid-template-columns:220px 1fr 90px; gap:1rem; align-items:center; margin:.45rem 0; }
.tw-row span { font-size:.85rem; color:var(--body); font-weight:600; }
.tw-row b { font-size:.85rem; text-align:right; }
.tw-bar { height:10px; background:var(--haze); border-radius:6px; overflow:hidden; }
.tw-bar i { display:block; height:100%; border-radius:6px; transition:width .25s ease-out; }
.tw-note { font-size:.85rem; color:var(--soft); margin:.9rem 0 0; }
@media (max-width:640px){ .tw-row { grid-template-columns:1fr; gap:.25rem; } .tw-row b { text-align:left; } }


/* web-interface-guidelines pass */
.skip-link { position:absolute; left:-9999px; top:0; z-index:100; background:var(--sky); color:#fff;
             padding:.6rem 1.1rem; border-radius:0 0 10px 0; font-weight:700; }
.skip-link:focus { left:0; }
section[id], #main { scroll-margin-top: 76px; }
a, button, .btn, .chip { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.chip:focus-visible, .search:focus-visible { outline:2px solid var(--sky); outline-offset:2px; }
.trust b, .f1, .count { font-variant-numeric: tabular-nums; }

/* dimension attrs must not shrink layout images */
.page-hero img, .feature img, .fam img, .person img, .plat img, .hero-visual .photo { width:100%; height:auto; }
.feature img { height:100%; }


/* ---- family branches: creative within the A4P pattern ---- */
body[data-accent] .status { background: var(--accent-tint); color: var(--accent); }
body[data-accent] .btn-primary { background: var(--accent); }
body[data-accent] .btn-primary:hover { filter: brightness(.9); }
body[data-accent] .crumb a, body[data-accent] .freedom { color: var(--accent); }
body[data-accent="privacy"] { --accent:#059669; --accent-tint:#ecfdf5; }
body[data-accent="access"] { --accent:#0284c7; --accent-tint:#f0f9ff; }
body[data-accent="watermark"] { --accent:#7c3aed; --accent-tint:#f5f3ff; }
body[data-accent="psych"] { --accent:#d97706; --accent-tint:#fffbeb; }

/* privacy: redaction that lifts on hover */
.mask { background: var(--ink); color: var(--ink); border-radius:4px; padding:0 .3em; cursor:pointer;
        transition: background-color .35s ease, color .35s ease; }
.mask:hover, .mask:focus-visible { background: #ecfdf5; color:#059669; }

/* watermark: faint diagonal paper-mark behind the page hero */
body[data-accent="watermark"] .page-hero { position:relative; overflow:hidden; }
body[data-accent="watermark"] .page-hero::before { content:"AIR · AIR · AIR · AIR · AIR · AIR · AIR · AIR";
  position:absolute; inset:-40% -20%; transform:rotate(-24deg); font-weight:900; font-size:5.5rem; line-height:2.2;
  color:#7c3aed; opacity:.045; pointer-events:none; white-space:pre-wrap; }

/* access: braille-dot divider + generous base type */
body[data-accent="access"] { font-size:17.5px; }
.braille-divider { height:14px; margin:0 0 1.2rem;
  background-image: radial-gradient(circle at 4px 4px, #0284c7 3px, transparent 3.5px),
                    radial-gradient(circle at 4px 4px, #0284c766 3px, transparent 3.5px);
  background-size: 22px 14px, 22px 14px; background-position: 0 0, 11px 3px; background-repeat: repeat-x; width:180px; }

/* psych: soft extra-rounded, warm */
body[data-accent="psych"] .fam, body[data-accent="psych"] .person,
body[data-accent="psych"] .ds-table, body[data-accent="psych"] .page-hero img { border-radius:26px; }


/* ================= Swiss banknote pass ================= */
/* fine guilloche curves behind the hero, like the note's ornament layer */
.hero { position:relative; }
.hero::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image: radial-gradient(circle at 85% 15%, transparent 58px, #6366f11a 59px, transparent 60px),
                    radial-gradient(circle at 85% 15%, transparent 88px, #6366f114 89px, transparent 90px),
                    radial-gradient(circle at 85% 15%, transparent 118px, #6366f10f 119px, transparent 120px),
                    radial-gradient(circle at 8% 82%, transparent 48px, #6366f114 49px, transparent 50px),
                    radial-gradient(circle at 8% 82%, transparent 78px, #6366f10f 79px, transparent 80px); }

/* microtext strip: the banknote's tiny repeated lettering, used as a section divider */
.microtext { overflow:hidden; white-space:nowrap; user-select:none; pointer-events:none;
  font-family:'Monaspace Argon', ui-monospace, monospace; font-size:.55rem; letter-spacing:.35em;
  color:#a5b4fc; text-transform:uppercase; padding:1.6rem 0 0; text-align:center; }

/* serial-number styling for the trust stats, like note serials */
.trust div b { font-family:'Monaspace Argon', ui-monospace, monospace; letter-spacing:.06em; }

/* family cards as denominations: vertical color band with rotated name, like the note's vertical value strip */
.fam, .feature { position:relative; }
.fam[data-fam]::before, .feature[data-fam]::before { content:attr(data-fam); position:absolute; top:0; bottom:0; left:0;
  width:30px; display:flex; align-items:center; justify-content:center;
  writing-mode:vertical-rl; transform:rotate(180deg);
  font-family:'Monaspace Argon', ui-monospace, monospace; font-size:.6rem; letter-spacing:.4em; font-weight:700;
  color:#fff; z-index:2; }
.fam[data-fam] img, .feature[data-fam] img { }
.fam[data-fam] .body { padding-left:2.2rem; }
.feature[data-fam] .body { padding-left:2.2rem; }
.fam[data-fam="AI4PRIVACY"]::before, .feature[data-fam="AI4PRIVACY"]::before { background:linear-gradient(180deg,#059669,#065f46); }
.fam[data-fam="AI4ACCESS"]::before { background:linear-gradient(180deg,#0284c7,#075985); }
.fam[data-fam="AI4WATERMARK"]::before { background:linear-gradient(180deg,#7c3aed,#5b21b6); }
.fam[data-fam="AI4PSYCH"]::before { background:linear-gradient(180deg,#d97706,#92400e); }

/* denomination corner numeral, like the big value numeral on a note */
.denom { position:absolute; right:14px; top:8px; z-index:2; font-weight:900; font-size:1.7rem; letter-spacing:-.03em;
  color:#ffffff; text-shadow:0 1px 8px #0a0a0a55; }

/* fine-line engraving edge on cards */
.fam, .feature, .papers, .bench, .ds-table { outline:1px solid #0a0a0a08; outline-offset:3px; }