@font-face{font-family:Bangers;src:url(../fonts/Bangers-Regular.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}:root{--navy:#061a40;--blue:#1755e8;--yellow:#ffd53d;--coral:#ff5a5f;--cream:#f7f5ef;--ink:#0a1c3c;--muted:#6e778a;--line:#e1e5ed}*{box-sizing:border-box}body,html{background:#e9edf4}body{margin:0;color:var(--ink);font-family:Trebuchet MS,Segoe UI,sans-serif;overscroll-behavior-y:none}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.pwa-shell{width:100%;max-width:560px;min-height:100dvh;margin:0 auto;background:var(--cream);box-shadow:0 0 36px #061a401f}.app-header{position:sticky;z-index:20;top:0;height:64px;padding:env(safe-area-inset-top) 18px 0;justify-content:space-between;color:#fff;background:var(--navy);border-bottom:3px solid var(--yellow)}.app-header,.brand{display:flex;align-items:center}.brand{gap:9px;font-family:Arial Rounded MT Bold,Trebuchet MS,sans-serif;font-size:19px;font-weight:900}.brand>span:last-child span{color:var(--yellow)}.brand-mark{display:grid;place-items:center;width:32px;height:32px;color:var(--navy);background:var(--yellow);border-radius:10px;box-shadow:2px 2px 0 var(--coral);transform:rotate(-4deg)}.local-status{display:flex;align-items:center;gap:6px;color:#c9d5e9;font-size:11px;font-weight:800}.local-status span{width:7px;height:7px;border-radius:50%;background:#57dc95}.mobile-app{padding:22px 14px 132px}.page-title{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 4px 20px}.page-title h1{margin:0;font-family:Arial Rounded MT Bold,Trebuchet MS,sans-serif;font-size:25px;line-height:1.1}.page-title p{margin:5px 0 0;color:var(--muted);font-size:13px}.progress{min-width:88px}.progress strong{display:block;margin-bottom:5px;text-align:right;font-size:12px}.progress>div{height:7px;overflow:hidden;background:#dadde4;border-radius:99px}.progress i{display:block;height:100%;background:var(--blue);border-radius:99px;transition:width .25s ease}.step-card{margin-bottom:12px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 3px 12px #1023460a}.step-heading{display:flex;align-items:center;min-height:30px;margin-bottom:13px}.step-heading h2{margin:0;font-size:15px;font-weight:900}.step-number{display:grid;place-items:center;width:28px;height:28px;margin-right:10px;color:var(--yellow);background:var(--navy);border-radius:8px;font-weight:900}.selection-count,.step-done{margin-left:auto;padding:4px 8px;color:#16865a;background:#e8f8ef;border-radius:99px;font-size:11px}.selection-count{color:var(--muted);background:#eef0f4}.selection-count.complete{color:#16865a;background:#e8f8ef}.photo-capture{position:relative;width:100%;height:154px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--ink);background:#f3f6fb;border:2px dashed #b8c5da;border-radius:12px;cursor:pointer}.photo-capture img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.camera-icon{width:42px;height:36px;display:grid;place-items:center;color:#fff;background:var(--blue);border-radius:9px;box-shadow:3px 3px 0 var(--yellow)}.photo-capture strong{font-size:14px}.change-photo{position:absolute;right:9px;bottom:9px;padding:6px 9px;color:#fff;background:#061a40db;border-radius:7px;font-size:11px;font-weight:800}.privacy-note{margin:8px 0 0;color:var(--muted);text-align:center;font-size:10px}.hero-name-field{display:flex;align-items:center;gap:11px;height:52px;padding:0 14px;background:#f8faff;border:2px solid #d8deea;border-radius:11px}.hero-name-field:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px #1755e814}.hero-name-field span{color:var(--yellow);font-size:20px;text-shadow:1px 1px var(--coral)}.hero-name-field input{width:100%;border:0;outline:0;color:var(--ink);background:transparent;font-size:16px;font-weight:800}.hero-name-field input::-moz-placeholder{color:#a0a8b8;font-weight:600}.hero-name-field input::placeholder{color:#a0a8b8;font-weight:600}.field-help{margin-top:5px;color:var(--muted);text-align:right;font-size:10px}.power-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.power-choice{min-width:0;min-height:58px;padding:7px;display:grid;grid-template-columns:38px minmax(0,1fr) 20px;align-items:center;gap:7px;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:11px;text-align:left;cursor:pointer}.power-choice.selected{border-color:var(--blue);background:#f2f6ff}.power-choice.locked{opacity:.42}.power-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;font-size:20px}.power-choice strong{min-width:0;font-size:11px;line-height:1.15}.power-choice i{display:grid;place-items:center;width:20px;height:20px;color:#7d899d;border:1px solid #cbd2de;border-radius:50%;font-style:normal;font-size:11px;font-weight:900}.power-choice.selected i{color:#fff;background:var(--blue);border-color:var(--blue)}.theme-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.theme-choice{min-width:0;padding:5px 3px;display:grid;justify-items:center;gap:6px;color:var(--ink);background:transparent;border:1.5px solid transparent;border-radius:11px;cursor:pointer}.theme-choice.selected{background:#f1f5ff;border-color:var(--blue)}.theme-swatch{width:100%;height:43px;display:grid;place-items:center;border:2px solid #fff;border-radius:9px;box-shadow:0 0 0 1px #d7dce5,0 3px 7px #061a401f}.theme-swatch i{width:22px;height:22px;display:grid;place-items:center;color:#fff;background:#061a40c7;border-radius:50%;font-size:12px;font-style:normal;font-weight:900}.theme-choice strong{overflow:hidden;width:100%;font-size:10px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.preview-section{padding:12px 2px 0}.preview-section>h2{margin:0 0 10px 3px;font-size:15px}.id-card{position:relative;aspect-ratio:105/74;overflow:hidden;padding:5cqw;color:var(--card-ink);background:linear-gradient(135deg,var(--card-start),var(--card-end));border-radius:16px;box-shadow:0 14px 30px #091f4e38,0 4px #041331;container-type:inline-size}.id-card:before{content:"";position:absolute;inset:0;opacity:.14;background-image:radial-gradient(var(--card-ink) 1px,transparent 1px);background-size:13px 13px}.card-corner{position:absolute;width:48%;aspect-ratio:1;right:-24%;top:-57%;background:var(--card-accent);transform:rotate(45deg)}.card-body,.card-footer,.card-top{position:relative;z-index:1}.card-top{display:flex;justify-content:space-between;align-items:center;font-weight:900;font-size:3.7cqw}.card-top small{color:var(--card-muted);font-size:2.2cqw;letter-spacing:.08em}.card-body{display:grid;grid-template-columns:34% 1fr;gap:6%;height:65%;margin-top:4%}.card-photo{height:100%;overflow:hidden;display:grid;place-items:center;background:color-mix(in srgb,var(--card-ink) 12%,transparent);border:3px solid var(--card-accent);border-radius:9px}.card-photo img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.card-photo.empty span{color:var(--card-muted);font-family:Arial Rounded MT Bold,sans-serif;font-size:16cqw}.card-details small{color:var(--card-muted);font-size:2.4cqw;letter-spacing:.12em;font-weight:900}.card-details h3{margin:1% 0 2%;overflow:hidden;color:var(--card-ink);font-family:Bangers,Arial Rounded MT Bold,sans-serif;font-size:6.2cqw;font-weight:400;letter-spacing:.04em;line-height:1;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.yellow-line{width:100%;height:4px;margin-bottom:5%;background:var(--card-accent)}.card-powers{display:grid;gap:5px;margin-top:3%}.card-powers span{overflow:hidden;padding:5px 8px;color:#fff;border-radius:5px;font-size:2.6cqw;font-weight:900;text-overflow:ellipsis;white-space:nowrap}.card-powers .empty-power{color:var(--card-muted);background:color-mix(in srgb,var(--card-ink) 10%,transparent)}.card-footer{display:flex;align-items:flex-end;justify-content:space-between;margin-top:1%;color:var(--card-muted);font-size:2.1cqw;font-weight:900;letter-spacing:.08em}.card-footer span{color:var(--card-accent);font-size:4cqw}.bottom-action{position:fixed;z-index:30;right:0;bottom:0;left:50%;width:100%;max-width:560px;padding:11px 14px calc(9px + env(safe-area-inset-bottom));transform:translate(-50%);background:#f7f5eff5;border-top:1px solid #dce0e7;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.generate-button{width:100%;height:54px;padding:0 10px 0 19px;display:flex;align-items:center;justify-content:space-between;color:var(--navy);background:var(--yellow);border:0;border-radius:12px;box-shadow:4px 4px 0 var(--coral);cursor:pointer;font-size:15px;font-weight:900}.generate-button:active{transform:translateY(2px);box-shadow:2px 2px 0 var(--coral)}.generate-button:disabled{opacity:.65;cursor:wait}.generate-button b{display:grid;place-items:center;width:35px;height:35px;color:#fff;background:var(--navy);border-radius:8px}.pdf-mobile-action{width:100%;margin-top:9px;padding:8px;color:var(--blue);background:transparent;border:0;text-decoration:underline;cursor:pointer;font-size:12px;font-weight:900}.bottom-action small{display:block;margin-top:6px;color:var(--muted);text-align:center;font-size:9px}.error-message{margin:14px 2px 0;padding:10px 12px;color:#a9343a;background:#fff0f0;border:1px solid #ffc9c9;border-radius:10px;text-align:center;font-size:12px;font-weight:700}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:360px){.power-grid{grid-template-columns:1fr}.mobile-app{padding-right:10px;padding-left:10px}}@media print{.pwa-shell{display:none}}