:root {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #f6fbff;
  background: #07111f;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 10% 10%, #173d65 0, transparent 35%), radial-gradient(circle at 90% 15%, #40205f 0, transparent 30%), #07111f; }
button { font: inherit; }
.shell { width: min(1080px, calc(100% - 32px)); margin: 0 auto; padding: 36px 0 60px; }
.hero { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; }
.brand, .eyebrow { letter-spacing:.14em; font-size:.76rem; font-weight:800; color:#8ae9ff; }
h1 { font-size:clamp(2.2rem, 6vw, 4.8rem); line-height:.98; max-width:800px; margin:.35rem 0 1rem; }
h2 { margin:.2rem 0; }
p { line-height:1.55; }
.card { background:rgba(10,26,45,.82); border:1px solid rgba(151,220,255,.22); border-radius:22px; padding:22px; box-shadow:0 18px 60px rgba(0,0,0,.22); backdrop-filter: blur(14px); }
.timeline { display:grid; grid-template-columns:repeat(9,1fr); gap:7px; margin:28px 0; }
.step { opacity:.35; text-align:center; font-size:.66rem; font-weight:800; letter-spacing:.04em; }
.step span { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; margin:0 auto 7px; background:#1c3148; }
.step.active { opacity:1; color:#a9f4ff; }
.step.active span { background:#147c95; color:white; box-shadow:0 0 20px rgba(30,210,255,.25); }
.conversation { display:grid; gap:12px; }
.bubble { max-width:820px; padding:14px 16px; border-radius:16px; display:grid; gap:5px; }
.bubble strong { font-size:.78rem; color:#8ae9ff; }
.user { margin-left:auto; background:#17365c; }
.assistant { background:#18283e; }
.section-title { display:flex; justify-content:space-between; align-items:end; margin:26px 0 10px; gap:12px; }
.section-title span { opacity:.72; font-size:.9rem; }
.offers { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.offer { padding:18px; border-radius:18px; background:rgba(12,30,50,.72); border:1px solid rgba(255,255,255,.09); display:grid; gap:8px; }
.offer.recommended { border-color:#52e4ff; box-shadow:inset 0 0 0 1px rgba(82,228,255,.16); }
.offer h3,.offer p { margin:0; }
.offer strong { font-size:1.55rem; }
.offer small { opacity:.72; }
.decision { margin-top:18px; }
.decision-head { display:flex; justify-content:space-between; align-items:center; }
.shield { font-size:2.5rem; }
dl { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:20px 0; }
dl div { padding:13px; border-radius:14px; background:#0a1b2c; }
dt { font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; opacity:.55; }
dd { margin:5px 0 0; font-weight:750; }
.verified { color:#a4f6dc; font-weight:650; }
.authorize-wrap { margin-top:22px; }
.hold { width:100%; min-height:64px; border:0; border-radius:16px; background:linear-gradient(90deg,#17aac4,#6576f7); color:white; font-weight:900; letter-spacing:.08em; cursor:pointer; }
.hold.holding { transform:scale(.995); }
.hold:focus-visible, button:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.progress-track { height:7px; border-radius:99px; background:#0a1522; margin-top:9px; overflow:hidden; }
.progress { height:100%; width:0; background:#8af2ff; transition:width .03s linear; }
.hint,.meta { font-size:.84rem; opacity:.7; margin:.5rem 0 0; }
.drift { margin-top:16px; display:flex; gap:16px; border-color:#ff9d88; }
.alert-icon { width:42px; height:42px; flex:0 0 42px; border-radius:50%; display:grid; place-items:center; font-weight:900; background:#652f31; color:#ffd0c7; }
.status { margin:16px 0; padding:12px 14px; border-radius:12px; background:#0d1d2e; }
.status.success { border:1px solid #43d0a4; }
.status.danger { border:1px solid #ff7a6c; }
.actions { display:flex; gap:10px; margin:16px 0; }
.actions button { padding:13px 18px; border:0; border-radius:12px; background:#61dcef; color:#07111f; font-weight:850; cursor:pointer; }
.actions button:disabled { opacity:.35; cursor:not-allowed; }
button.secondary { background:transparent; border:1px solid rgba(255,255,255,.28); color:white; padding:10px 14px; border-radius:12px; cursor:pointer; }
.receipt pre { overflow:auto; max-height:420px; padding:16px; border-radius:14px; background:#04101a; font-size:.78rem; }
footer { margin-top:24px; opacity:.58; font-size:.83rem; }
[hidden] { display:none !important; }
@media (max-width: 760px) {
  .timeline { grid-template-columns:repeat(3,1fr); }
  .offers, dl { grid-template-columns:1fr; }
  .hero { align-items:start; }
  .actions { flex-direction:column; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior:auto !important; transition:none !important; } }

.boundary { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.boundary span { border:1px solid rgba(138,233,255,.22); background:rgba(7,17,31,.45); border-radius:999px; padding:7px 10px; font-size:.78rem; }
.boundary b { color:#8ae9ff; }
.policy { margin:16px 0; padding:16px 18px; }
.policy summary { cursor:pointer; font-weight:800; color:#b7f4ff; }
.policy pre { white-space:pre-wrap; margin:12px 0 0; padding:12px; border-radius:12px; background:#04101a; font-size:.78rem; line-height:1.5; }

.consent-panel { margin-top:12px; border:1px solid #91f2ff; border-radius:14px; padding:14px; }
.consent-panel button { margin:5px 6px 5px 0; padding:12px; border:1px solid #8af2ff; border-radius:10px; background:#1d97ad; color:white; font-weight:700; }
#alternate-button { margin-top:14px; }
.decision details { margin-top:8px; }
.decision details summary { cursor:pointer; font-weight:650; }

.recommendation-controls { display:grid; gap:10px; margin:16px 0; }
.recommendation-controls label { font-weight:750; }
.recommendation-controls input { background:#071c2e; border:1px solid #648aa5; color:white; border-radius:10px; padding:12px; font:inherit; width:100%; }
.recommendation-controls button { border:0; border-radius:12px; padding:12px; background:#61dcef; color:#07111f; font-weight:850; cursor:pointer; }
.recommendation-controls button:disabled { opacity:.45; cursor:not-allowed; }
.source-mode { margin:0; font-weight:750; font-size:.82rem; color:#ffd1a6; }
.source-mode[data-mode='LIVE_AI'] { color:#a4f6dc; }
/* Oct 19 real-user feedback: clear and accessible path back to fresh consent. */
.drift-content { flex: 1; min-width: 0; }
.reauthorize-instructions { color:#e4f7ff; font-weight: 650; max-width: 60ch; }
button.reauthorize-action {
  display: inline-block;
  min-height: 48px;
  margin-top: 8px;
  padding: 12px 18px;
  border: 1px solid #8af2ff;
  border-radius: 12px;
  background: #61dcef;
  color: #07111f;
  font-weight: 850;
  cursor: pointer;
}
button.reauthorize-action:hover { background:#a5f4ff; }

/* Judge AFTER design — brand-color, compact, inclusive, single-card decision journey */
.shell{width:min(1040px,calc(100% - 26px));padding:20px 0 40px}
.hero{align-items:center;gap:18px}h1{font-size:clamp(1.7rem,4.2vw,3rem);line-height:1.08;max-width:830px;margin:.25rem 0 .45rem}
.hero .brand{font-size:.83rem;color:#56e4ff}.boundary{margin-top:10px}.boundary span{border-color:#45d8ed66;background:#0b2840ee}
.timeline{margin:16px 0}.timeline .step.active span{background:#129bb2}.recommendation-controls{padding:14px 18px;gap:8px}.recommendation-controls button{background:#ffae65}
.conversation{padding:13px 17px;gap:8px}.bubble{padding:10px 13px}.section-title{margin:15px 0 7px}.offer{padding:13px;gap:6px}.offers{gap:11px}
.decision{margin-top:14px;border-color:#4bdef2;background:linear-gradient(122deg,#0b2a41 0%,#11223b 58%,#1d2342 100%);box-shadow:0 0 0 1px #3ac8dd33,0 14px 42px #0008}
.decision-head .eyebrow{color:#ffaf62}.decision dl{margin:12px 0;gap:9px}.decision dl div{background:#0b2235;border:1px solid #57c7d333}.decision dt{opacity:.8}.decision dd{font-size:1.06rem}
#verification{color:#ffd38c;font-size:.86rem;font-weight:730;padding:9px 12px;background:#48371d66;border-radius:10px}
#drift-panel{margin:13px 0 12px;background:linear-gradient(130deg,#4a2b29,#482e35);border:1px solid #ffb568;border-radius:15px;padding:15px;display:flex;gap:14px;align-items:start}
#drift-panel[hidden]{display:none!important}#drift-panel h2{color:#ffe0a4}#drift-panel .alert-icon{background:#f1a953;color:#20212d}
#drift-panel p{margin:5px 0 9px}.drift-content{min-width:0;flex:1}#drift-panel button{margin:5px 8px 5px 0}
#drift-changes{margin:8px 0;padding-left:19px}#drift-changes li{font-size:.95rem;padding:4px 0;font-weight:750}#drift-changes del{color:#ffd1cf}#drift-changes ins{color:#b1ffde;background:#124c40;border-radius:7px;padding:3px 6px;text-decoration:none}
.authorize-wrap{margin-top:12px}.hold{background:linear-gradient(100deg,#00a6cb,#387de1);min-height:60px}.hold:disabled{opacity:.5;cursor:not-allowed}
.decision #status{margin:12px 0;padding:11px 13px;font-weight:720}.decision .actions{margin:8px 0 0}.decision .actions button{min-height:47px}.decision .actions #continue-button{background:linear-gradient(100deg,#51dca1,#b2f47f)}
#after-decline{border-color:#ffbd9e;color:#fff5ed;min-height:45px}#after-decline:disabled{opacity:.5}
.receipt{margin-top:14px;border-color:#51d9ae}.after-receipt-summary{grid-template-columns:repeat(2,minmax(0,1fr));margin:10px 0;gap:8px}.after-receipt-summary div{background:#0f2934;border:1px solid #51d9ae44;border-radius:12px;padding:11px}.after-receipt-summary dd{color:#b4ffe1;font-size:1.02rem}
.receipt details summary{cursor:pointer;color:#abdcff;font-weight:720;padding:9px 0}.receipt pre{max-height:280px}.policy{margin:12px 0}
@media(max-width:760px){.hero{align-items:start}h1{font-size:1.8rem}.decision{padding:15px}#drift-panel{padding:12px}.after-receipt-summary{grid-template-columns:1fr}.timeline{grid-template-columns:repeat(9,minmax(0,1fr));gap:2px}.timeline .step{font-size:.48rem}.timeline .step span{width:19px;height:19px;font-size:.58rem}}


/* SFN COLOR DAY JUDGE FINISH: visual changes only, no kernel/UX logic modified. */
:root{--sfn-cyan:#60eaff;--sfn-orange:#ffb866;--sfn-green:#8df2bb;--sfn-violet:#b798ff;}
body{background:radial-gradient(ellipse at 5% 8%,#12acee3b,transparent 32%),radial-gradient(ellipse at 94% 9%,#915ef73d,transparent 34%),radial-gradient(ellipse at 53% 64%,#2ae0b615,transparent 36%),linear-gradient(125deg,#04121f 0%,#071b33 45%,#15183a 79%,#221642 100%);}
.shell{width:min(1180px,calc(100% - 32px));padding-top:22px;}
.hero{align-items:flex-start;gap:16px;}.hero>div:first-child{flex:1 1 auto;min-width:0;}
.hero .brand{display:inline-flex;flex-wrap:nowrap;align-items:baseline;gap:.1em;padding:.16em .38em .2em;border:1px solid #8ae4ff40;border-radius:16px;background:linear-gradient(115deg,#0b3f5799,#3b23617a);box-shadow:0 10px 32px #0004,0 0 26px #46d6ff1f;font-size:clamp(2.1rem,4.1vw,3.35rem);line-height:1;font-weight:950;letter-spacing:-.065em;text-transform:none;}
.hero .brand-three{color:var(--sfn-cyan);text-shadow:0 0 18px #42bdfb55;}
.hero .brand-trust{color:var(--sfn-orange);text-shadow:0 0 17px #ffac5955;}
.hero .brand-gate{color:var(--sfn-green);text-shadow:0 0 18px #3fe69e50;}
.hero h1{font-size:clamp(1.55rem,2.42vw,2.38rem);line-height:1.16;letter-spacing:-.024em;max-width:none;margin:.65rem 0;text-wrap:pretty;}
@media(min-width:1080px){html[lang="en"] .hero h1{white-space:nowrap;}html[lang="es"] .hero h1{font-size:clamp(1.35rem,2.06vw,2rem);white-space:nowrap;}}
#simulation-label{font-weight:700;color:#d7f4ff;}
#lang-toggle{border-color:#75c4ff8a;background:#17284d;min-width:68px;box-shadow:0 0 19px #7e70ff2b;}
.boundary{gap:8px;margin-top:11px;}.boundary span{border-color:#6cdaef57;background:linear-gradient(110deg,#113355cc,#213056bb);box-shadow:inset 0 1px 0 #ffffff0d;}
.boundary span:nth-child(1){color:#8cf0ff;}.boundary span:nth-child(2){color:#ffd496;}.boundary span:nth-child(3){color:#a8ffd2;}
.timeline{margin:16px 0;}.step.active span{background:linear-gradient(135deg,#21d3e4,#4876d8);box-shadow:0 0 15px #30b8ed55;}
.step:nth-child(3n+2).active span{background:linear-gradient(135deg,#e59e4e,#f2c578);}
.step:nth-child(3n).active span{background:linear-gradient(135deg,#5b9ecf,#9c73ec);}
.card{border-color:#9ae3f244;box-shadow:0 15px 40px #0005,inset 0 1px 0 #ffffff09;}
.recommendation-controls.card{border-color:#e6ae784a;}
#shopping-query{border:1px solid #60cfff70;background:#0b1c32;}
#ask-ai-button{background:linear-gradient(110deg,#ffc57b,#ff9e62);color:#111b2e;font-weight:900;}
.conversation{border-color:#74dff454;}.user{background:linear-gradient(110deg,#1c4574,#204e78);}.assistant{background:linear-gradient(110deg,#12273c,#263050);}
.offer{border-color:#85cff236;background:linear-gradient(140deg,#0a2339,#16223d);}
.offer.recommended{border-color:#65e2fb;box-shadow:0 0 0 1px #58d6ee2e,0 10px 32px #00639a35;}
.offer .eyebrow{color:#ffc27e;font-size:.84rem;}.offer.recommended .eyebrow{color:#8ceffd;}.offer strong{color:#f0f8ff;}
.decision{border:2px solid #56dfff;background:linear-gradient(125deg,#0b2c46,#171d3a 82%);box-shadow:0 0 0 1px #52c5ee22,0 19px 52px #0009;}
.decision-head .eyebrow{color:#ffbf75;}.decision-head h2{color:#e5fdff;font-size:clamp(1.5rem,2vw,2rem);}
.shield{filter:drop-shadow(0 0 12px #6cdbff66);}
.decision dl div{background:linear-gradient(120deg,#0c2a42,#142c49);border-color:#68cee136;}
#verification{background:linear-gradient(90deg,#55371e8c,#29304b3b);color:#ffe2ac;}
#hold-button{background:linear-gradient(105deg,#03b6cc,#258ce2 63%,#796ff2);color:white;box-shadow:0 8px 29px #249ff04b;}
.decision .actions #continue-button{background:linear-gradient(105deg,#38d6a0,#a1eb88);color:#082a27;font-weight:900;}
#drift-panel{background:linear-gradient(125deg,#4a2a34,#4a2930);border-color:#ffbb7c;}
#drift-changes ins{color:#a9ffe0;background:#0e594a;}
.receipt{border:1px solid #63efbd;box-shadow:0 12px 42px #00b8811d;}
.after-receipt-summary div{background:linear-gradient(130deg,#0b2f3f,#153246);border-color:#47cdb15c;}
.receipt details summary{color:#94ddff;}footer{opacity:.84;color:#d0e2f4;}
@media(max-width:1079px){.hero h1,html[lang="es"] .hero h1{white-space:normal;font-size:clamp(1.48rem,4.5vw,2.25rem);}.hero .brand{font-size:clamp(1.95rem,6.2vw,3rem);}}
@media(max-width:760px){.shell{width:calc(100% - 22px);padding-top:16px;}.hero .brand{font-size:clamp(1.75rem,7.3vw,2.6rem);}.hero h1{font-size:clamp(1.37rem,5vw,2rem);}.boundary{gap:5px}.boundary span{padding:6px 9px;}}
@media(prefers-reduced-motion:reduce){.hero .brand,#hold-button{transition:none;}}
