/* NiaSave Apple Store system — light canvas. Presentation only. */
:root{
  --nia-ground-dark:#1d1d1f;
  --nia-ground-light:#f5f5f7;
  --nia-ink:#1d1d1f;
  --nia-ink-on-dark:#FFFFFF;
  --nia-muted:#6e6e73;
  --nia-muted-on-dark:#A6A6AD;
  --nia-accent:#0066cc;
  --nia-accent-text:#FFFFFF;
  --nia-keep:#1B7A4A;
  --nia-radius:18px;
  --nia-gutter:20px;
  --nia-space-block:48px;
  --nia-type-display:42px;
  --nia-type-section:30px;
  --nia-type-card:21px;
  --nia-type-body:17px;
  --nia-type-support:14px;
  --nia-type-eyebrow:12px;
  --nia-touch:52px;
}
.nia-eyebrow{font-size:var(--nia-type-eyebrow);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--nia-muted)}
.nia-display{font-size:var(--nia-type-display);font-weight:600;letter-spacing:-.02em;line-height:1.05;margin:0}
.nia-section{font-size:var(--nia-type-section);font-weight:600;letter-spacing:-.02em;line-height:1.1;margin:0}
.nia-card-title{font-size:var(--nia-type-card);font-weight:600;line-height:1.2;margin:0}
.nia-body{font-size:var(--nia-type-body);font-weight:400;line-height:1.5}
.nia-support{font-size:var(--nia-type-support);color:var(--nia-muted);line-height:1.45}
.nia-keep{color:var(--nia-keep);font-weight:700}
.nia-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:var(--nia-touch);padding:0 22px;border-radius:999px;border:0;
  font-size:var(--nia-type-body);font-weight:600;text-decoration:none
}
.nia-btn-primary{background:var(--nia-accent);color:var(--nia-accent-text)}
.nia-btn-secondary{background:transparent;color:var(--nia-accent);box-shadow:inset 0 0 0 1.5px var(--nia-accent)}
.nia-btn:active{transform:scale(.98)}
.nia-skel{display:grid;gap:12px}
.nia-skel-line,.nia-skel-card{
  background:linear-gradient(90deg,#eceae6 0%,#f7f5f1 50%,#eceae6 100%);
  background-size:200% 100%;animation:nia-skel 1.2s ease-in-out infinite;
  border-radius:12px
}
.nia-skel-line{height:14px}
.nia-skel-card{min-height:120px;border-radius:var(--nia-radius)}
.nia-state{padding:24px var(--nia-gutter);font-size:var(--nia-type-body);line-height:1.5}
.nia-state-stale{opacity:.7}
.nia-help{
  display:none!important;
  position:fixed;right:max(16px,env(safe-area-inset-right));
  bottom:calc(84px + env(safe-area-inset-bottom));
  z-index:30;min-height:var(--nia-touch);padding:0 16px;
  border:0;border-radius:999px;background:var(--nia-accent);color:#fff;
  font-size:15px;font-weight:600;box-shadow:0 8px 24px rgba(0,102,204,.25)
}
@keyframes nia-skel{0%{background-position:100% 0}100%{background-position:-100% 0}}
@keyframes nia-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.nia-rise{animation:nia-rise .35s ease-out both}
@media (prefers-reduced-motion:reduce){
  .nia-skel-line,.nia-skel-card,.nia-rise,.nia-btn:active{animation:none;transform:none}
}
@media (min-width:761px){
  :root{--nia-type-display:52px;--nia-space-block:80px;--nia-gutter:24px}
  .nia-help{bottom:24px}
}
/* Phase 2–4 redesign: recovery, money, pack gate, a11y, responsive. Tokens unchanged. */
.nia-help:focus-visible,.header .signin:focus-visible,.mobile-nav button:focus-visible,
.primary:focus-visible,button.add:focus-visible,dialog button:focus-visible{
  outline:3px solid var(--nia-accent);outline-offset:2px
}
[data-state="loading"],[data-state="network"],[data-state="expired"],[data-state="empty"]{
  background:var(--nia-ground-light);color:var(--nia-ink);border-radius:var(--nia-radius);padding:24px var(--nia-gutter)
}
[data-state] h2{font-size:var(--nia-type-section);margin:0 0 8px}
[data-state] p{font-size:var(--nia-type-body);color:var(--nia-muted);margin:0 0 16px}
.pack-blocked{color:var(--nia-muted);font-size:var(--nia-type-support);margin:8px 0 0}
.nia-transfer-status{margin:8px 0 12px}
.store-send .badge,.books-transfer .badge,.nia-transfer-status .badge{background:#E8E8ED;color:var(--nia-ink);font-size:var(--nia-type-support);padding:4px 10px;border-radius:999px;font-weight:600}
button.add:disabled,button.primary:disabled{opacity:.45}
@media (max-width:320px){
  :root{--nia-gutter:12px;--nia-type-display:32px;--nia-type-section:24px}
  .nia-help{right:8px;padding:0 12px}
}
@media (min-width:768px){
  .header{min-height:48px}
}
@media (min-width:1280px){
  :root{--nia-gutter:32px;--nia-space-block:80px}
}
@media (prefers-contrast:more){
  :root{--nia-ink:#000;--nia-accent:#003D82}
}
