/* Layout: header with mode switch, hero = live Tomo device + scenario list, then comparison, parent view, "what's not there". */
:root{
  --bg:#F3F1EC; --surface:#FFFFFF; --ink:#1C1B19; --muted:#6B675F; --line:#DDD8CE;
  --kid:#F2A62B; --kid-2:#E4572E; --adult:#B8925A; --adult-2:#2F4B5C;
  --ok:#2E8B57; --no:#B5412F;
  --display:'Unbounded', 'Arial Black', sans-serif;
  --body:'Figtree', system-ui, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, monospace;
  --acc: var(--kid); --acc-2: var(--kid-2);
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#141412; --surface:#1E1D1A; --ink:#EEEAE2; --muted:#A39E93; --line:#33312C;
  --kid:#F6B544; --kid-2:#F07152; --adult:#D2AE74; --adult-2:#8DB3C7; --ok:#5CC08A; --no:#E07A66; color-scheme:dark } }
:root[data-theme="dark"]{
  --bg:#141412; --surface:#1E1D1A; --ink:#EEEAE2; --muted:#A39E93; --line:#33312C;
  --kid:#F6B544; --kid-2:#F07152; --adult:#D2AE74; --adult-2:#8DB3C7; --ok:#5CC08A; --no:#E07A66; color-scheme:dark }

body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px;padding-block:28px 80px;display:flex;flex-direction:column;gap:72px}
.app[data-mode="adulti"]{--acc:var(--adult);--acc-2:var(--adult-2)}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;line-height:1.1}
h1{font-size:clamp(30px,5vw,52px);font-weight:700}
h2{font-size:clamp(22px,3vw,32px);font-weight:700}
h3{font-size:17px;font-weight:500}
p{margin:0}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}

/* header */
header{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-end;justify-content:space-between}
.intro{display:flex;flex-direction:column;gap:12px;max-width:620px}
.intro p{color:var(--muted);font-size:17px}
.switch{display:flex;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:5px;gap:4px}
.switch button{font:600 15px var(--body);border:0;background:transparent;color:var(--muted);padding:12px 20px;border-radius:999px;cursor:pointer;transition:background .3s,color .3s}
.switch button[aria-pressed="true"]{background:var(--acc);color:#1C1B19}
.switch button:focus-visible,.scen:focus-visible{outline:3px solid var(--acc-2);outline-offset:2px}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:48px;align-items:start}
@media (max-width:820px){.hero{grid-template-columns:minmax(0,1fr)}}
.stage{display:flex;flex-direction:column;align-items:center;gap:18px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 16px)}

.device{position:relative;width:min(300px,78vw);aspect-ratio:62/92;border-radius:26px;padding:7px;background:linear-gradient(140deg,#C9CCCF,#8E9296 60%,#B4B7BA);box-shadow:0 30px 60px rgba(0,0,0,.28);transition:background .5s}
.app[data-mode="ragazzi"] .device{background:linear-gradient(140deg,#FFC65A,#E4572E 70%,#F2A62B)}
.btn-top{position:absolute;top:-6px;height:7px;border-radius:4px 4px 0 0}
.btn-top.bar{left:22%;width:36%;background:#6F7377}
.btn-top.act{left:68%;width:9%;background:#E4572E}
.btn-side{position:absolute;left:-6px;top:30%;width:7px;height:16%;border-radius:4px 0 0 4px;background:#6F7377}
.screen{position:relative;width:100%;height:100%;border-radius:20px;background:#050505;overflow:hidden;color:#F4F1EA;font-family:var(--body)}
.view{position:absolute;inset:0;padding:22px 18px;display:flex;flex-direction:column;gap:12px;animation:in .45s ease both}
@keyframes in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.st{display:flex;justify-content:space-between;font:500 12px var(--mono);color:#8E8A82}
.big{font:700 44px/1 var(--display);letter-spacing:-1px}
.mid{font:700 22px/1.15 var(--display)}
.dim{color:#9E998F;font-size:14px}
.card{border-radius:14px;padding:14px;background:#1B1A18}
.card.acc{background:var(--acc);color:#1C1B19}
.card.alt{background:var(--acc-2);color:#fff}
.row{display:flex;gap:8px}
.pill{flex:1;text-align:center;border-radius:12px;padding:12px 8px;font-weight:700;font-size:14px;background:#26241F}
.pill.acc{background:var(--acc);color:#1C1B19}
.pill.warn{background:#E4572E;color:#fff}
.grow{flex:1}
.center{align-items:center;justify-content:center;text-align:center}
.ring{width:120px;height:120px;border-radius:50%;border:3px solid var(--acc);position:relative;display:flex;align-items:center;justify-content:center;font:700 16px var(--display)}
.ring::before,.ring::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:3px solid var(--acc);animation:pulse 1.8s ease-out infinite}
.ring::after{animation-delay:.9s}
@keyframes pulse{from{transform:scale(1);opacity:.8}to{transform:scale(1.7);opacity:0}}
.wave{display:flex;gap:4px;align-items:center;height:70px;justify-content:center}
.wave i{width:6px;border-radius:3px;background:var(--acc);animation:w .9s ease-in-out infinite}
@keyframes w{0%,100%{height:12px}50%{height:64px}}
.bubble{align-self:flex-start;max-width:85%;border-radius:14px 14px 14px 4px;background:#26241F;padding:10px 12px;font-size:14px;animation:in .4s ease both}
.bubble.me{align-self:flex-end;border-radius:14px 14px 4px 14px;background:var(--acc);color:#1C1B19}
.qr{width:150px;height:150px;align-self:center;background:#fff;border-radius:8px;padding:8px;display:grid;grid-template-columns:repeat(21,1fr)}
.qr b{background:#111}.qr s{background:#fff;text-decoration:none}
.meter{height:10px;border-radius:5px;background:#26241F;overflow:hidden}
.meter span{display:block;height:100%;background:var(--acc);animation:fill 1.2s ease both}
@keyframes fill{from{width:0}}
.count{font:700 96px/1 var(--display);color:var(--acc);animation:pop .9s ease both}
@keyframes pop{0%{transform:scale(.4);opacity:0}40%{transform:scale(1.1);opacity:1}100%{transform:scale(1)}}
.bomb{width:110px;height:110px;border-radius:50%;background:#2A2824;align-self:center;position:relative;animation:shake .25s infinite}
.bomb::after{content:"";position:absolute;top:-16px;left:60px;width:6px;height:22px;background:#C9A45C;border-radius:3px;transform:rotate(25deg)}
@keyframes shake{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
.boom{font:700 52px/1 var(--display);color:var(--acc-2);animation:pop .7s ease both}
.lock{width:70px;height:56px;border-radius:10px;background:var(--acc);align-self:center;position:relative;margin-top:30px}
.lock::before{content:"";position:absolute;left:14px;top:-34px;width:30px;height:36px;border:7px solid var(--acc);border-bottom:0;border-radius:22px 22px 0 0;transition:transform .5s}
.lock.open::before{transform:translate(18px,-8px) rotate(25deg)}
.radar{width:170px;height:170px;border-radius:50%;align-self:center;position:relative;background:radial-gradient(circle,transparent 30%,rgba(255,255,255,.06) 31%,transparent 32%,transparent 60%,rgba(255,255,255,.06) 61%,transparent 62%);border:2px solid #2A2824;overflow:hidden}
.radar::before{content:"";position:absolute;inset:0;background:conic-gradient(from 0deg,var(--acc) 0deg,transparent 60deg);opacity:.35;animation:spin 2.4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.radar i{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 4px rgba(242,166,43,.25)}
.dimmed{filter:brightness(.35);transition:filter 1s}
.check{width:58px;height:58px;border-radius:50%;background:var(--ok);display:flex;align-items:center;justify-content:center;align-self:center;animation:pop .6s ease both}
.check svg{width:30px;height:30px}

.caption{max-width:340px;min-height:72px;text-align:center;font-size:15px;color:var(--ink);transition:opacity .3s}
.dots{display:flex;gap:6px}
.dots i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:background .3s,width .3s}
.dots i.on{background:var(--acc);width:20px;border-radius:4px}

.scenes{display:flex;flex-direction:column;gap:14px;min-width:0}
.scenes-head{display:flex;flex-direction:column;gap:8px;margin-bottom:6px}
.scenes-head p{color:var(--muted)}
.scen{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:center;text-align:left;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:16px;padding:14px 16px;cursor:pointer;font:inherit;transition:border-color .25s,transform .25s}
.scen:hover{transform:translateX(4px)}
.scen[aria-current="true"]{border-color:var(--acc);box-shadow:inset 4px 0 0 var(--acc)}
.scen .ico{width:44px;height:44px;border-radius:12px;background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--acc-2)}
.scen .ico svg{width:24px;height:24px}
.scen b{display:block;font-size:16px}
.scen span{color:var(--muted);font-size:14px}

/* comparison */
.section{display:flex;flex-direction:column;gap:22px}
.section > p{color:var(--muted);max-width:640px}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
table{border-collapse:collapse;width:100%;min-width:640px}
th,td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;font-size:15px}
tr:last-child td{border-bottom:0}
thead th{font:600 13px var(--mono);letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
td:first-child{font-weight:700;width:26%}
.colk,.cola{transition:background .4s,opacity .4s}
.app[data-mode="ragazzi"] .colk{background:color-mix(in srgb,var(--kid) 14%,transparent)}
.app[data-mode="adulti"] .cola{background:color-mix(in srgb,var(--adult) 16%,transparent)}
.app[data-mode="ragazzi"] .cola,.app[data-mode="adulti"] .colk{opacity:.55}
.tag{display:inline-block;font:600 12px var(--mono);padding:2px 8px;border-radius:6px;margin-right:6px;vertical-align:1px}
.tag.y{background:color-mix(in srgb,var(--ok) 18%,transparent);color:var(--ok)}
.tag.n{background:color-mix(in srgb,var(--no) 16%,transparent);color:var(--no)}
.tag.l{background:color-mix(in srgb,var(--kid) 22%,transparent);color:var(--ink)}

/* parent app / adults freedom */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,320px);gap:40px;align-items:center}
@media (max-width:820px){.split{grid-template-columns:minmax(0,1fr)}}
.points{display:flex;flex-direction:column;gap:16px}
.point{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px}
.point .mk{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:700 14px var(--mono)}
.point .mk.y{background:var(--ok);color:#fff}.point .mk.n{background:var(--no);color:#fff}
.phone{width:100%;max-width:300px;justify-self:center;border-radius:34px;border:8px solid #1C1B19;background:#F7F5F0;color:#1C1B19;padding:18px 16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 24px 50px rgba(0,0,0,.2)}
.phone h4{margin:0;font:700 16px var(--display)}
.ph-card{background:#fff;border:1px solid #E4DFD5;border-radius:14px;padding:12px;font-size:14px;display:flex;flex-direction:column;gap:6px}
.ph-card .t{font:600 11px var(--mono);letter-spacing:1px;color:#7A756C;text-transform:uppercase}
.map{height:90px;border-radius:10px;background:repeating-linear-gradient(0deg,#E9E5DC 0 1px,transparent 1px 18px),repeating-linear-gradient(90deg,#E9E5DC 0 1px,transparent 1px 18px),#F3F0E8;position:relative}
.map i{position:absolute;left:58%;top:40%;width:14px;height:14px;border-radius:50%;background:#E4572E;box-shadow:0 0 0 6px rgba(228,87,46,.25)}
.locked{display:flex;gap:8px;align-items:center;color:#7A756C}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{border:1px dashed var(--line);border-radius:999px;padding:10px 16px;font-weight:600;color:var(--muted);text-decoration:line-through;text-decoration-color:var(--no)}
.only-k,.only-a{display:none}
.app[data-mode="ragazzi"] .only-k{display:block}
.app[data-mode="adulti"] .only-a{display:block}
.note{font-size:13px;color:var(--muted)}

.devrow{position:relative;display:flex;align-items:center;justify-content:center;width:100%}
.hw{border:0;padding:0;cursor:pointer;z-index:2}
.hw:hover{filter:brightness(1.25)}
.hw.flash{filter:brightness(1.8)}
.hw:focus-visible{outline:3px solid var(--acc-2);outline-offset:2px}
.btn-top.bar.want,.btn-top.act.want,.btn-side.want{animation:want 1s ease-in-out infinite}
@keyframes want{0%,100%{box-shadow:0 0 0 0 var(--acc)}50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--acc) 35%,transparent)}}
.go{cursor:pointer;outline:2px solid var(--acc);outline-offset:3px;animation:goPulse 1.4s ease-in-out infinite}
@keyframes goPulse{0%,100%{outline-color:var(--acc)}50%{outline-color:transparent}}
.screen.tapany{cursor:pointer}
.buddy{position:absolute;right:-6px;top:38%;width:64px;height:94px;border-radius:12px;border:5px solid #8E9296;background:#111;color:#fff;font:700 12px var(--body);cursor:pointer;animation:float 2s ease-in-out infinite;z-index:3}
.app[data-mode="ragazzi"] .buddy{border-color:#2F6B8A}
@keyframes float{0%,100%{transform:translateX(0)}50%{transform:translateX(-10px)}}
.buddy.bump{animation:bump .5s ease forwards}
@keyframes bump{to{transform:translateX(-70px) rotate(-8deg)}}
@media (max-width:420px){.buddy{right:-2px;width:52px;height:78px}}
.hint{font:600 14px var(--body);color:var(--acc-2);min-height:22px;text-align:center}
.ctrl{display:flex;gap:10px}
.mini{font:600 13px var(--body);border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:8px 14px;cursor:pointer}
.mini:focus-visible{outline:3px solid var(--acc-2);outline-offset:2px}
.recdot{width:12px;height:12px;border-radius:50%;background:#E4572E;display:inline-block;margin-right:6px;animation:goPulse 1s infinite}

/* ---------- skins (the Tomo UI styles designed earlier) ---------- */
.skins{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;max-width:360px}
.skins button{font:600 13px var(--body);border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:7px 12px;cursor:pointer}
.skins button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.skins button:focus-visible{outline:3px solid var(--acc-2);outline-offset:2px}
.skin-label{font:600 12px var(--mono);letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.screen[data-skin]:not([data-skin="base"]) .st{font:500 11px 'Azeret Mono',ui-monospace,monospace;letter-spacing:1px;text-transform:uppercase;color:#77787c}
/* Lastra */
.screen[data-skin="lastra"] .big{font:800 66px/.9 'Big Shoulders Display','Arial Narrow',sans-serif;text-transform:uppercase;letter-spacing:0}
.screen[data-skin="lastra"] .mid{font:800 32px/.95 'Big Shoulders Display','Arial Narrow',sans-serif;text-transform:uppercase}
.screen[data-skin="lastra"] .card,.screen[data-skin="lastra"] .card.acc,.screen[data-skin="lastra"] .card.alt{background:none;color:#ecebe8;border-radius:0;border-top:1px solid #2a2b2e;padding:12px 0;font:600 22px/1 'Big Shoulders Display',sans-serif;text-transform:uppercase}
.screen[data-skin="lastra"] .card.acc{color:var(--acc)}
.screen[data-skin="lastra"] .pill{background:none;border-radius:0;border-top:1px solid #333;font:700 20px 'Big Shoulders Display',sans-serif;text-transform:uppercase;color:#8b8c90}
.screen[data-skin="lastra"] .pill.acc,.screen[data-skin="lastra"] .pill.warn{background:none;color:var(--acc)}
.screen[data-skin="lastra"] .bubble{background:none;border-radius:0;border-left:2px solid #333;padding:4px 10px}
.screen[data-skin="lastra"] .bubble.me{background:none;color:#ecebe8;border-left-color:var(--acc)}
/* Inchiostro */
.screen[data-skin="inchiostro"] .big{font:italic 400 70px/1 'Instrument Serif',Georgia,serif;letter-spacing:-1px}
.screen[data-skin="inchiostro"] .mid{font:italic 400 32px/1.05 'Instrument Serif',Georgia,serif}
.screen[data-skin="inchiostro"] .mid::after{content:"";display:block;width:40px;height:2px;background:var(--acc);margin-top:8px}
.screen[data-skin="inchiostro"] .center .mid::after{margin-inline:auto}
.screen[data-skin="inchiostro"] .card,.screen[data-skin="inchiostro"] .card.acc,.screen[data-skin="inchiostro"] .card.alt{background:none;color:#ecebe8;border-radius:0;padding:6px 0;font:400 24px/1.1 'Instrument Serif',Georgia,serif}
.screen[data-skin="inchiostro"] .card.acc{border-bottom:2px solid var(--acc)}
.screen[data-skin="inchiostro"] .pill{background:none;border-radius:0;font:italic 400 22px 'Instrument Serif',Georgia,serif;color:#8b8c90}
.screen[data-skin="inchiostro"] .pill.acc,.screen[data-skin="inchiostro"] .pill.warn{background:none;color:#ecebe8;border-bottom:2px solid var(--acc)}
.screen[data-skin="inchiostro"] .bubble{background:none;font:400 20px/1.2 'Instrument Serif',Georgia,serif;padding:2px 0}
.screen[data-skin="inchiostro"] .bubble.me{background:none;color:var(--acc);font-style:italic}
/* Margine */
.screen[data-skin="margine"] .st{justify-content:flex-end;gap:14px}
.screen[data-skin="margine"] .big{font:200 64px/1 'Manrope',sans-serif;letter-spacing:-3px}
.screen[data-skin="margine"] .mid{font:300 28px/1.1 'Manrope',sans-serif;letter-spacing:-1px}
.screen[data-skin="margine"] .dim{font-family:'Manrope',sans-serif;font-weight:300}
.screen[data-skin="margine"] .card,.screen[data-skin="margine"] .card.acc,.screen[data-skin="margine"] .card.alt{background:none;color:#ecebe8;border-radius:0;padding:8px 0;font:300 20px 'Manrope',sans-serif}
.screen[data-skin="margine"] .card.acc::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--acc);margin-right:10px;vertical-align:2px}
.screen[data-skin="margine"] .pill{background:none;border:1px solid #2a2b2e;border-radius:999px;font:300 15px 'Manrope',sans-serif;color:#9a9a9e}
.screen[data-skin="margine"] .pill.acc,.screen[data-skin="margine"] .pill.warn{background:none;border-color:var(--acc);color:var(--acc)}
.screen[data-skin="margine"] .bubble{background:#141516;border-radius:18px;font:300 15px 'Manrope',sans-serif}
.screen[data-skin="margine"] .bubble.me{background:none;border:1px solid var(--acc);color:#ecebe8}
/* Angolo */
.screen[data-skin="angolo"] .st{justify-content:flex-end;gap:14px}
.screen[data-skin="angolo"] .center{align-items:flex-end!important;text-align:right}
.screen[data-skin="angolo"] .big{font:300 76px/.85 'Big Shoulders Display',sans-serif;text-align:right}
.screen[data-skin="angolo"] .mid{font:300 34px/.95 'Big Shoulders Display',sans-serif;text-transform:uppercase;text-align:right}
.screen[data-skin="angolo"] .dim{text-align:right}
.screen[data-skin="angolo"] .card,.screen[data-skin="angolo"] .card.acc,.screen[data-skin="angolo"] .card.alt{background:none;color:#ecebe8;border:1px solid #2a2b2e;border-radius:20px;text-align:right}
.screen[data-skin="angolo"] .card.acc{border-color:var(--acc)}
.screen[data-skin="angolo"] .pill{background:none;border:1px solid #2a2b2e;border-radius:20px;font:300 22px 'Big Shoulders Display',sans-serif;text-transform:uppercase;color:#9a9a9e}
.screen[data-skin="angolo"] .pill.acc,.screen[data-skin="angolo"] .pill.warn{background:none;border-color:var(--acc);color:var(--acc)}
.screen[data-skin="angolo"] .bubble{border-radius:18px 18px 4px 18px;align-self:flex-end}
.screen[data-skin="angolo"] .bubble.me{background:none;border:1px solid var(--acc);color:#ecebe8}
/* Sottolineato */
.screen[data-skin="sottolineato"] .big{font:800 64px/.9 'Big Shoulders Display',sans-serif;text-transform:uppercase}
.screen[data-skin="sottolineato"] .mid{font:800 32px/.95 'Big Shoulders Display',sans-serif;text-transform:uppercase}
.screen[data-skin="sottolineato"] .mid::after{content:"";display:block;width:58%;height:5px;background:var(--acc);margin-top:10px}
.screen[data-skin="sottolineato"] .center .mid::after{margin-inline:auto}
.screen[data-skin="sottolineato"] .card,.screen[data-skin="sottolineato"] .card.acc,.screen[data-skin="sottolineato"] .card.alt{background:none;color:#ecebe8;border-radius:0;padding:6px 0;font:700 22px/1.1 'Big Shoulders Display',sans-serif;text-transform:uppercase}
.screen[data-skin="sottolineato"] .card.acc,.screen[data-skin="sottolineato"] .pill.acc{text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:4px;text-underline-offset:7px}
.screen[data-skin="sottolineato"] .pill{background:none;border-radius:0;font:700 20px 'Big Shoulders Display',sans-serif;text-transform:uppercase;color:#8b8c90}
.screen[data-skin="sottolineato"] .pill.acc,.screen[data-skin="sottolineato"] .pill.warn{background:none;color:#ecebe8}
.screen[data-skin="sottolineato"] .bubble{background:none;border-radius:0;padding:2px 0}
.screen[data-skin="sottolineato"] .bubble.me{background:none;color:#ecebe8;text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:3px;text-underline-offset:5px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* site header */
.sitetop{border-bottom:1px solid var(--line);background:var(--bg)}
.sitetop .in{max-width:1120px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.sitetop .logo{font:800 30px 'Big Shoulders Display','Arial Narrow',sans-serif;text-transform:uppercase;text-decoration:none;color:var(--ink);margin-right:auto;letter-spacing:1px}
.sitetop nav{display:flex;gap:18px}
.sitetop nav a{color:var(--muted);text-decoration:none;font:600 15px var(--body)}
.sitetop nav a[aria-current="page"]{color:var(--ink);box-shadow:0 2px 0 var(--acc-2)}
.sitetop .cta{background:#E4572E;color:#fff;text-decoration:none;font:700 14px var(--body);border-radius:999px;padding:10px 18px}
@media (max-width:640px){.sitetop nav{order:3;width:100%;justify-content:space-between}}
/* Cellulare: Tomo fisso in alto, situazioni che scorrono sotto */
@media (max-width:820px){
.stage{position:-webkit-sticky;position:sticky;top:0;z-index:5;background:var(--bg);margin-inline:-20px;padding:18px 20px 10px;gap:6px;border-bottom:1px solid var(--line);box-shadow:0 10px 20px -14px rgba(0,0,0,.35)}
.devrow{width:auto}
.devrow{zoom:.62}
@media (min-height:760px){.devrow{zoom:.7}}
.device{width:300px}
.caption,.skin-label,.skins,.dots{display:none}
.hint{font-size:13px;min-height:18px}
.ctrl .mini{padding:5px 12px;font-size:13px}
}