/* Operational UI, shared geometry; authentication and money remain in app.js.
   Brand character comes from existing welcome artwork and the theme tokens. */
html[data-theme] {
  --wallet-card-art:url('./assets/card-art-v2.png');
  --p-gutter:20px;
  --p-font:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ui-muted:var(--dim);
}
html[data-brand="smile"][data-theme="light"] { --dim:#5a6057; --mute:#646b5e; --positive:#087950; }
html[data-theme] .app :is(.api-note,.brand-auth-environment,.environment-note,[data-act="fill-test"]) { display:none !important; }
html[data-theme] .app .customer-brand { margin:0; min-height:32px; flex-shrink:0; }
html[data-theme] .app .customer-brand__mark { width:30px; height:30px; }
html[data-theme] .app .customer-brand__name { font-size:18px; }
html[data-theme] .app .brand-heading { min-height:32px; margin:0 0 14px; }

/* Registration reads as a process, not a stack of anonymous green panels. */
html[data-theme] .app .lock.register-lock {
  padding:max(22px,env(safe-area-inset-top)) var(--p-gutter) max(20px,env(safe-area-inset-bottom));
  justify-content:flex-start; gap:0;
}
html[data-theme] .app .reg-brand-header { display:flex; align-items:center; min-height:40px; padding-bottom:18px; border-bottom:1px solid var(--hair); }
html[data-theme] .app .reg-brand-header .customer-brand { margin:0; min-height:30px; }
html[data-theme] .app .reg-stage-caption { display:flex; justify-content:space-between; gap:12px; margin-top:22px; color:var(--dim); font:500 12px/1.5 var(--p-font); }
html[data-theme] .app .reg-stage-caption span:last-child { font-variant-numeric:tabular-nums; color:var(--ink); }
html[data-theme] .app .reg-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:0; margin:12px 0 28px; list-style:none; }
html[data-theme] .app .reg-steps li { color:var(--dim); font:400 11px/1.4 var(--p-font); overflow-wrap:anywhere; }
html[data-theme] .app .reg-steps li span { display:block; height:3px; border-radius:4px; background:var(--surface-2); margin-bottom:9px; }
html[data-theme] .app .reg-steps li.done span { background:var(--accent); opacity:.5; }
html[data-theme] .app .reg-steps li.current { color:var(--ink); font-weight:600; }
html[data-theme] .app .reg-steps li.current span { background:var(--accent); }
html[data-theme] .app .register-lock h2 { margin:0; font-size:28px; line-height:1.14; letter-spacing:-.8px; font-weight:650; max-width:330px; }
html[data-theme] .app .register-lock h2 + p { max-width:340px; margin:12px 0 0; font-size:15px; line-height:1.5; color:var(--dim); }
html[data-theme] .app .register-lock .auth-form { margin-top:26px; gap:12px; }
html[data-theme] .app .register-lock .verify-pick {
  display:grid; grid-template-columns:40px minmax(0,1fr) 18px; align-items:center;
  gap:13px; min-height:94px; padding:18px 16px; border-radius:16px;
  border:1px solid var(--hair); background:var(--surface); color:var(--ink);
  box-shadow:none; text-align:left;
}
html[data-theme] .app .register-lock .vp-ico {
  width:40px; height:40px; border-radius:12px; background:var(--surface-2);
  color:var(--accent-deep); display:grid; place-items:center; font-size:21px;
}
html[data-theme] .app .register-lock .vp-text { display:flex; flex-direction:column; gap:5px; min-width:0; }
html[data-theme] .app .register-lock .vp-text b { font-size:16px; font-weight:600; line-height:1.35; letter-spacing:-.2px; }
html[data-theme] .app .register-lock .vp-text small { margin:0; font-size:13px; line-height:1.4; color:var(--dim); }
html[data-theme] .app .register-lock .vp-go { color:var(--dim); font-size:18px; }
html[data-theme] .app .reg-footer { margin-top:30px; padding-top:16px; border-top:1px solid var(--hair); display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 12px; }
html[data-theme] .app .reg-footer button {
  background:transparent; border:0; padding:10px 0; min-height:44px; color:var(--dim);
  font:500 13px/1.45 var(--p-font); text-align:left; cursor:pointer;
}
html[data-theme] .app .reg-footer button:first-child { color:var(--ink); }

/* Input labels persist when filled; 16px input type avoids iOS auto-zoom. */
html[data-theme] .app .lock .customer-brand { margin:14px 0 26px; }
html[data-theme] .app .lock.register-lock .reg-brand-header .customer-brand { margin:0; }
html[data-theme] .app .lock .customer-back { align-self:flex-start; width:auto; border:0; background:none; padding:0; min-height:44px; font-size:14px; font-weight:500; color:var(--dim); cursor:pointer; }
html[data-theme] .app .lock:not(.register-lock) h2 { margin-top:12px; font-size:30px; line-height:1.15; font-weight:600; letter-spacing:-1px; }
html[data-theme] .app .lock h2:focus { outline:none; }
html[data-theme] .app .lock:not(.register-lock) h2 + p { max-width:320px; font-size:15px; line-height:1.6; }
html[data-theme] .app .lock:not(.register-lock) .auth-form { margin-top:30px; gap:14px; }
html[data-theme] .app .lock .field { min-height:60px; }
html[data-theme] .app .lock .field.stacked { padding:12px 15px; gap:5px; border-radius:12px; }
html[data-theme] .app .lock .field.stacked label { font-size:12px; font-weight:500; color:var(--dim); line-height:1.4; }
html[data-theme] .app .lock .field input { font-size:16px; min-height:24px; }
html[data-theme] .app .lock .field input::placeholder { opacity:1; color:var(--mute); }
html[data-theme] .app .lock .btn.primary { min-height:52px; margin-top:6px; border-radius:12px; font-size:15px; }
html[data-theme] .app .register-lock .date-row { gap:8px; grid-template-columns:.85fr 1.2fr 1fr; }
html[data-theme] .app .register-lock .date-row select { min-height:40px; font-size:16px; }
html[data-theme] .app .register-lock .agree-row { font-size:12px; line-height:1.55; }
html[data-theme] .app .auth-err { overflow-wrap:anywhere; }

/* The home has one primary action row. Financial data is never restated as
   a selected-source balance: the actual source is explicitly separate. */
html[data-theme] .app [data-screen="home"] .canvas { padding-top:max(18px,env(safe-area-inset-top)); padding-bottom:14px; }
html[data-theme] .app [data-screen="home"] .id-row { min-height:36px; gap:10px; }
html[data-theme] .app [data-screen="home"] .ava { width:32px; height:32px; font-size:11px; }
html[data-theme] .app [data-screen="home"] .id-row .greet { display:none; }
html[data-theme] .app [data-screen="home"] .id-row .who { margin:0; font-size:13px; font-weight:500; color:var(--dim); overflow-wrap:anywhere; }
html[data-theme] .app [data-screen="home"] .id-row .ghost-btn { width:44px; height:44px; flex-shrink:0; font-size:18px; }
html[data-theme] .app [data-screen="home"] .balance-block { margin-top:14px; padding:18px; border-radius:18px; min-width:0; }
html[data-theme] .app [data-screen="home"] .balance-block .cap { font-size:12px; line-height:1.45; gap:8px; flex-wrap:wrap; color:#e0e8e4; }
html[data-theme] .app [data-screen="home"] .tier { font-size:10px; line-height:1.4; font-weight:500; letter-spacing:0; padding:4px 7px; color:#f5f4e8; border-color:#ffffff35; }
html[data-theme] .app [data-screen="home"] .balance { margin-top:12px; font-size:clamp(27px,8vw,36px); line-height:1.12; font-weight:650; letter-spacing:-1px; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
html[data-theme] .app [data-screen="home"] .balance-block .delta { font-size:11px; line-height:1.5; margin-top:9px; color:#d2dfd8; font-weight:400; }
html[data-brand="amal"] .app [data-screen="home"] .balance-block { background:linear-gradient(115deg,#153f30,#06271c); border-color:#68816b; }
html[data-brand="smile"] .app [data-screen="home"] .balance-block { background:#171b14; border-color:#353c2b; }
html[data-brand="smile"] .app [data-screen="home"] .balance-block::after { content:""; position:absolute; top:18px; right:0; width:3px; height:44px; border-radius:3px 0 0 3px; background:#ffd300; }
html[data-theme] .app [data-screen="home"] .pills { gap:8px; margin-top:18px; }
html[data-theme] .app [data-screen="home"] .pill { gap:8px; min-height:68px; background:none; border:0; color:var(--ink); }
html[data-theme] .app [data-screen="home"] .pill .gl { width:38px; height:38px; border-radius:0; border:0; background:none; box-shadow:none; color:var(--ink); display:grid; place-items:center; font-size:22px; }
html[data-theme] .app [data-screen="home"] .pill span:not(.gl) { font-size:11px; line-height:1.3; font-weight:500; }
html[data-theme] .app [data-screen="home"] .scroll { padding-top:12px; }
html[data-theme] .app [data-screen="home"] section { margin-top:26px; }
html[data-theme] .app [data-screen="home"] section:first-child { margin-top:0; }
html[data-theme] .app [data-screen="home"] .cap-row .h { font-size:16px; line-height:1.4; font-weight:600; letter-spacing:-.3px; }
html[data-theme] .app [data-screen="home"] .cap-row .r { font-size:12px; }
html[data-theme] .app .home-source-note { margin-top:10px; display:flex; flex-direction:column; gap:2px; font-size:11px; line-height:1.45; color:var(--dim); }
html[data-theme] .app .home-source-note button { display:flex; align-items:center; gap:6px; width:fit-content; max-width:100%; min-height:36px; background:none; border:0; padding:3px 0; color:var(--ink); text-align:left; font:500 12px/1.5 var(--p-font); cursor:pointer; overflow-wrap:anywhere; }
html[data-theme] .app .home-source-note button svg { flex-shrink:0; width:14px; height:14px; }
html[data-theme] .app .home-utilities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:12px; }
html[data-theme] .app .home-utility { display:flex; align-items:center; gap:10px; min-height:66px; padding:12px; border:1px solid var(--hair); border-radius:14px; background:var(--surface); color:var(--ink); font:500 12px/1.45 var(--p-font); text-align:left; cursor:pointer; }
html[data-theme] .app .home-utility .g { flex-shrink:0; display:grid; place-items:center; width:24px; height:28px; color:var(--accent-deep); font-size:22px; }
html[data-theme] .app :is(.home-all,.amal-home-all) { font-size:12px; min-height:36px; padding:4px 0 4px 12px; color:var(--dim); }
html[data-theme] .app [data-screen="home"] .rail-x { margin-top:12px; }
html[data-theme] .app [data-screen="home"] .rail-x > .prod { flex-basis:calc(100% - 20px); aspect-ratio:1.586; min-height:180px; }
html[data-theme] .app [data-screen="home"] .hub-ico { color:var(--ink); background:none; border:0; box-shadow:none; }
html[data-theme] .app [data-screen="home"] .prod.add { font-family:var(--p-font); color:var(--ink); border:1px dashed var(--hair); background:var(--surface); cursor:pointer; }
html[data-theme] .app [data-screen="home"] .prod.add span { font-size:12px; }
html[data-theme] .app :is(.op,.row) { min-height:62px; }
html[data-theme] .app .op { gap:10px; }
html[data-theme] .app .op .t { font-size:14px; line-height:1.4; font-weight:500; overflow-wrap:anywhere; }
html[data-theme] .app .op .s { font-size:12px; line-height:1.45; color:var(--dim); margin-top:3px; }
html[data-theme] .app .op .v { font-size:14px; line-height:1.4; font-weight:600; font-variant-numeric:tabular-nums; }
html[data-theme] .app [data-screen="home"] .op .s { font-size:12px; }
html[data-theme] .app .sum-strip b { font-variant-numeric:tabular-nums; }
html[data-theme] .app .hub-card { min-height:96px; }
html[data-theme] .app .hub-t { font-size:13px; line-height:1.4; }
html[data-theme] .app .hub-s { font-size:11px; line-height:1.5; color:var(--dim); }
html[data-theme] .app .dock button { font-size:10px; min-height:48px; }

/* Keyboard focus must be visible in both the ivory and dark themes. */
html[data-theme] .app :is(button,[tabindex]):focus-visible { outline:2px solid var(--accent-deep); outline-offset:3px; }
html[data-brand="smile"][data-theme="light"] .app :is(button,input,select):focus-visible { outline-color:#716000; }
html[data-theme] .app .customer-services { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; min-height:48px; padding:13px 16px; margin:12px 0; border:1px solid var(--hair); border-radius:13px; background:var(--surface); color:var(--ink); font:500 14px/1.35 var(--p-font); text-align:left; cursor:pointer; }
html[data-theme] .app .customer-services--login { justify-content:center; margin-top:20px; border-color:transparent; background:none; font-size:13px; }
@media(max-width:350px) {
  html[data-theme] { --p-gutter:16px; }
  html[data-theme] .app .register-lock h2 { font-size:26px; }
  html[data-theme] .app .register-lock .verify-pick { padding:15px 12px; gap:10px; }
  html[data-theme] .app .register-lock .vp-text b { font-size:15px; }
  html[data-theme] .app .home-utility { padding:10px; gap:7px; font-size:11px; }
}

/* Final review: quieter native type, single-level actions, real card details. */
html[data-theme] .app { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-weight:400; font-synthesis:none; }
html[data-theme] .app :is(h1,h2,h3,.ttl,.c-title,.cap-row .h,.modal h3) { font-family:var(--p-font); font-weight:600; letter-spacing:-.025em; }
html[data-theme] .app :is(.sub,.c-sub,.empty,.doc-note,.meta,.s,.k,.v,.plastic-label,.plastic-net,.tier-lim,.agree-row) { font-family:var(--p-font); font-weight:400; letter-spacing:normal; }
html[data-theme] .app :is(.btn,.mini,.t,.prod .kind,.prod .val,.sum-strip b,.banner .t,.row-select .t,.contact .t) { font-weight:500; letter-spacing:normal; }
html[data-theme] .app .modal h3 { font-size:23px; line-height:1.3; }
html[data-theme] .app .modal .sub { font-size:14px; line-height:1.55; color:var(--dim); }
html[data-theme] .app .empty { font-size:14px; line-height:1.6; color:var(--dim); }
html[data-theme] .app .ic-svg { stroke-width:1.6; }
html[data-theme] .app .grid4 { gap:8px; }
html[data-theme] .app .grid4 .cell { border:0; border-radius:0; background:none; box-shadow:none; padding:10px 2px; min-height:76px; color:var(--ink); font:inherit; cursor:pointer; }
html[data-theme] .app .grid4 .cell .g { display:grid; place-items:center; width:28px; height:28px; margin:0 auto 9px; padding:0; border:0; border-radius:0; background:none; box-shadow:none; color:var(--ink); font-size:23px; }
html[data-theme] .app .grid4 .cell span:not(.g) { font-size:12px; line-height:1.4; font-weight:400; color:var(--ink); }
html[data-theme] .app .row .g { background:none; border:0; border-radius:0; color:var(--dim); }
html[data-theme] .app .dock button .gl { font-size:22px; }
html[data-theme] .app .dock button[data-arg="scanner"],
html[data-theme] .app .dock button[data-arg="scanner"]:active { width:auto; height:auto; min-height:48px; transform:none; padding:7px 2px 4px; border:0; border-radius:0; background:none; color:var(--dim); gap:5px; justify-self:stretch; }
html[data-theme] .app .dock button[data-arg="scanner"].on { color:var(--ink); }
html[data-theme] .app [data-screen="home"] .balance-block::after { display:none; }
html[data-theme] .app .prod.plastic { min-height:180px; aspect-ratio:1.586; padding:20px; border-radius:18px; border:1px solid #ffffff29; background:#11251f; color:#f5f4e9; box-shadow:none; }
html[data-brand="ritm"] .app .prod.plastic { background:#1c213c; }
html[data-brand="smile"] .app .prod.plastic { background:#21231d; }
html[data-theme] .app .prod.plastic { background-image:linear-gradient(100deg,#00000012,#00000088),var(--wallet-card-art,none); background-size:cover; background-position:center; }
html[data-theme] .app .prod.plastic::before,html[data-theme] .app .prod.plastic::after { display:none; }
html[data-theme] .app .plastic-top { align-items:center; gap:10px; }
html[data-theme] .app .plastic-identity { min-width:0; }
html[data-theme] .app .plastic-identity .customer-brand { color:#f3f1e6; min-height:26px; gap:7px; }
html[data-theme] .app .plastic-identity .customer-brand__mark { width:25px; height:25px; }
html[data-theme] .app .plastic-identity .customer-brand__name { font-size:15px; letter-spacing:-.02em; }
html[data-theme] .app .plastic-identity .customer-brand__name span { color:inherit; opacity:.8; }
html[data-theme] .app .plastic-net { padding:0; border:0; border-radius:0; background:none; color:#dedfd5; font-size:10px; font-weight:500; letter-spacing:.03em; flex-shrink:0; }
html[data-theme] .app .prod.plastic .card-balance-label { font-size:11px; line-height:1.4; color:#b9c7bf; margin-top:20px; }
html[data-theme] .app .prod.plastic .val { padding:0; margin-top:4px; font-size:27px; font-weight:500; letter-spacing:-.03em; line-height:1.2; color:#f6f5ef; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
html[data-theme] .app .prod.plastic .val small { font-size:18px; font-weight:400; color:inherit; }
html[data-theme] .app .plastic-bot { align-items:flex-end; margin-top:auto; padding-top:18px; gap:8px; }
html[data-theme] .app .plastic-bot :is(.meta,.plastic-label) { margin:0; color:#c6d1c9; font-size:11px; font-weight:400; line-height:1.4; letter-spacing:0; }
/* Card-surface contract outranks legacy balance/USDT/APRA network skins in
   styles.css, in both themes. Never inherit a light-surface green/black label. */
html[data-theme] .app .prod.plastic[class*="brand-"] :is(.plastic-net,.plastic-label,.plastic-mark,.meta,.customer-brand,.customer-brand__name,.customer-brand__mark) { color:#f5f2e8; opacity:1; text-shadow:none; }
html[data-theme] .app .prod.plastic[class*="brand-"] .plastic-net { font-style:normal; letter-spacing:.03em; }
html[data-theme] .app .prod.plastic .plastic-identity .customer-brand__name span { color:inherit; opacity:1; }
html[data-theme] .app .card-detail { width:100%; margin:0; }
html[data-theme] .app .card-detail > .prod { width:100%; max-height:none; }
html[data-theme] .app .card-details-toggle { display:flex; align-items:center; gap:10px; width:100%; min-height:52px; padding:12px 2px; border:0; border-bottom:1px solid var(--hair); border-radius:0; background:none; color:var(--ink); font:400 14px/1.5 var(--p-font); text-align:left; cursor:pointer; }
html[data-theme] .app .card-details-toggle svg { width:21px; height:21px; flex-shrink:0; }
html[data-theme] .app .card-details-toggle svg:last-child { margin-left:auto; width:16px; transform:rotate(90deg); }
html[data-theme] .app .card-details-toggle[aria-expanded="true"] svg:last-child { transform:rotate(-90deg); }
html[data-theme] .app .card-details-toggle:disabled { opacity:.65; cursor:wait; }
html[data-theme] .app .card-details-panel { padding:18px 0; border-bottom:1px solid var(--hair); }
html[data-theme] .app .card-details-panel .plastic-reqs { overflow:visible; max-height:none; padding:0; gap:20px; }
html[data-theme] .app .card-details-panel .plastic-req { gap:5px; }
html[data-theme] .app .card-details-panel .plastic-req.row2 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
html[data-theme] .app .card-details-panel .plastic-req.row2>div { display:grid; gap:5px; }
html[data-theme] .app .card-details-panel :is(.plastic-req,.plastic-billing) .k { color:var(--dim); font-size:12px; line-height:1.45; text-transform:none; font-weight:400; letter-spacing:0; }
html[data-theme] .app .card-details-panel :is(.plastic-req,.plastic-billing) .v { color:var(--ink); font:400 15px/1.5 var(--p-font); letter-spacing:0; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
html[data-theme] .app .card-details-panel .plastic-billing { display:grid; gap:5px; }

/* Product offers are horizontal comparisons, never coloured square swatches. */
html[data-theme] .app [data-screen="cards"] .issue-grid { display:flex; flex-direction:column; gap:0; margin-top:12px; }
html[data-theme] .app [data-screen="cards"] .issue-card {
  display:grid; grid-template-columns:104px minmax(0,1fr) 16px; align-items:center; gap:16px;
  padding:20px 0; border:0; border-bottom:1px solid var(--hair); border-radius:0;
  background:none; color:var(--ink); box-shadow:none; min-width:0;
}
html[data-theme] .app .issue-preview { display:flex; flex-direction:column; justify-content:space-between; position:relative; width:104px; aspect-ratio:1.586; padding:9px; border-radius:8px; border:1px solid #ffffff29; background:#14352a; color:#f3f1e6; text-align:left; overflow:hidden; }
html[data-brand="ritm"] .app .issue-preview { background:#242946; }
html[data-brand="smile"] .app .issue-preview { background:#282b22; border-color:#565a47; }
html[data-theme] .app .issue-preview { background-image:linear-gradient(100deg,#00000042,#0000000a),var(--wallet-card-art,none); background-size:cover; background-position:center; }
html[data-theme] .app .issue-preview-name { font:500 8px/1.25 var(--p-font); white-space:nowrap; }
html[data-theme] .app .issue-preview-symbol { position:absolute; right:9px; top:25px; color:#ffffff42; }
html[data-theme] .app .issue-preview-symbol svg { width:26px; height:26px; }
html[data-theme] .app .issue-preview-network { font:500 10px/1.2 var(--p-font); }
html[data-theme] .app .issue-description { display:flex; flex-direction:column; gap:4px; min-width:0; text-align:left; }
html[data-theme] .app [data-screen="cards"] .issue-card .t { color:var(--ink); font-size:16px; line-height:1.4; font-weight:500; }
html[data-theme] .app [data-screen="cards"] .issue-card .s { color:var(--dim); font-size:12px; line-height:1.5; font-weight:400; }
html[data-theme] .app [data-screen="cards"] .issue-card .price { color:var(--ink); font-size:12px; line-height:1.5; font-weight:500; margin:4px 0 0; }
html[data-theme] .app .issue-card .price>span { color:var(--dim); font-weight:400; }
html[data-theme] .app .issue-arrow { color:var(--dim); }
html[data-theme] .app .issue-arrow svg { width:16px; height:16px; }
@media(max-width:350px) {
  html[data-theme] .app [data-screen="cards"] .issue-card { grid-template-columns:88px minmax(0,1fr) 14px; gap:12px; }
  html[data-theme] .app .issue-preview { width:88px; padding:8px; }
  html[data-theme] .app .prod.plastic { padding:17px; }
  html[data-theme] .app .plastic-identity .customer-brand__name { font-size:13px; }
  html[data-theme] .app .grid4 .cell span:not(.g) { font-size:11px; }
}

/* Compact action contract, also safe to append to Amal's customer.css. */
html[data-theme] .app [data-screen="home"] .rail-x > .prod.add {
  flex:0 0 auto; width:auto; min-width:0; min-height:44px; max-height:44px;
  aspect-ratio:auto; align-self:center; display:inline-flex; align-items:center;
  justify-content:center; gap:8px; padding:10px 14px; border-radius:999px;
  border:1px solid var(--hair); background:var(--surface); box-shadow:none;
  color:var(--ink); font:500 12px/1.4 var(--p-font); text-align:center;
}
html[data-theme] .app [data-screen="home"] .rail-x > .prod.add svg { width:18px; height:18px; flex-shrink:0; }
html[data-theme] .app [data-screen="home"] .rail-x > .prod.add span { font-size:12px; }
html[data-theme] .app .home-products-heading { gap:10px; min-height:44px; flex-wrap:wrap; }
html[data-theme] .app .home-products-title { display:flex; align-items:baseline; gap:8px; }
html[data-theme] .app .home-add-control {
  display:inline-flex; align-items:center; justify-content:center; gap:5px;
  min-height:44px; padding:8px 0 8px 10px; background:none; border:0; border-radius:10px;
  color:var(--ink); font:500 12px/1.4 var(--p-font); cursor:pointer;
}
html[data-theme] .app .home-add-control svg { width:17px; height:17px; }
html[data-theme] .app .brand-home-banner {
  position:relative; overflow:hidden; display:grid; width:100%; min-width:0; margin:18px 0 4px;
  border:0; text-align:left; font-family:var(--p-font); cursor:pointer;
  animation:brand-banner-enter 440ms cubic-bezier(.2,.7,.2,1) both;
}
html[data-theme] .app .brand-banner-kicker { display:block; font-size:10px; font-weight:500; line-height:1.4; letter-spacing:.07em; text-transform:uppercase; }
html[data-theme] .app .brand-banner-title { display:block; margin-top:7px; font-size:19px; font-weight:600; line-height:1.2; letter-spacing:-.035em; }
html[data-theme] .app .brand-banner-link { display:flex; align-items:center; gap:4px; margin-top:13px; font-size:12px; font-weight:500; line-height:1.45; }
html[data-theme] .app .brand-banner-link svg { width:14px; height:14px; }
@keyframes brand-banner-enter { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) { html[data-theme] .app .brand-home-banner { animation:none; } }

/* Smile: bright editorial balance, rounded gift-ticket banner, open service grid. */
html[data-theme] .app [data-screen="home"] .c-in > .delta[role="status"] { color:var(--dim); font:400 11px/1.5 var(--p-font); }
html[data-brand="smile"] .app .home-smile .balance-block {
  background:#fff3b6; border:0; border-radius:23px; color:#202216;
  padding:20px; box-shadow:none; isolation:isolate;
}
html[data-brand="smile"] .app .home-smile .balance-block .cap { position:relative; z-index:1; color:#4e503e; }
html[data-brand="smile"] .app .home-smile .balance-block .tier { color:#4e503e; background:#ffffff55; border-color:transparent; }
html[data-brand="smile"] .app .home-smile .balance-block .balance { position:relative; z-index:1; color:#202216; font-size:36px; font-weight:600; letter-spacing:-.04em; }
html[data-brand="smile"] .app .home-smile .balance-block .balance small { color:#424433; font-weight:400; }
html[data-brand="smile"] .app .home-smile .balance-block .delta { position:relative; z-index:1; color:#60614c; }
html[data-brand="smile"] .app .smile-balance-orbit { position:absolute; right:-38px; bottom:-42px; width:125px; height:125px; border:18px solid #ffe163; border-radius:50%; transform:rotate(-14deg); pointer-events:none; }
html[data-brand="smile"] .app .home-smile .pills .gl { background:none; border:0; color:var(--ink); }
html[data-brand="smile"] .app .home-smile .pill.key .gl { background:#ffe25e; border-radius:50%; color:#22251a; }
html[data-brand="smile"] .app .smile-home-banner {
  grid-template-columns:minmax(0,1fr) 62px; align-items:center; gap:8px;
  padding:19px 18px; min-height:144px; background:#ffdc42; color:#24261b; border-radius:22px 22px 22px 7px;
}
html[data-brand="smile"] .app .smile-banner-copy { position:relative; z-index:1; min-width:0; }
html[data-brand="smile"] .app .smile-banner-ticket { width:57px; height:78px; border-radius:11px; background:#292c22; transform:rotate(12deg); position:relative; box-shadow:-6px 6px 0 #fff1a2; }
html[data-brand="smile"] .app .smile-banner-ticket::before,html[data-brand="smile"] .app .smile-banner-ticket::after { content:""; position:absolute; top:47px; width:12px; height:12px; border-radius:50%; background:#ffdc42; }
html[data-brand="smile"] .app .smile-banner-ticket::before { left:-6px; }
html[data-brand="smile"] .app .smile-banner-ticket::after { right:-6px; }
html[data-brand="smile"] .app .smile-banner-ticket span { position:absolute; left:12px; right:12px; top:19px; height:16px; border:2px solid #ffe15b; border-top:0; border-radius:0 0 24px 24px; }
html[data-brand="smile"] .app .smile-banner-ticket i { position:absolute; left:11px; right:11px; bottom:14px; border-bottom:1px dashed #e0ddba; }
html[data-brand="smile"] .app .home-smile .home-utilities { gap:10px; }
html[data-brand="smile"] .app .home-smile .home-utility { background:var(--surface); border-color:transparent; border-radius:18px; }
html[data-brand="smile"] .app .home-smile .hub-rail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; gap:10px; margin:12px 0 0; padding:0; }
html[data-brand="smile"] .app .home-smile .hub-card { width:auto; min-width:0; min-height:104px; border:1px solid var(--hair); background:transparent; border-radius:18px; padding:14px; }
html[data-brand="smile"] .app .home-smile .hub-card:last-child { grid-column:1/-1; min-height:74px; }
html[data-brand="smile"] .app .home-smile .hub-ico { background:none; border:0; color:var(--ink); width:25px; height:25px; }
@media(max-width:350px) {
  html[data-brand="smile"] .app .home-smile .balance-block .balance { font-size:32px; }
  html[data-brand="smile"] .app .smile-home-banner { padding:17px 15px; grid-template-columns:minmax(0,1fr) 50px; }
  html[data-brand="smile"] .app .smile-home-banner .brand-banner-title { font-size:17px; }
  html[data-brand="smile"] .app .smile-banner-ticket { width:47px; height:69px; }
}