#opening-status{position:absolute;left:16px;top:76px;padding:10px 14px;display:flex;flex-direction:column;gap:4px;text-align:left;color:#eee6ca;z-index:15;min-width:248px;border:1px solid #8c8c5b;background:#16271eef}
#opening-status b{font-size:15px}#opening-status span{font-size:13px;color:#bdcebb}
#evolution-button,#upgrade-button{position:absolute;right:15px;top:325px;z-index:16;padding:10px 12px;background:#222d24f5;color:#e4d9b7;border:1px solid #9b8b5e;font-size:15px}
#evolution-button{top:265px;background:#4c3b21;color:#ffe3a2;border-color:#e6c078;box-shadow:0 0 20px #e6c07830}
#upgrade-button small{display:block;margin-top:3px;color:#b7c7ac}#upgrade-button.ready{border-color:#c9dca0}#evolution-button[hidden]{display:none}
.opening-draw-heading{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:10px 14px;margin-bottom:10px;background:#17251ff2;border:1px solid #7d8c63;color:#f3e0b5;border-radius:3px}
.opening-draw-heading b{font-size:18px}.opening-draw-heading span{font-size:14px;color:#c6d0b8}
#draw-dialog{width:min(1080px,calc(100vw - 160px));left:50%;right:auto;bottom:170px;transform:translateX(-50%);scale:1;max-height:calc(100vh - 235px);overflow-y:auto;padding:12px}
#draw-dialog .draw-candidates{gap:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
#draw-dialog[data-count="1"]{width:410px}#draw-dialog[data-count="1"] .draw-candidates{grid-template-columns:1fr}
#draw-dialog[data-count="2"] .draw-candidates{grid-template-columns:repeat(2,minmax(0,1fr))}
#draw-dialog .choice-card{width:100%;max-width:none;min-height:390px;height:auto;padding:0;display:flex;flex-direction:column}
#draw-dialog .card-title-row{padding:12px 15px;gap:12px}#draw-dialog .choice-card h3{font-size:24px}#draw-dialog .card-title-row small{font-size:12px}
#draw-dialog .card-title-row .card-art{height:50px;flex-basis:50px}#draw-dialog .card-art img{width:48px;height:48px}
#draw-dialog .card-copy{gap:10px;padding:0 15px}#draw-dialog .card-section small{font-size:12px}#draw-dialog .card-section p{font-size:15px;line-height:1.6}#draw-dialog .card-gain p{font-size:17px}
#draw-dialog .card-bond p{font-size:14px}#draw-dialog .card-members{margin-top:12px;grid-template-columns:repeat(4,minmax(0,1fr))}#draw-dialog .card-members span{font-size:12px}#draw-dialog .card-members small{font-size:10px}
#draw-dialog .card-collection{margin-top:auto;font-size:13px}#draw-dialog .card-collection>b{display:block;font-size:12px}
#draw-dialog .draw-footer{margin-top:12px;padding-bottom:18px}#draw-dialog .draw-footer button{height:40px;font-size:15px}#draw-dialog .draw-giveup[hidden]{display:none}
.opening-choice{position:fixed;inset:auto auto 170px 50%;transform:translateX(-50%);margin:0;width:min(1070px,calc(100vw - 100px));max-width:none;max-height:calc(100vh - 230px);overflow:auto;background:#14231ef7;border:2px solid #b1a073;padding:18px;box-shadow:0 14px 45px #0009;z-index:40;color:#f0e8cf}
.opening-choice>header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:16px}.opening-choice header small{font-size:10px;letter-spacing:3px;color:#b8b786}.opening-choice header h2{font-size:25px;margin:4px 0 0}.opening-choice header>span{color:#cec3a3;font-size:14px}.opening-choice header>button{padding:4px 12px;font-size:22px}
#evolution-candidates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.evolution-card{text-align:left;padding:0;display:flex;flex-direction:column;background:linear-gradient(155deg,#2b342e,#16221e);color:#e7e5d7;border:2px solid #6f755e;border-radius:3px;overflow:hidden;box-shadow:inset 0 0 0 2px #111a18;transition:border-color .15s,transform .15s}
.evolution-card:hover,.evolution-card:focus-visible{border-color:var(--evo-color);transform:translateY(-3px);outline:2px solid var(--evo-color);outline-offset:2px}
.evo-art{position:relative;height:160px;background:radial-gradient(ellipse at center,#425448,#10251c);overflow:hidden;border-bottom:1px solid #8e8860}.evo-art img{width:100%;height:100%;object-fit:contain}.evo-art span{position:absolute;left:10px;top:10px;font-size:12px;background:#11201ed9;color:var(--evo-color);padding:4px 8px;border:1px solid #b8c6b344}
.evo-name{display:flex;justify-content:space-between;align-items:center;padding:11px 15px 7px}.evo-name small{font-size:12px;color:#aaa98e}.evo-name h3{font-size:27px;color:#f4dfaa;margin:0;letter-spacing:2px}
.evo-skill{padding:7px 15px;display:flex;justify-content:space-between;align-items:center;color:var(--evo-color)}.evo-skill strong{font-size:17px}.evo-skill span{font-size:12px;color:#babda6}.evolution-card>p{padding:0 15px;margin:4px 0 12px;font-size:15px;line-height:1.65;min-height:75px}.evo-synergy{margin:0 15px 13px;padding-top:10px;border-top:1px solid #66745566}.evo-synergy small{font-size:12px;color:#a4b99c}.evo-synergy p{font-size:13px;line-height:1.6;margin:5px 0 0;color:#c7cfbb}
.evo-select{margin-top:auto;padding:10px 15px;background:#0b1711b3;display:flex;justify-content:space-between;color:#efd69c;font-size:14px}.evo-select span{font-size:11px;color:#aebca1}.opening-choice footer{padding-top:14px;font-size:13px;color:#b8c0a7;text-align:center}
#upgrade-dialog{width:760px}#upgrade-candidates{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}#upgrade-candidates button{padding:20px 15px;background:#253629;text-align:left;border:1px solid #9ea77d;color:#eee6ce}#upgrade-candidates b{font-size:22px;color:#e8d494}#upgrade-candidates p{font-size:16px;line-height:1.6}#upgrade-candidates small{color:#adc29b}
#replace-candidates{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:15px 0}#economy-dialog{width:620px}#economy-ledger{max-height:50vh;overflow:auto;margin:15px 0}#economy-ledger table{width:100%;border-collapse:collapse;font-size:14px}#economy-ledger td,#economy-ledger th{padding:9px;border-bottom:1px solid #61725b;text-align:left}#economy-ledger td:last-child{text-align:right;white-space:nowrap}
.growth-rail{top:153px;max-height:calc(100vh - 340px);overflow:visible}.opening-bond{font-size:13px}.opening-bond .bond-tooltip{max-height:58vh;overflow:auto}.opening-bond .bond-tooltip p{font-size:13px;line-height:1.6}
@media(max-height:820px){#draw-dialog,.opening-choice{bottom:140px;max-height:calc(100vh - 190px)}#draw-dialog .choice-card{min-height:335px}#draw-dialog .card-copy{gap:7px}#draw-dialog .card-section p{font-size:13px}#draw-dialog .card-gain p{font-size:15px}#draw-dialog .card-bond p{font-size:12px}#draw-dialog .card-title-row{padding:8px 12px}#draw-dialog .card-members{margin-top:7px}.evo-art{height:115px}.evolution-card>p{font-size:13px;min-height:63px;margin-bottom:8px}.evo-synergy p{font-size:12px}.evo-name h3{font-size:23px}.evo-synergy{margin-bottom:9px}.opening-choice{padding:12px}.opening-choice>header{margin-bottom:10px}.opening-choice header h2{font-size:22px}.opening-choice footer{padding-top:9px;font-size:12px}}
@media(max-width:1100px){#draw-dialog,.opening-choice{width:calc(100vw - 60px)}#opening-status{min-width:205px;top:65px}#opening-status b{font-size:13px}#opening-status span{font-size:11px}#evolution-candidates{gap:10px}.evo-select{font-size:12px}.evo-select span{display:none}}
/* Three compact hero cards, above the battle controls. */
#evolution-dialog{width:min(810px,calc(100vw - 100px));background:transparent;border:0;box-shadow:none;padding:6px;bottom:calc(var(--console) + 95px);overflow:visible;max-height:none}
#evolution-dialog::backdrop{background:#06100c33}
#evolution-candidates{gap:16px;align-items:stretch}
#evolution-dialog .evolution-card{min-height:0;height:auto;border:1px solid #b8a567;background:linear-gradient(#313629,#17251e);box-shadow:inset 0 0 0 3px #101a12,0 7px 18px #0009;border-radius:3px}
#evolution-dialog .evo-name{padding:12px 14px 10px;display:block;background:#131c13b8;border-bottom:1px solid #ad995955}
#evolution-dialog .evo-name h3{font-size:23px;letter-spacing:2px}
#evolution-dialog .evo-name>span{display:block;margin-top:5px;font-size:12px;color:var(--evo-color)}
#evolution-dialog .evo-art{height:178px;flex-shrink:0;background:#1b2621;border-bottom:1px solid #ad995955;margin:0 4px}
#evolution-dialog .evo-art img{object-fit:contain;width:100%;height:100%}
#evolution-dialog .evo-skill{padding:13px 14px 7px;gap:8px}
#evolution-dialog .evo-skill strong{font-size:17px;color:#efdda6}
#evolution-dialog .evo-skill>span{font-size:12px;white-space:nowrap}
#evolution-dialog .evolution-card>p{padding:0 14px 16px;margin:0;font-size:14px;line-height:1.7;min-height:96px;color:#e8e6d7}
#evolution-dialog footer{padding:12px 0 0}
#evolution-dialog #fold-hero{width:104px;height:34px;font-size:14px;border:1px solid #857a57;background:linear-gradient(#3d4036,#20271f);color:#e2d7b6}
#evolution-dialog .evolution-card:hover,#evolution-dialog .evolution-card:focus-visible{outline:2px solid var(--evo-color);outline-offset:2px;border-color:#f1dfa0;box-shadow:inset 0 0 0 2px #cbb77b,0 8px 20px #0009}
@media(max-height:760px){#evolution-dialog{bottom:calc(var(--console) + 80px)}#evolution-dialog .evo-art{height:142px}#evolution-dialog .evo-name{padding:9px 14px}#evolution-dialog .evo-name h3{font-size:21px}#evolution-dialog .evo-skill{padding-top:10px}#evolution-dialog .evolution-card>p{padding-bottom:12px}#evolution-dialog footer{padding-top:10px}}
@media(max-height:620px){#evolution-dialog .evo-art{height:90px}#evolution-dialog{bottom:calc(var(--console) + 20px);max-height:calc(100vh - 60px);overflow-y:auto}}

/* Completed small sets live in the collection, with details on hover/focus. */
#bond-view-button{margin-left:auto;margin-right:10px}
#bond-view-dialog{width:min(780px,calc(100vw - 40px));max-height:calc(100dvh - 32px);min-height:156px;padding:20px;overflow:hidden;background:linear-gradient(145deg,#24362a,#12221a);border:1px solid #9a9067;user-select:none;box-sizing:border-box}
#bond-view-dialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
#bond-view-dialog h2{font-size:23px;margin:0}
#close-bond-view{width:30px;height:30px;font-size:23px;line-height:1;background:transparent}
#small-bond-icons{display:flex;flex-wrap:wrap;gap:12px}
.small-bond-icon{width:54px;height:54px;padding:3px;border:1px solid #a99359;background:#0f1b15;box-shadow:inset 0 0 0 2px #263d2d}
.small-bond-icon>img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}
.small-bond-icon:hover,.small-bond-icon:focus-visible{border-color:#ead18c;box-shadow:0 0 12px #bca25966}
#small-bond-empty{margin:50px 0;text-align:center;color:#a3b29a}
.bond-record-hint{font-size:12px;line-height:1.6;color:#aebda5;margin:7px 0 0}
.bond-collection-summary{display:flex;flex-wrap:wrap;gap:8px 24px;padding:11px 14px;border:1px solid #77855b55;background:#0d1d1688;color:#bdcab0;font-size:12px}
.bond-collection-summary b{font-size:20px;font-variant-numeric:tabular-nums;color:#f0dcaa;margin-right:5px}
.bond-record-scroll{height:min(440px,calc(100dvh - 270px));min-height:80px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#92845a #15271b;padding-right:8px}
.bond-record-scroll>[hidden]{display:none!important}
.bond-record-tabs{display:flex;gap:6px;border-bottom:1px solid #7c8b5566;margin:14px 0;padding-bottom:12px}
.bond-record-tabs>[role=tab]{flex:1;min-width:0;padding:10px 6px;border:1px solid #6c7952;background:#122219;color:#b6c4a8;font-size:14px;line-height:20px}
.bond-record-tabs>[aria-selected=true]{color:#f1dfae;border-color:#c0a769;background:linear-gradient(#3b4730,#263321);box-shadow:inset 0 -2px #d5b972}
.bond-record-tabs>[role=tab]:hover{color:#f1dfae;border-color:#c0a769}
.bond-record-tabs>[role=tab]:focus-visible{outline:2px solid #e0c57f;outline-offset:2px}
.bond-record-tabs>[role=tab]>span{font-size:11px;margin-left:6px;opacity:.7;font-variant-numeric:tabular-nums}
.bond-record-section+.bond-record-section{margin-top:12px;padding-top:12px;border-top:1px solid #7c8b5544}
#bond-record-all .bond-record-section{display:grid;grid-template-columns:105px minmax(0,1fr);gap:14px}
#bond-record-all .bond-record-section>h3{margin:0;min-height:48px;align-self:start}
.bond-record-section>h3{display:flex;align-items:center;gap:10px;font-size:15px;color:#e8d59f;margin:0 0 12px}
.bond-record-section>h3>span{font-size:12px;color:#aebda5;font-weight:400}
.bond-record-grid{display:grid;grid-template-columns:repeat(auto-fill,48px);gap:8px}
.collection-record{display:block;position:relative;width:48px;height:48px;min-width:0;border:1px solid #a993597d;background:#102118;padding:3px;box-shadow:inset 0 0 0 1px #314b35;cursor:pointer}
.collection-record>img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.collection-record.is-reserved{border-color:#81919c}
.collection-record:hover,.collection-record:focus-visible{border-color:#d5bc77;background:#35462d;outline:1px solid #c6ae6b;outline-offset:-1px}
.bond-legacy-rail[hidden]{display:none!important}
@media(max-width:720px){#bond-view-dialog{padding:14px}.bond-record-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:10px 0;padding-bottom:10px}.bond-record-tabs>[role=tab]{font-size:12px;padding:6px 2px}.bond-record-scroll{height:calc(100dvh - 310px)}.bond-collection-summary{gap:6px 12px;padding:8px}.bond-collection-summary b{font-size:16px}}
.bond-record-empty{color:#a3b29a;font-size:12px;margin:8px 0}
.growth-record-icon{position:relative;flex-shrink:0}
.growth-record-icon.is-reserved{border-color:#7c8a94}
.growth-record-icon>small{position:absolute;left:0;right:0;bottom:0;background:#14232bed;color:#d2e2ee;font-size:10px;line-height:15px;pointer-events:none}
.record-status{color:#c5dda8}
.record-status.is-reserved{color:#c7dbe9}
#small-bond-tooltip{position:absolute;box-sizing:border-box;width:min(420px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;overscroll-behavior:contain;padding:14px;background:#101e17fa;border:1px solid #a79b6e;box-shadow:0 6px 18px #0008;pointer-events:auto;z-index:2;scrollbar-width:thin;scrollbar-color:#92845a #15271b}
#small-bond-tooltip:focus-visible{outline:2px solid #ead18c;outline-offset:2px}
#small-bond-tooltip h3{margin:0 0 9px;color:#f0d99b;font-size:18px}
#small-bond-tooltip .small-bond-reward{font-size:13px;line-height:1.6;color:#d2dcbf;margin:0 0 12px}
#small-bond-tooltip>.info-result{padding-top:0;border-top:0;margin-bottom:12px}
#small-bond-tooltip>.info-result p{margin:5px 0;font-size:12px;line-height:1.5}
#small-bond-tooltip .info-condition{color:#a8b99e}
.small-bond-members{display:grid;gap:9px;border-top:1px solid #556849;padding-top:12px}
.small-bond-members>div{display:flex;gap:9px;align-items:flex-start}
.small-bond-members img{width:28px;height:28px;flex-shrink:0}
.small-bond-member-copy{flex:1;min-width:0;overflow-wrap:anywhere}
.small-bond-members p{margin:0;line-height:1.5;font-size:12px}
.small-bond-members b{display:block;color:#decda4;font-weight:400}
.small-bond-members span{display:block;color:#b7c5ad}
.small-bond-member-copy>.info-gain{color:#e5ebd9;margin-top:3px}
.small-bond-member-copy>.info-condition{margin-top:3px}
.small-bond-member-copy>.info-damage{margin-top:5px;padding:6px 8px}
.small-bond-member-copy .info-damage strong{font-size:13px}
#sound-start-dialog{text-align:center;width:420px}
#sound-start-dialog h2{margin:0 0 16px;font-size:28px}
#sound-start-description{margin:0 0 24px;color:#cfddd5;line-height:1.7}
.sound-start-actions{display:flex;gap:12px;margin-bottom:18px}
.sound-start-actions button{flex:1;width:auto;margin:0;padding:13px 16px;white-space:nowrap}
#sound-start-dialog small{color:#aebeaa;line-height:1.5}