/* A portrait-first table: large readable artwork and one generation at a time. */
:root{--ink:#3a2530;--paper:#efe6da;--muted:#8c7779;--gold:#bd9255;--line:#dccbc0;--cream:#fffaf1;color:var(--ink);background:var(--paper)}body{background:radial-gradient(ellipse at top,#f9f0de 0,#ede2d5 70%);min-height:100vh}button{font-size:15px;padding:12px 18px;border-radius:10px}button.primary{background:#672d40;border-color:#672d40;box-shadow:0 5px 15px #672d401b}button.primary:hover{background:#803c52;color:white}.top{background:#38202cd9;backdrop-filter:blur(12px);border-bottom:1px solid #76525b;color:#fff5e5;padding:18px 3%;min-height:88px}.brand{color:#ead5ab;font-size:40px;gap:15px}.brand span{font-size:30px}.brand small{color:#c9a992;font-size:9px;letter-spacing:3px}.top-controls button,.top-controls select{color:#f3e5d7;border-color:#8b67714f;background:#fff3}.top-controls button{font-size:13px;padding:9px 12px}.top-controls button:hover:not(:disabled){background:#835062}.volume{color:#dac6b5}.volume input{accent-color:#d8ad70}.top-controls select option{color:#38202c;background:#fff7e7}.hero h1{color:#592b3b}.hero .intro{color:#877277}.hero-art{background:radial-gradient(ellipse,#b8936840,transparent 65%)}.hero-art:before{color:#9b6b6915}.hero-art .seal{background:#f7e9d3;border-color:#bb9260;color:#8e4d55}.hero-art img{border-width:7px;box-shadow:0 18px 40px #68334435}.eyebrow{color:#9b6d64}.table{max-width:1600px;padding:25px 3% 30px}.table-heading{margin:0 0 20px}.table-heading h2{font-size:34px;margin:7px 0 0;color:#5d2e40}.table-heading .eyebrow{margin:0;font-size:10px;letter-spacing:2px}.table-tools{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding:12px 15px;border:1px solid #ddc8bc;background:#fff8edc2;border-radius:13px}.secret-panel{display:flex;align-items:center;gap:18px;padding:0 18px 0 0;background:transparent;color:var(--ink);border:none;border-right:1px solid #ddc8bc;min-width:250px}.secret-panel .eyebrow{font-size:10px;letter-spacing:1px;max-width:75px;color:#93716b}.secret-panel .secret-title{font-size:23px;margin:0;gap:10px}.secret-panel .trait{width:36px;height:44px}.secret-panel .trait img{mix-blend-mode:multiply}.turn-pill{color:#69394b;font-size:16px;font-weight:700;margin-right:auto}.turn-pill small{display:block;font-size:9px;color:#a78b82;letter-spacing:1.5px;margin-top:5px}.table-tools>button{font-size:12px;background:transparent;padding:10px 13px;border-color:#e0ccc2}.score-strip{gap:12px;margin-bottom:23px}.score-family{background:#442936;color:#f7e9d3;border:1px solid #75515b;padding:15px 20px;border-radius:12px;gap:16px;box-shadow:0 5px 12px #4429360d}.score-family .trait{width:35px;height:43px}.score-family .trait img{mix-blend-mode:normal;border-radius:7px}.score-family .name{font-size:13px;color:#e4cabe}.score-family b{font-size:32px}.score-family.mine{background:#6a3448;border-color:#c9a05f;box-shadow:0 0 0 2px #c9a05f30}.score-family.mine:after{color:#ecc790;right:9px;top:8px;font-size:11px}.family-album{margin-bottom:20px}.generation-nav{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}.generation-nav>button{flex:1;display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #d9bfb0;background:#f6ebdd;padding:12px 15px;color:#89635e;font-size:13px;position:relative;min-width:140px}.generation-nav .roman{font:29px Georgia;color:#b89378}.generation-nav small{display:block;font-size:10px;margin-top:5px;color:#ae9183}.generation-nav>button.active{background:#fffaf1;border-color:#9e5163;box-shadow:0 0 0 2px #9e516315;color:#682c40}.generation-nav>button.active .roman{color:#793b4d}.generation-nav .all-generations{flex:0 0 auto;min-width:0;font-size:12px;max-width:140px}.legal-dot{position:absolute;top:10px;right:9px;width:6px;height:6px;background:#bd995c;border-radius:50%;box-shadow:0 0 0 3px #bd995c25}.album{padding:21px 24px 22px;border:1px solid #d7beac;border-radius:15px;background:linear-gradient(110deg,#fffaf0,#f5e7d5);box-shadow:0 10px 40px #7b493c0c;overflow:visible}.generation{border-bottom:1px solid #dfcdb9;min-width:0;padding:0 0 23px;margin-bottom:25px}.generation:last-child{margin-bottom:0;padding-bottom:0}.generation-head{align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.generation-head h3{font-size:27px;margin:6px 0 0;color:#6c3446}.generation-head .eyebrow{font-size:9px;color:#b18b67;letter-spacing:2px}.generation-note{font-size:12px;text-align:right;color:#956f66;max-width:290px;line-height:1.7}.generation-note small{display:block;font-size:10px;letter-spacing:1px;color:#b19881}.portrait-rail{overflow-x:auto;padding:16px 0 7px;scrollbar-color:#bd9673 #eee2d1;scrollbar-width:thin}.row{display:flex;justify-content:flex-start;gap:18px;min-width:max-content;padding:0 5px}.pair-wrap{width:236px;flex:none;padding:10px 10px 5px;background:#fdf5e8;border:1px solid #e4cdb6;border-radius:13px;box-shadow:0 5px 12px #8e5d3d0a}.pair{height:242px;min-height:0;padding:0;margin:0;display:flex;align-items:flex-start;justify-content:center;width:100%;border-radius:7px}.pair img{width:156px;height:220px;object-fit:contain;border-radius:4px;box-shadow:0 6px 12px #6a3d3025;flex:none}.pair img+img{width:144px;height:203px;margin-left:-87px;margin-top:35px;z-index:1;box-shadow:0 7px 12px #6a3d3030}.pair:disabled{opacity:1;color:inherit;background:transparent}.pair.target{background:#f2dfb7;border:2px solid #b58d43;box-shadow:0 0 0 5px #b58d4315}.pair.target:hover{background:#f5d69b}.pair.target:after{content:'✓';background:#966b33;width:25px;height:25px;top:-8px;right:-8px;font-size:13px}.portrait-caption{display:flex;align-items:center;justify-content:space-between;gap:4px;margin-top:10px;font-size:11px;color:#9c7970;min-height:22px}.table-inspect{position:static;display:flex;gap:2px}.table-inspect .inspect{color:#865e54;font-size:12px;padding:3px 5px}.target-action{width:100%;margin-top:8px;padding:9px 6px;font-size:12px;background:#6b3448;color:#fff6e8;border-color:#6b3448}.target-action:hover:not(:disabled){background:#834b5e;color:#fff}.parent-reference{display:block;color:#af8e79;font-size:10px;margin:9px 0 2px}.empty-slot,.empty-generation .empty-slot{width:236px;height:286px;border:1px dashed #d8bfa5;background:#f7ead945;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-radius:13px;margin:0;flex:none;color:#d5bfa1}.empty-slot span{font:50px Georgia}.empty-slot small{font-size:11px;color:#b49b82}.empty-generation{padding:0}.empty-generation .generation-head{margin-bottom:10px}.parent-nav{font-size:11px;padding:6px 12px;margin:0 0 2px;background:#f4e6d5;border-color:#e5cdb5;color:#8c675c}.archived .pair{height:242px;min-height:0}.archived .pair img{width:156px;height:220px}.archived .pair img+img{width:144px;height:203px;margin-left:-87px;margin-top:35px}.play-dock{display:grid;grid-template-columns:minmax(0,1fr) 295px;gap:18px;position:sticky;bottom:10px;z-index:6;align-items:stretch;border-radius:15px;box-shadow:0 10px 40px #532b3220}.hand-panel{margin:0;position:static;bottom:auto;background:#442936;color:#ffefd9;padding:20px 22px 12px;border-color:#70535b;border-radius:15px;box-shadow:none;min-width:0}.hand-head h3{font-size:23px;color:#f7e3c4}.hand-head small,.hand-panel .tiny{color:#cfae9e;font-size:11px}.hand-head small{font-size:12px}.hand-cost{font-size:12px;color:#d0afa0}.hand-cost b{color:#f0c07e}.hand{gap:14px;padding:9px 3px 10px;scrollbar-color:#ba946d #60414e;scrollbar-width:thin}.hand-card>button:first-child{border:3px solid #bca49455;box-shadow:0 5px 9px #0003;border-radius:6px}.hand-card img{width:128px;height:180px;max-width:none;border-radius:3px}.hand-card.selected>button:first-child{border-color:#e8b763;transform:translateY(-5px);box-shadow:0 0 0 3px #e8b76330,0 8px 18px #0005}.hand-card.illegal>button:first-child{opacity:1;filter:saturate(.7)}.hand-card .inspect{color:#d9bba8;font-size:12px;padding:3px 8px}.action-panel{margin:0;background:#fff9ed;border:1px solid #d7beac;border-radius:15px;padding:20px}.action-panel h3{font-size:21px;margin-bottom:13px;color:#6c3446}.action-panel p{font-size:13px;color:#9b7468;line-height:1.6;margin:8px 0}.action-panel button{padding:12px;font-size:14px;max-width:none}.action-panel .tiny{font-size:10px;margin-top:12px}.turn-light{background:#b68a53;box-shadow:0 0 0 4px #b68a5320}.preview-card{gap:14px;margin:7px 0}.preview-card img{width:81px}.preview-card .trait{width:22px;height:27px}.preview-card p{font-size:11px}.exchange-label select{font-size:12px}.social-panels{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}.social-panels>.panel{margin:0;background:#fff6e8;border-color:#dfc7b6}details summary{font-size:14px;color:#85475a}.member{border-color:#e6d4c1;font-size:14px}.member small{font-size:11px}.chat{font-size:14px;max-height:260px}.chat .msg b{font-size:11px}.reactions button{padding:7px 10px}.history p{font-size:13px;border-color:#ead4c3}.lobby{max-width:940px}.lobby h1{color:#6c3446}.lobby>p{color:#956f66;font-size:16px}.seat{padding:22px;border-color:#d7beac;background:#fff8eb}.seat strong{font-size:18px}.seat small{font-size:12px}.seat .avatar{width:67px;height:94px;border-color:#e3cbb3}.lobby .people-panel{margin-top:25px}.lobby-actions{gap:15px}.result-panel{max-width:1080px}.result-panel h1{font-size:42px;color:#6c3446}.result{border-color:#d7beac;background:#fff8eb;padding:30px}.result h3{font-size:25px}.result p{font-size:15px}.result.winner{border-color:#b68a53;background:linear-gradient(110deg,#fff3d8,#efd5aa)}.result .total{font-size:29px}dialog{max-width:790px;border-color:#caab96;background:#fff7e7;padding:40px;box-shadow:0 20px 100px #33202c70}dialog::backdrop{background:#2b1828bb;backdrop-filter:blur(7px)}dialog .large-portrait{width:420px;max-height:65vh;object-fit:contain;margin:20px auto}dialog h2{font-size:31px;color:#6c3446}dialog p{font-size:15px;color:#886456;line-height:1.8}.close{color:#805563;font-size:28px}#toast{background:#653248;font-size:15px}.status{color:#a67e77}.status:before{background:#9c8f65}.all-generations~.album{padding:15px}
@media(min-width:1500px){.pair-wrap,.empty-slot,.empty-generation .empty-slot{width:258px}.pair img{width:174px;height:245px}.pair{height:265px}.pair img+img{width:160px;height:225px;margin-left:-95px;margin-top:36px}.empty-slot,.empty-generation .empty-slot{height:310px}.hand-card img{width:145px;height:204px}}
@media(max-width:1100px){.table-tools{gap:9px;padding:12px}.secret-panel{min-width:215px;gap:12px}.secret-panel .secret-title{font-size:21px}.table-tools>button{padding:8px;font-size:11px}.score-family{padding:13px 14px;gap:9px}.score-family b{font-size:28px}.score-family .name{font-size:12px}.generation-nav>button{min-width:120px;gap:8px;font-size:12px;padding:11px}.generation-nav .roman{font-size:24px}.generation-nav .all-generations{max-width:110px}.play-dock{grid-template-columns:minmax(0,1fr) 255px;gap:12px}.action-panel{padding:17px}.hand-panel{padding:18px 18px 10px}.hand-head h3{font-size:21px}.hand-cost{font-size:11px}.album{padding:20px}.hand-card img{width:125px;height:176px}.table-heading h2{font-size:30px}}
@media(max-width:800px){.top{padding:15px 16px;gap:15px}.brand span{font-size:25px}.brand small{font-size:8px}.top-controls button{font-size:12px;padding:7px}.volume input{width:58px}.table{padding:21px 12px 30px}.table-heading{gap:10px;margin-bottom:18px}.table-heading h2{font-size:25px}.table-heading .eyebrow{font-size:8px}.connection-invite{flex-direction:column;gap:7px;align-items:end}.connection-invite button{font-size:11px;padding:9px}.table-tools{flex-wrap:wrap;padding:13px;gap:12px}.secret-panel{min-width:0;flex:1;padding-right:10px;gap:9px;order:0;display:flex;width:auto}.secret-panel .eyebrow{font-size:8px;max-width:60px}.secret-panel .secret-title{font-size:19px;gap:6px}.secret-panel .trait{width:29px;height:35px}.turn-pill{font-size:13px;max-width:130px;order:1;margin:0}.table-tools>button{order:2;flex:1;font-size:11px}.score-strip{gap:5px;margin-bottom:20px}.score-family{padding:11px 4px;gap:5px;flex-direction:column}.score-family .trait{width:28px;height:34px}.score-family b{font-size:25px;margin:0}.score-family .name{font-size:10px}.generation-nav{gap:6px;flex-wrap:nowrap;overflow-x:auto;padding:3px 2px 8px;scrollbar-width:thin}.generation-nav>button{flex:none;min-width:128px;padding:12px 10px}.generation-nav .all-generations{min-width:100px;max-width:100px}.album{padding:18px 13px;border-radius:13px}.generation-head h3{font-size:24px}.generation-note{font-size:10px;max-width:150px;line-height:1.6}.generation-note small{font-size:9px}.portrait-rail{padding-top:13px}.row{gap:12px;padding:0 3px}.pair-wrap{width:210px;padding:8px}.pair{height:220px;min-height:0}.pair img{width:144px;height:203px}.pair img+img{width:131px;height:184px;margin-left:-81px;margin-top:30px}.empty-slot,.empty-generation .empty-slot{width:210px;height:268px}.portrait-caption{font-size:10px;margin-top:10px}.table-inspect .inspect{font-size:12px}.parent-reference{font-size:10px}.target-action{padding:10px;font-size:13px}.play-dock{display:flex;flex-direction:column;position:static;gap:13px;box-shadow:none}.hand-panel{padding:18px 15px 12px;border-radius:13px;order:0;margin-top:0;width:100%;position:static}.hand-head h3{font-size:21px}.hand-head small{font-size:11px}.hand-cost{font-size:10px;max-width:110px}.hand-card img{width:129px;height:182px}.hand{gap:12px;padding-bottom:8px}.action-panel{padding:21px;border-radius:13px;order:1;display:block;width:100%}.action-panel h3{font-size:23px}.action-panel p{font-size:14px}.action-panel button{max-width:none;font-size:15px}.action-panel .primary{max-width:none}.social-panels{display:block;margin-top:20px}.social-panels .panel{margin-bottom:12px}.preview-card img{width:98px}.exchange-label{font-size:13px}.exchange-label select{font-size:13px}.parent-nav{padding:7px 10px;font-size:11px}.lobby{margin:35px auto}.lobby h1{font-size:32px}.lobby-head{gap:13px}.lobby .seat{padding:17px}.lobby .avatar{width:68px;height:96px}.hero h1{font-size:44px}.hero-art img{width:36%;max-width:175px}.hero-art img:nth-child(3){width:29%;max-width:140px}.hero-art{min-height:365px}.hero .intro{font-size:15px}.results{grid-template-columns:1fr}.result-panel h1{font-size:33px}.result-panel .people-panel{margin-top:20px}dialog{padding:35px 20px}dialog .large-portrait{width:100%;max-height:68vh}dialog h2{font-size:27px}}
.live-portrait{position:relative;display:block;flex:none;isolation:isolate}.live-portrait>img{display:block;width:100%!important;height:100%!important;object-fit:contain}.portrait-lids{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;animation:portraitBlink var(--blink-duration) var(--blink-delay) infinite;z-index:2}.pair>.live-portrait{width:156px;height:220px}.pair>.live-portrait+.live-portrait{width:144px;height:203px;margin-left:-87px;margin-top:35px;z-index:1}.pair>.live-portrait+.live-portrait img{margin:0}.hand-card .live-portrait{width:128px;height:180px}.marriage-hearts{position:absolute;bottom:6px;left:50%;z-index:3;pointer-events:none;color:#d0748c;font-size:23px;filter:drop-shadow(0 2px 2px #6f354c30)}.marriage-hearts i{position:absolute;left:-10px;bottom:0;font-style:normal;opacity:0;animation:heartFloat 7.5s infinite}.marriage-hearts i:nth-child(2){animation-delay:1s;font-size:16px;left:15px}.marriage-hearts i:nth-child(3){animation-delay:2s;font-size:13px;left:-24px}.pair:hover .marriage-hearts i{color:#bf5a78}.large-portrait.live-portrait{height:auto;aspect-ratio:100/140.6}.portrait-lids g{transform-origin:center}@keyframes portraitBlink{0%,39%,42%,100%{opacity:0}40%,41%{opacity:1}}@keyframes heartFloat{0%,62%,100%{opacity:0;transform:translateY(0) scale(.65)}66%{opacity:.9;transform:translateY(-4px) scale(1)}84%{opacity:0;transform:translateY(-64px) scale(.8)}}
@media(min-width:1500px){.pair>.live-portrait{width:174px;height:245px}.pair>.live-portrait+.live-portrait{width:160px;height:225px;margin-left:-95px;margin-top:36px}.hand-card .live-portrait{width:145px;height:204px}}
@media(max-width:1100px){.hand-card .live-portrait{width:125px;height:176px}}
@media(max-width:800px){.pair>.live-portrait{width:144px;height:203px}.pair>.live-portrait+.live-portrait{width:131px;height:184px;margin-left:-81px;margin-top:30px}.hand-card .live-portrait{width:129px;height:182px}}
.score-gain{position:absolute;right:15px;top:6px;font-size:17px;font-weight:700;color:#ffdb7c;animation:scoreRise 2.2s both;pointer-events:none}.hand-card.playable>button:first-child{border-color:#bea25f;box-shadow:0 0 0 2px #bea25f20,0 6px 14px #0003}.hand-card.playable:hover>button:first-child{transform:translateY(-6px) rotate(-1deg);box-shadow:0 0 0 3px #e8b76355,0 12px 24px #0005}.hand-card.selected>button:first-child{border-color:#ffe1a3}.card-grip{touch-action:none;cursor:grab;font-size:10px;padding:3px 8px;border-color:#ac8d7540;color:#e6c9a7;background:#6a4958}.card-grip:active{cursor:grabbing}.drag-portrait{position:fixed;width:110px;height:155px;pointer-events:none;z-index:100;transform:rotate(-5deg) scale(1.05);filter:drop-shadow(0 16px 20px #34202670)}.drag-portrait img{width:100%;height:100%;border-radius:5px}.drop-hover{outline:4px solid #e1b260!important;background:#f8d796!important;box-shadow:0 0 25px #c7965080!important}.turn-steps{display:flex;align-items:center;gap:7px;margin:15px 0 12px;font-size:9px;color:#b6a28c;flex-wrap:wrap}.turn-steps span{display:flex;align-items:center;gap:4px}.turn-steps i{font-style:normal;border:1px solid #d5c4b1;border-radius:50%;width:17px;height:17px;display:grid;place-content:center}.turn-steps .active{color:#773e50;font-weight:700}.turn-steps .active i{background:#773e50;border-color:#773e50;color:white}.turn-steps .done{color:#97864e}.waiting-puzzle{border-top:1px dashed #dcc3ac;margin-top:14px;padding-top:12px}.waiting-puzzle summary{font-size:12px}.waiting-puzzle p{font-size:11px}.puzzle-cards{display:flex;gap:7px}.puzzle-cards button{padding:0;margin:0;border-radius:5px;overflow:hidden}.puzzle-cards img{width:64px;display:block}.waiting-puzzle small{display:block;margin-top:10px;font-size:10px;color:#aa856b}.waiting-puzzle>button{padding:6px;font-size:11px}.pair.target{animation:targetGlow 3s infinite}.calm-motion *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.calm-motion .portrait-lids,.calm-motion .portrait-brows{display:none}.calm-motion .marriage-hearts i:first-child{opacity:.7;position:static}.calm-motion .score-gain{opacity:1;transform:none}.hand-card>button{transition:transform .2s,box-shadow .2s}.top-controls{flex-wrap:wrap}.lobby-actions .primary{animation:startGlow 3.5s infinite}@keyframes scoreRise{0%{opacity:0;transform:translateY(10px) scale(.7)}15%,70%{opacity:1;transform:translateY(-10px) scale(1)}100%{opacity:0;transform:translateY(-30px)}}@keyframes targetGlow{0%,100%{box-shadow:0 0 0 3px #b58d4310}50%{box-shadow:0 0 0 5px #b58d4325}}@keyframes startGlow{0%,100%{box-shadow:0 4px 15px #672d401b}50%{box-shadow:0 0 0 4px #bfa46d20,0 4px 20px #672d4030}}
@media(max-width:800px){.top-controls{justify-content:flex-start;gap:6px}.top-controls button{font-size:11px;padding:7px}.turn-steps{font-size:12px;gap:11px}.turn-steps i{width:23px;height:23px}.card-grip{font-size:11px;padding:6px 9px}.puzzle-cards img{width:82px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.portrait-lids{display:none}.marriage-hearts i:first-child{opacity:.7;position:static;font-size:17px}}

/* Album ornament, theatrical final reveal and accessible flag controls. */
body{background-color:#efe1d1;background-image:radial-gradient(ellipse at top,#fff2deaa,transparent 65%),repeating-linear-gradient(45deg,#894a5c03 0,#894a5c03 1px,transparent 1px,transparent 11px)}
.top{background:linear-gradient(120deg,#291a29,#5b3040 80%,#3d2332);border-bottom:2px solid #b89159;box-shadow:0 5px 20px #44233622}.top-controls button{background:#fff1}.table-heading h2{letter-spacing:-1px}.album{position:relative;border:1px solid #caa779;box-shadow:0 0 0 4px #fff6e7,0 0 0 5px #dbc3a4,0 15px 35px #713f2f10;background-image:linear-gradient(115deg,#fffaf0,#f4e4cb),repeating-linear-gradient(0deg,#a9754110 0,#a9754110 1px,transparent 1px,transparent 6px)}.album:before,.album:after{content:'❧';position:absolute;color:#bd9a5b;font:25px Georgia;top:6px;pointer-events:none}.album:before{left:8px}.album:after{right:8px;transform:scaleX(-1)}.generation-head{padding:7px 8px 2px}.pair-wrap{background:linear-gradient(145deg,#fff5de,#eddbc1);border:1px solid #c8a775;box-shadow:inset 0 0 0 3px #fff6e78c,0 8px 18px #71482d12}.pair img{border:2px solid #e3c798}.portrait-caption{border-top:1px solid #dec6a3;padding-top:9px;margin-top:5px}.score-family{background:linear-gradient(145deg,#513141,#332431)}.score-family.mine{background:linear-gradient(145deg,#86465b,#593247)}.hand-panel{background:radial-gradient(ellipse at top left,#693f4c,#362331 80%);border-color:#a98869;box-shadow:inset 0 0 0 3px #e0b9780b}.play-dock{position:static;margin-top:24px}.hand-head{padding-bottom:12px;border-bottom:1px solid #b8967630}.language-flags{display:flex;gap:5px}.language-flags button{padding:4px!important;width:34px;height:29px;border:1px solid transparent;background:transparent}.language-flags svg{width:24px;height:16px;display:block;border-radius:2px}.language-flags button[aria-pressed=true]{border-color:#e2be78;box-shadow:0 0 0 2px #e2be7820;background:#fff1}.match-scene{display:flex;align-items:center;justify-content:center;gap:28px;margin:25px 0}.match-parents{display:flex;align-items:start}.match-scene .live-portrait{width:122px;height:172px}.match-parents .live-portrait+.live-portrait{margin-left:-42px;margin-top:20px}.match-child .live-portrait{width:156px;height:220px}.match-arrow{font-size:35px;color:#b98b49}.preview-points{display:flex;align-items:center;gap:12px;background:#f0ddbd;padding:12px 18px;border-radius:9px;color:#86572f;margin:16px 0}.preview-points .trait{width:30px;height:36px}.preview-actions{display:flex;gap:12px;margin-top:24px}.preview-actions button{flex:1;padding:15px}.portrait-brows{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;animation:eyebrowRaise calc(var(--blink-duration)*1.5) var(--blink-delay) infinite;z-index:1}.portrait-brows .moving-brow{animation:browLift calc(var(--blink-duration)*1.5) var(--blink-delay) infinite}.live-portrait:hover .portrait-brows{animation:eyebrowHello 1s both}.live-portrait:hover .moving-brow{animation:browHello 1s both}.result-panel{max-width:1120px;margin-top:40px;text-align:center}.result-panel>h1{font-size:42px;line-height:1.35;max-width:800px;margin:15px auto 25px}.reveal-emblem{font:75px Georgia;color:#c7a260}.family-crown{width:75px;height:54px}.reveal-controls{display:flex;align-items:center;justify-content:center;gap:25px;margin:24px 0;color:#9b705b;font-size:15px}.results{text-align:left}.result{display:flex;gap:24px;position:relative;background:linear-gradient(120deg,#fff5e3,#f0dfc8);box-shadow:inset 0 0 0 4px #fff7ec80,0 10px 25px #69453612;padding:24px;border:1px solid #cfb18b}.result-details{flex:1;min-width:0}.result-avatar{width:105px;position:relative;align-self:start;margin-top:18px}.result-avatar img{width:105px;border:3px solid #d4b375;box-shadow:0 5px 10px #77463020;border-radius:4px}.result-avatar .family-crown{position:absolute;left:17px;top:-37px;transform:rotate(-6deg)}.result h3{font-size:25px;margin:8px 0 15px}.revealed-trait{display:flex;align-items:center;gap:8px;color:#aa8663;min-height:45px;font-size:16px;border-bottom:1px solid #ddc4a6;padding-bottom:12px;margin-bottom:14px}.revealed-trait .trait{width:28px;height:34px}.revealed-trait.unsealed{color:#73384b;animation:unseal .65s both}.wax-seal{background:radial-gradient(circle,#a34b68,#6a2b47);width:30px;height:30px;border:2px solid #b9767d;border-radius:50%;display:grid;place-items:center;color:#e8c49d;font:16px Georgia}.result p{font-size:13px}.result .total{font-size:23px}.spotlight{border-color:#b88742;box-shadow:0 0 0 4px #d6b16a35,0 10px 25px #69453620}.revealed-number{animation:unseal .65s both}.result.winner{border-color:#ba8d40;background:radial-gradient(ellipse at top left,#ffeabe,#ead0a0)}.family-confetti{position:fixed;inset:0;pointer-events:none;z-index:50;overflow:hidden}.family-confetti i{position:absolute;left:var(--x);top:-30px;width:8px;height:13px;background:var(--confetti-color);color:var(--confetti-color);font:22px Georgia;animation:confettiFall var(--duration) var(--delay) linear both}.family-confetti i:nth-child(5n+1){background:none;width:auto;height:auto}.family-confetti i:nth-child(3n){border-radius:50%;width:7px;height:7px}.result-panel>details{text-align:left;margin-top:18px}.result-panel>.primary{font-size:17px;padding:15px 30px}.top-controls select[hidden]{display:none}@keyframes eyebrowRaise{0%,65%,74%,100%{opacity:0}67%,71%{opacity:1}}@keyframes browLift{0%,65%,74%,100%{transform:translateY(0)}67%,71%{transform:translateY(-1px)}}@keyframes eyebrowHello{0%,100%{opacity:0}15%,75%{opacity:1}}@keyframes browHello{0%,100%{transform:translateY(0)}15%,75%{transform:translateY(-1px)}}@keyframes unseal{from{opacity:.15;transform:translateY(7px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes confettiFall{to{transform:translate(var(--drift),110vh) rotate(640deg);opacity:0}}
@media(max-width:800px){.album{box-shadow:0 0 0 2px #fff6e7,0 0 0 3px #dbc3a4,0 10px 25px #713f2f10}.generation-head{padding:5px 5px}.play-dock{margin-top:21px}.match-scene{gap:15px}.match-scene .live-portrait{width:85px;height:120px}.match-child .live-portrait{width:117px;height:165px}.match-parents .live-portrait+.live-portrait{margin-left:-45px}.match-arrow{font-size:26px}.result-panel>h1{font-size:30px}.result{gap:17px;padding:22px 16px}.result-avatar,.result-avatar img{width:82px}.result-avatar .family-crown{width:62px;left:10px;top:-30px}.result h3{font-size:23px}.result .total{font-size:22px}.reveal-controls{gap:12px;font-size:12px}.reveal-controls button{font-size:12px;padding:10px}.preview-actions{gap:10px}.preview-actions button{font-size:13px}.top-controls{gap:6px}.language-flags{gap:3px}.top-controls button{font-size:10px;padding:7px}.top{padding:14px 13px}.volume input{width:54px}}
@media(prefers-reduced-motion:reduce){.portrait-brows{display:none}.family-confetti{display:none}.revealed-trait,.revealed-number{animation:none}}

/* Give both spouses enough exposed space to see their faces. */
.pair-wrap,.empty-slot,.empty-generation .empty-slot{width:300px}.pair>.live-portrait+.live-portrait,.pair img+img{margin-left:-32px;margin-top:25px}.pair>.live-portrait+.live-portrait img{margin:0}.pair>.live-portrait+.live-portrait{width:144px;height:203px}.archived .pair img+img{margin-left:-32px;margin-top:25px}
@media(min-width:1500px){.pair-wrap,.empty-slot,.empty-generation .empty-slot{width:336px}.pair>.live-portrait+.live-portrait{width:160px;height:225px;margin-left:-32px;margin-top:27px}}
@media(max-width:800px){.pair-wrap,.empty-slot,.empty-generation .empty-slot{width:270px}.pair>.live-portrait+.live-portrait{width:131px;height:184px;margin-left:-27px;margin-top:25px}.pair>.live-portrait+.live-portrait img{margin:0}.pair img+img{margin-left:-27px;margin-top:25px}}

/* Keep the hand focused on portraits, with no visible catalog numbers. */
.hand{gap:18px;padding-top:14px;padding-bottom:13px}.hand-card{grid-template-columns:1fr 1fr;gap:8px 5px}.hand-card>button:first-child{grid-column:1/-1}.hand-card .inspect{justify-self:end;width:35px;height:27px;font-size:18px;padding:2px 6px;background:#a7825d15!important;border:1px solid #c4a06a25;border-radius:6px}.hand-card .card-grip{justify-self:start;width:35px;height:27px;font-size:17px;padding:2px 6px;background:#a7825d15;border:1px solid #c4a06a25;color:#cfb48f}.hand-card .live-portrait{width:138px;height:194px}.hand-card img{width:138px;height:194px}.hand-card>button:first-child{border-width:2px}.hand-head{margin-bottom:5px}.hand-card:hover .inspect,.hand-card:hover .card-grip{border-color:#e0bc7890}.hand-card.selected:before{content:'✦';position:absolute;left:50%;top:-17px;color:#ffdfa0;font-size:12px;transform:translateX(-50%)}
@media(min-width:1500px){.hand-card .live-portrait,.hand-card img{width:157px;height:221px}}
@media(max-width:800px){.hand-card .live-portrait,.hand-card img{width:143px;height:201px}.hand{gap:16px}.hand-card .inspect,.hand-card .card-grip{height:30px;width:39px}.hand-head{gap:10px}.hand-head h3{font-size:23px}.hand-panel{padding:20px 16px 13px}}

/* Every birth draws a luminous connection from parents to child. */
.in-love>.live-portrait:first-child{animation:loveSway 6.2s ease-in-out infinite;transform-origin:50% 85%}.in-love>.live-portrait:nth-child(2){animation:loveSway 6.2s .35s ease-in-out infinite reverse;transform-origin:50% 85%}.in-love .marriage-hearts{bottom:65px;left:50%;color:#db7999}.in-love .marriage-hearts i{animation:excitedHearts 4.8s infinite}.in-love .marriage-hearts i:nth-child(2){animation-delay:.8s}.in-love .marriage-hearts i:nth-child(3){animation-delay:1.6s}.in-love:hover>.live-portrait{animation-duration:2.2s}.in-love:hover .marriage-hearts i{animation-duration:2.8s}.lineage-show{position:fixed;inset:0;z-index:90;background:#2f1d2cc2;backdrop-filter:blur(7px);display:grid;place-items:center;padding:20px;animation:lineageBackdrop .3s both}.lineage-stage{position:relative;width:650px;max-width:100%;max-height:95vh;overflow:auto;text-align:center;background:radial-gradient(ellipse at center,#fff5dd,#edddbd);border:1px solid #d7b572;border-radius:23px;box-shadow:inset 0 0 0 7px #fff5df80,0 20px 100px #16081965;padding:24px 20px 23px}.lineage-stage:before,.lineage-stage:after{content:'❧';position:absolute;top:23px;color:#b69659;font:34px Georgia}.lineage-stage:before{left:24px}.lineage-stage:after{right:24px;transform:scaleX(-1)}.lineage-stage h2{font-size:24px;line-height:1.4;margin:13px 35px 4px;color:#76364e}.lineage-stage>.eyebrow{font-size:9px;margin-top:6px}.lineage-canvas{position:relative;width:540px;max-width:100%;height:425px;margin:0 auto}.lineage-tree{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.branch-line{fill:none;stroke:url(#branchGlow);stroke-width:3;stroke-linecap:round;stroke-dasharray:260;stroke-dashoffset:260;animation:branchDraw 1.6s .3s forwards}.branch-trunk{animation-delay:1.1s;stroke-dasharray:180;stroke-dashoffset:180}.branch-glow{fill:none;stroke:#edc873;stroke-width:10;opacity:.4;filter:url(#branchBloom)}.branch-leaf{fill:#9da67a;opacity:0;animation:leafGrow .55s 1.1s forwards;transform-origin:center;transform-box:fill-box}.leaf-right{animation-delay:1.4s}.branch-spark{filter:drop-shadow(0 0 5px #ffe8ac)}.lineage-parent{position:absolute;top:35px;left:25%;transform:translateX(-50%);animation:parentArrive .65s both}.lineage-parent.right{left:75%;animation-delay:.12s}.lineage-parent .live-portrait{width:110px;height:155px;filter:drop-shadow(0 5px 7px #713e3725)}.lineage-heart{position:absolute;left:50%;top:94px;transform:translateX(-50%);font-size:26px;color:#b7617f;animation:lineageHeartbeat .8s infinite}.lineage-baby{position:absolute;top:248px;left:50%;transform:translateX(-50%);opacity:0;animation:babyArrive .9s 1.35s forwards}.lineage-baby .live-portrait{width:122px;height:172px;border:3px solid #d3af71;background:#fff1d9;border-radius:5px;box-shadow:0 0 0 5px #f5d69530,0 10px 20px #693b391a}.lineage-baby span:last-child{display:block;font-size:10px;color:#b08b5c;letter-spacing:2px;margin-top:9px}.lineage-stage>p{font-size:12px;color:#aa8069;margin:17px 0}.lineage-done{font-size:12px;padding:9px 20px;background:#71354b;color:#fff3d9;border-color:#71354b}.lineage-close{position:absolute;top:8px;right:9px;font-size:25px;padding:3px 10px;border:0;background:transparent;color:#8b5561;z-index:3}.lineage-petals{position:absolute;left:50%;top:65%;width:0;height:0}.lineage-petals i{position:absolute;left:0;top:0;font-style:normal;font-size:17px;color:#c79852;opacity:0;animation:lineagePetal 1.6s calc(1.5s + var(--i)*.025s) both;--angle:calc(var(--i)*30deg)}.lineage-petals i:nth-child(3n){color:#ca7d98;font-size:15px}@keyframes loveSway{0%,16%,35%,100%{transform:rotate(0) translateY(0)}20%{transform:rotate(-.9deg) translateY(-1px)}25%{transform:rotate(.9deg) translateY(-2px)}30%{transform:rotate(-.5deg) translateY(-1px)}}@keyframes excitedHearts{0%,12%,100%{opacity:0;transform:translate(0,0) scale(.55)}20%{opacity:.95;transform:translate(3px,-8px) scale(1.1)}42%{opacity:.75;transform:translate(-7px,-38px) scale(.9)}65%{opacity:0;transform:translate(8px,-78px) scale(.8)}}@keyframes lineageBackdrop{from{opacity:0}to{opacity:1}}@keyframes branchDraw{to{stroke-dashoffset:0}}@keyframes leafGrow{from{opacity:0;transform:scale(.1)}to{opacity:1;transform:scale(1)}}@keyframes parentArrive{from{opacity:0;translate:0 -12px}to{opacity:1;translate:0 0}}@keyframes babyArrive{0%{opacity:0;scale:.4;translate:0 15px}65%{opacity:1;scale:1.06;translate:0 -4px}100%{opacity:1;scale:1;translate:0 0}}@keyframes lineageHeartbeat{50%{scale:1.18}}@keyframes lineagePetal{0%{opacity:0;transform:rotate(var(--angle)) translateY(0) scale(.2)}30%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateY(-150px) scale(1)}}
@media(max-width:800px){.lineage-show{padding:10px}.lineage-stage{padding:24px 11px 20px;border-radius:17px}.lineage-stage h2{font-size:21px;margin:12px 30px 5px}.lineage-stage>.eyebrow{font-size:8px;letter-spacing:1px}.lineage-stage:before,.lineage-stage:after{font-size:23px;top:28px}.lineage-stage:before{left:15px}.lineage-stage:after{right:15px}.lineage-canvas{height:370px}.lineage-parent .live-portrait{width:94px;height:132px}.lineage-parent{top:30px;left:27%}.lineage-parent.right{left:73%}.lineage-heart{top:83px;font-size:22px}.lineage-baby{top:219px}.lineage-baby .live-portrait{width:107px;height:150px}.lineage-stage>p{font-size:11px;margin-top:22px}.in-love .marriage-hearts{bottom:58px}}
@media(prefers-reduced-motion:reduce){.in-love>.live-portrait{animation:none}.lineage-show{display:none}}

/* Art-first hand: every card stays in the spread, even on small screens. */
.hand{display:flex;overflow:visible;gap:0;padding:23px 0 15px;isolation:isolate}.hand-card{flex:1 1 0;min-width:0;position:relative;transition:transform .22s;overflow:visible}.hand-card:last-child{flex:0 0 180px}.hand-card>button:first-child{width:180px;padding:0}.hand-card .live-portrait,.hand-card img{width:176px;height:248px}.hand-card .inspect,.hand-card .card-grip{z-index:2;justify-self:start}.hand-card:hover,.hand-card:focus-within,.hand-card.selected{z-index:20;transform:translateY(-12px)}.hand-card:not(:last-child) .inspect{margin-left:0}.hand-card .card-grip{grid-column:1;grid-row:3}.play-dock{grid-template-columns:minmax(0,1fr)}.action-panel{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.action-panel h3{margin:0}.action-panel p{flex:1;min-width:180px}.action-panel button{width:auto}.winner-celebration{min-height:85vh;display:flex;justify-content:center;align-items:center;gap:40px;padding:70px 20px 40px;background:radial-gradient(ellipse,#ffe6ad80,transparent 68%);animation:winnerEntrance 1.3s both}.winner-portrait{position:relative;text-align:center}.winner-portrait>.family-crown{position:absolute;width:150px;height:108px;left:50%;top:-82px;transform:translateX(-50%) rotate(-5deg);z-index:3;filter:drop-shadow(0 8px 15px #ad793855)}.winner-portrait .live-portrait{width:min(370px,70vw);height:auto;aspect-ratio:70/99;border:7px solid #dbb46d;border-radius:12px;box-shadow:0 20px 75px #71443845,0 0 0 6px #fff0cf}.winner-portrait .live-portrait img{width:100%;height:100%;object-fit:contain}.winner-portrait h2{font:40px Georgia;color:#672d40;margin:24px 0 8px}.winner-portrait p{font-size:23px;color:#9a703f}.winner-celebration:has(.winner-portrait:nth-child(2)){flex-wrap:wrap}.winner-celebration:has(.winner-portrait:nth-child(2)) .live-portrait{width:min(270px,60vw)}@keyframes winnerEntrance{from{opacity:0;transform:scale(.85) translateY(45px)}to{opacity:1;transform:none}}
@media(max-width:800px){.hand-card:last-child{flex-basis:143px}.hand-card>button:first-child{width:143px}.hand-card .live-portrait,.hand-card img{width:139px;height:196px}.hand-panel{padding:20px 12px}.hand-card .inspect,.hand-card .card-grip{width:27px;padding:2px}.hand-card:hover,.hand-card:focus-within,.hand-card.selected{transform:translateY(-16px)}.winner-celebration{min-height:90vh;padding-top:80px}.winner-portrait>.family-crown{width:125px;height:90px;top:-68px}.winner-portrait h2{font-size:34px}}
@media(prefers-reduced-motion:reduce){.winner-celebration{animation:none}.hand-card{transition:none}}

.winner-celebration{position:fixed;inset:0;z-index:45;min-height:100dvh;overflow:auto;background:radial-gradient(ellipse at center,#fff0c9,#ead8c1);padding:95px 20px 85px}.winner-portrait .live-portrait{width:auto;height:58dvh;max-width:72vw;aspect-ratio:70/99}.winner-portrait h2{font-size:clamp(26px,4vw,40px);margin:18px 0 6px}.winner-portrait p{margin:0;font-size:20px}.winner-continue{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:#672d40;color:#fff1d7;border-color:#672d40;z-index:5}.winner-celebration:has(.winner-portrait:nth-child(3)) .live-portrait{height:42dvh;width:auto}.winner-portrait>.family-crown{height:85px;top:-67px;width:125px}

/* A matching three-dimensional family album box for the welcome screen. */
.hero-art.box-display{min-height:610px;display:flex;align-items:center;justify-content:center;perspective:1300px;overflow:visible}.box-display:before{content:''}.game-box{width:360px;height:485px;position:relative;transform-style:preserve-3d;transform:rotateY(-13deg) rotateZ(2deg);transition:transform .7s;animation:boxArrival 1.2s both;filter:drop-shadow(20px 28px 20px #49233738);z-index:1}.game-box:hover{transform:rotateY(-5deg) rotateZ(0deg) translateY(-8px)}.box-front{position:absolute;inset:0;background:radial-gradient(ellipse at top,#84445b,#42212f 80%);border:3px solid #c9a15f;border-radius:5px;color:#f7dfae;text-align:center;padding:20px 15px;box-shadow:inset 0 0 0 5px #492333,inset 0 0 0 6px #c9a15f80;overflow:hidden}.box-front:before,.box-front:after{content:'❧';position:absolute;font:100px Georgia;color:#d6aa6130;bottom:5px}.box-front:before{left:-18px;transform:rotate(-30deg)}.box-front:after{right:-18px;transform:scaleX(-1) rotate(-30deg)}.box-ornament{letter-spacing:12px;font:20px Georgia;color:#d7b575;margin-bottom:12px}.box-author{font-size:10px;letter-spacing:4px;color:#d7bb91}.box-front h2{font:38px Georgia;margin:10px -5px 7px;letter-spacing:-1px;color:#ffe6b2;text-shadow:0 2px 3px #1e0b16}.box-subtitle{font-size:9px;letter-spacing:3px;color:#d9bd95;margin:0}.box-portraits{position:relative;height:230px;margin-top:24px;display:flex;justify-content:center;align-items:center}.box-display .box-portraits img{position:relative;inset:auto;width:115px;height:163px;border:3px solid #ddba78;border-radius:4px;object-fit:cover;box-shadow:0 9px 15px #180e2166}.box-display .box-portraits img:nth-child(1){transform:rotate(-14deg) translateX(12px);z-index:1}.box-display .box-portraits img:nth-child(2){transform:translateY(-18px);z-index:3;width:132px;height:186px;margin:0 -20px}.box-display .box-portraits img:nth-child(3){transform:rotate(14deg) translateX(-12px);z-index:2}.box-footer{display:flex;align-items:center;justify-content:center;gap:15px;font:14px Georgia;color:#edcc92;margin:4px 0 16px}.box-footer b{font-size:21px;color:#eab0b2}.box-edition{font-size:9px;letter-spacing:2px;border-top:1px solid #d2a35b60;padding-top:13px;color:#d9bd95}.box-spine{position:absolute;top:0;bottom:0;left:-48px;width:48px;background:linear-gradient(90deg,#301724,#703a4b);border:2px solid #b88d51;transform-origin:right;transform:rotateY(-90deg);display:flex;align-items:center;flex-direction:column;justify-content:space-around;color:#e7c28c}.box-spine b{writing-mode:vertical-rl;font:22px Georgia}.box-spine small{writing-mode:vertical-rl;font-size:9px}.box-pedestal{position:absolute;width:390px;height:40px;bottom:44px;border-radius:50%;background:#5a303322;filter:blur(15px)}@keyframes boxArrival{from{opacity:0;transform:rotateY(-25deg) rotateZ(5deg) translateY(25px)}to{opacity:1;transform:rotateY(-13deg) rotateZ(2deg)}}
@media(max-width:800px){.hero-art.box-display{min-height:520px}.game-box{width:310px;height:450px}.box-front{padding:17px 12px}.box-front h2{font-size:33px}.box-portraits{height:215px;margin-top:20px}.box-display .box-portraits img{width:102px;height:144px}.box-display .box-portraits img:nth-child(2){width:122px;height:172px}.box-pedestal{width:310px;bottom:15px}.box-footer{font-size:12px}.box-edition{font-size:8px}}
@media(prefers-reduced-motion:reduce){.game-box{animation:none;transition:none}.game-box:hover{transform:rotateY(-13deg) rotateZ(2deg)}}
.box-portraits{height:205px}.box-footer{margin-top:0}.box-front .box-edition{line-height:1.4}@media(max-width:800px){.box-portraits{height:190px}}