:root{--bg: #faf9f6;--ink: #1a1a1a;--ink-soft: #6b6760;--ocre: #b8860b;--ocre-deep: #8f6a09;--ocre-soft: #e9dbb6;--line: #e6e3dc;--locked: #c9c6bf;--gold-halo: 0 0 0 3px var(--bg), 0 0 0 5px var(--ocre), 0 0 16px rgba(184, 134, 11, .5);--serif: "Cormorant Garamond", serif;--cond: "Barlow Condensed", sans-serif;--max-w: 480px;--pad: 20px}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg);color:var(--ink);font-family:var(--serif);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}#app{max-width:var(--max-w);margin:0 auto;min-height:100dvh;padding:var(--pad);padding-bottom:96px;animation:screenIn .35s ease both}@keyframes screenIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}button{font:inherit;cursor:pointer}img{max-width:100%;display:block}.label{font-family:var(--cond);font-weight:500;letter-spacing:.16em;text-transform:uppercase;font-size:13px;color:var(--ocre)}.btn{display:block;width:100%;border:none;background:var(--ink);color:var(--bg);font-family:var(--cond);font-size:17px;letter-spacing:.08em;text-transform:uppercase;padding:14px;border-radius:8px;transition:transform .15s ease}.btn:active{transform:scale(.98)}.btn.secondary{background:transparent;color:var(--ink);border:1px solid var(--line)}.input{width:100%;border:1px solid var(--line);border-radius:8px;background:#fff;font-family:var(--cond);font-size:18px;padding:13px 14px;margin-bottom:12px}.input:focus{outline:2px solid var(--ocre);outline-offset:1px}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.topbar .who{font-family:var(--cond);font-size:14px;letter-spacing:.06em;color:var(--ink-soft)}.topbar .who strong{color:var(--ink);font-weight:600}.iconbtn{background:none;border:none;font-size:22px;line-height:1;color:var(--ink);padding:6px}.menu{position:fixed;top:0;right:0;bottom:0;left:0;background:#faf9f6f7;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;animation:screenIn .25s ease both}.menu a{font-family:var(--serif);font-size:28px;color:var(--ink);text-decoration:none}.menu .close{position:absolute;top:18px;right:18px}.passport-title{text-align:center;margin:4px 0 10px}.passport-title h1{font-weight:500;font-size:42px;line-height:1.02;letter-spacing:.01em}.passport-title h1 em{font-style:italic;font-weight:400;font-size:.62em;display:block;margin:2px 0}.ornament{display:flex;align-items:center;justify-content:center;gap:10px;margin:14px auto 4px;max-width:280px}.ornament:before,.ornament:after{content:"";flex:1;height:1px;background:var(--ocre);opacity:.6}.ornament svg{width:22px;height:22px;fill:var(--ocre)}.ornament-year{text-align:center;font-family:var(--cond);font-size:14px;letter-spacing:.35em;color:var(--ocre);margin-bottom:22px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 10px}.seal{display:flex;flex-direction:column;align-items:center;background:none;border:none;padding:0;animation:sealIn .45s ease both;animation-delay:calc(var(--i, 0) * 45ms)}@keyframes sealIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.seal .disc{display:block;width:92px;height:92px;margin-bottom:9px;position:relative;overflow:hidden;transition:transform .2s ease}.seal:active .disc{transform:scale(.95)}.seal.got .disc{background:radial-gradient(circle at 35% 28%,#e8c160,var(--ocre) 68%,var(--ocre-deep));border-radius:48% 52% 50% 50%/51% 49% 52% 48%;box-shadow:inset 0 2px 4px #ffffff59,inset 0 -3px 6px #00000040,0 3px 8px #00000038}.seal:nth-child(odd).got .disc{transform:rotate(-2deg);border-radius:52% 48% 49% 51%/48% 52% 49% 51%}.seal:nth-child(3n).got .disc{transform:rotate(1.5deg)}.seal.got .disc img{width:86%;height:86%;object-fit:cover;border-radius:50%;position:absolute;top:7%;right:7%;bottom:7%;left:7%}.seal.got.gold .disc{box-shadow:var(--gold-halo),inset 0 -3px 6px #00000040}.seal.empty .disc{border:2px dotted var(--locked);border-radius:50%;background:transparent}.seal .name{font-family:var(--cond);font-size:12.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}.seal.empty .name{color:var(--locked)}.slot16-wrap{margin-top:30px;display:flex;justify-content:center}.seal.self .disc{width:108px;height:108px;border:2px dashed var(--ocre-soft);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:36px;color:var(--ocre-soft)}.seal.self.got .disc{border:none;border-radius:48% 52% 50% 50%/51% 49% 52% 48%}.casita{margin:34px auto 0;text-align:center}.casita svg{width:84px;height:auto;stroke:var(--ocre);fill:none;stroke-width:1.4;opacity:.8}.casita .yr{font-family:var(--cond);font-size:12.5px;letter-spacing:.3em;color:var(--ocre);margin-top:6px}.progress{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:var(--max-w);background:#faf9f6f5;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-top:1px solid var(--line);padding:14px var(--pad);z-index:10;display:flex;align-items:center;gap:8px}.progress .seg{flex:1;height:2px;background:var(--line);position:relative;overflow:hidden}.progress .seg .fill{position:absolute;inset:0 auto 0 0;background:var(--ocre)}.ms-icon{background:none;border:none;padding:4px;line-height:0;color:var(--locked);transition:color .3s ease,transform .2s ease}.ms-icon svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.ms-icon.on{color:var(--ocre-deep)}.ms-icon:active{transform:scale(.9)}.progress .count{font-family:var(--cond);font-size:12px;letter-spacing:.08em;color:var(--ink-soft);white-space:nowrap;margin-left:2px}.ficha .retrato{width:100%;aspect-ratio:4 / 5;object-fit:cover;border-radius:10px;background:var(--ocre-soft);margin-bottom:16px}.ficha h2{font-weight:500;font-size:30px;line-height:1.1}.ficha .rol{margin:2px 0 14px}.datos{display:flex;gap:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin-bottom:16px}.datos div{flex:1}.datos .k{font-family:var(--cond);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}.datos .v{font-family:var(--cond);font-size:16px;font-weight:500}.bio{margin-bottom:26px;white-space:pre-line}.trivia-screen{min-height:78dvh;display:flex;flex-direction:column}.trivia-screen .head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:26px}.trivia-screen .qnum{font-family:var(--cond);font-size:14px;color:var(--ink-soft);letter-spacing:.1em}.trivia-screen h2{font-weight:500;font-size:27px;line-height:1.15;margin-bottom:24px;animation:screenIn .3s ease both}.opt{display:block;width:100%;text-align:left;background:#fff;border:1px solid var(--line);border-radius:8px;font-family:var(--cond);font-size:17px;padding:13px 15px;margin-bottom:9px;transition:border-color .15s ease,background .15s ease}.opt.right{border-color:var(--ocre);background:var(--ocre-soft)}.opt.wrong{border-color:#c0392b;color:#c0392b;animation:shake .3s ease}@keyframes shake{25%{transform:translate(-4px)}75%{transform:translate(4px)}}.trivia-done{min-height:78dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.trivia-done .disc-final{width:150px;height:150px;border-radius:48% 52% 50% 50%/51% 49% 52% 48%;background:radial-gradient(circle at 35% 28%,#e8c160,var(--ocre) 68%,var(--ocre-deep));margin-bottom:24px;animation:goldIn .8s ease both;box-shadow:var(--gold-halo),inset 0 -3px 6px #00000040;overflow:hidden;position:relative}.trivia-done .disc-final img{width:86%;height:86%;object-fit:cover;border-radius:50%;position:absolute;top:7%;right:7%;bottom:7%;left:7%}@keyframes goldIn{0%{transform:scale(.7);box-shadow:none}55%{transform:scale(1.06)}to{transform:scale(1)}}.stampflow{min-height:82dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.stampflow .bigseal{width:175px;height:175px;border-radius:48% 52% 50% 50%/51% 49% 52% 48%;overflow:hidden;position:relative;background:radial-gradient(circle at 35% 28%,#e8c160,var(--ocre) 68%,var(--ocre-deep));box-shadow:inset 0 2px 5px #ffffff59,inset 0 -4px 8px #00000047,0 8px 22px #0000004d;margin-bottom:24px;animation:stamp .6s cubic-bezier(.2,1.5,.4,1)}.stampflow .bigseal img{width:86%;height:86%;object-fit:cover;border-radius:50%;position:absolute;top:7%;right:7%;bottom:7%;left:7%}@keyframes stamp{0%{transform:scale(2.6) rotate(-6deg);opacity:0}55%{transform:scale(.93) rotate(.5deg);opacity:1}to{transform:scale(1)}}.stampflow h2{font-weight:500;font-size:30px;margin-bottom:6px}.stampflow .sub{color:var(--ink-soft);margin-bottom:26px;max-width:300px}.stampflow form{width:100%;max-width:320px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1a1a1a73;z-index:60;display:flex;align-items:center;justify-content:center;padding:28px;animation:screenIn .2s ease both}.popup{background:var(--bg);border-radius:12px;padding:26px 22px;text-align:center;max-width:320px}.popup h3{font-weight:500;font-size:24px;margin-bottom:6px}.popup p{color:var(--ink-soft);margin-bottom:18px}.toast{position:fixed;bottom:86px;left:50%;transform:translate(-50%);background:var(--ink);color:var(--bg);font-family:var(--cond);font-size:15px;letter-spacing:.04em;padding:10px 18px;border-radius:999px;z-index:100;white-space:nowrap;animation:screenIn .25s ease both}.page h1{font-weight:500;font-size:32px;margin:8px 0 14px}.page p{margin-bottom:14px}.page .muted{color:var(--ink-soft)}.back{background:none;border:none;font-family:var(--cond);font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);padding:0;margin-bottom:14px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}