.migration-page { max-width: 1060px; margin: auto; padding: 20px 16px 42px; color: #dce5d7; }
.migration-hero { text-align: center; padding: 35px 15px 38px; border-bottom: 1px solid #35452c; background: radial-gradient(ellipse at 50% 20%,#3e712323,transparent 65%); }
.migration-kicker { color: #9baf82; font-size: 10px; letter-spacing: 2px; line-height: 1.7; }
.migration-hero h1 { margin: 15px 0; color: #dfe4c7; font: 400 clamp(30px,5vw,45px)/1.3 Cinzel,serif; }
.migration-hero p { font-size: 15px; line-height: 1.8; color: #b2c1ad; }
.migration-requirement { display: inline-block; margin-top: 14px; padding: 10px 17px; border: 1px solid #6ca14766; color: #aec4a1; background: #52872f12; font-size: 11px; letter-spacing: .7px; }
.migration-requirement strong { color: #9be767; }
.migration-intro { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 30px 0; }
.migration-intro > div:first-child { max-width: 600px; }
.migration-page h2 { margin: 0 0 12px; color: #e1dfc3; font: 400 22px/1.4 Cinzel,serif; }
.migration-intro p,.migration-contact p { color: #aebda8; font-size: 14px; line-height: 1.8; margin: 0; }
.migration-intro p strong { color: #b0e28b; }
.migration-vip { flex: 0 0 210px; text-align: center; border-left: 1px solid #35452c; padding-left: 25px; }
.migration-vip > span { display: block; color: #94a28b; font-size: 11px; margin-top: 8px; }
.migration-hint { color: #97a98e; font-size: 12px; margin: 0 0 16px; }
.migration-packs { display: grid; grid-template-columns: 1.25fr 1fr; gap: 22px; }
.migration-pack { padding: 25px; border: 1px solid #384d30; background: linear-gradient(145deg,#0c1c10,#040c07); }
.migration-pack-master { border-top: 2px solid #a59958; }
.migration-pack-users { border-top: 2px solid #75ad47; }
.migration-pack header { padding-bottom: 20px; border-bottom: 1px solid #34452a; }
.migration-pack header h2 { margin: 8px 0; }
.migration-pack header p { color: #acbca4; font-size: 13px; margin: 0; }
.migration-set { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 22px 0; }
.migration-item { min-width: 0; text-align: center; }
.migration-item-button { display: flex; flex-direction: column; align-items: center; width: 100%; padding: 8px; border: 1px solid #3c51302e; background: #0003; color: #cbd9be; font: inherit; cursor: pointer; }
.migration-item-button:hover,.migration-item-button:focus-visible,.migration-item-button[aria-expanded="true"] { outline: 1px solid #87b45c; outline-offset: 2px; background: #5b8d2720; }
.migration-icon { display: block; width: 86px; max-width: 100%; aspect-ratio: 1; background-image: url('../img/migration-items.png'); background-size: 400% 200%; background-repeat: no-repeat; }
.migration-icon-0 { background-position: 0% 0%; }.migration-icon-1 { background-position: 33.333333% 0%; }.migration-icon-2 { background-position: 66.666667% 0%; }.migration-icon-3 { background-position: 100% 0%; }
.migration-icon-4 { background-position: 0% 100%; }.migration-icon-5 { background-position: 33.333333% 100%; }.migration-icon-6 { background-position: 66.666667% 100%; }.migration-icon-7 { background-position: 100% 100%; }
.migration-item-name { display: block; font-size: 11px; line-height: 1.5; margin-top: 9px; }
.migration-master-wings { display: grid; grid-template-columns: 115px 1fr; gap: 18px; align-items: center; border-top: 1px solid #34452a; padding-top: 18px; }
.migration-master-wings p { font-size: 13px; line-height: 1.8; margin: 0; }.migration-master-wings p strong { color: #d5d6b4; }.migration-master-wings p span { display: block; color: #9bae8f; font-size: 12px; }
.migration-user-items { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; padding: 30px 0 24px; }.migration-user-items .migration-icon { width: 140px; }.migration-user-items .migration-item-name { font-size: 13px; }
.migration-box-note { color: #aebda5; font-size: 13px; line-height: 1.9; }.migration-box-note strong { color: #a1dc77; }
.migration-vip .migration-item-button { background: transparent; border: 0; }.migration-vip .migration-icon { width: 58px; }.migration-vip .migration-item-name { color: #ddcf8c; font-size: 16px; }
.migration-contact { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 28px; padding: 25px 0; border-top: 1px solid #35452c; }.migration-contact h2 { font-size: 20px; }
.migration-contact a { flex-shrink: 0; display: inline-flex; align-items: center; gap: 25px; padding: 14px 18px; border: 1px solid #75a94c; color: #baf58b !important; background: #31551e40; font-size: 11px; letter-spacing: .8px; text-decoration: none; }.migration-contact a:hover,.migration-contact a:focus-visible { background: #31551e90; outline: 1px solid #abdf78; outline-offset: 3px; }
.migration-tooltip { position: fixed; z-index: 10000; width: 275px; max-width: calc(100vw - 24px); max-height: calc(100vh - 24px); overflow-y: auto; padding: 15px 12px; border: 2px solid #000; background: rgba(0,0,0,.95); box-shadow: 0 0 0 1px #67705a77,0 8px 28px #000b; font: 12px/1.7 Arial,sans-serif; text-align: center; pointer-events: none; }
.migration-tooltip[hidden] { display: none; }.migration-tooltip strong { display: block; color: #38f38a; font-size: 12px; margin-bottom: 7px; }.migration-tooltip .migration-tip-gold { color: #eed04d; }.migration-tip-type { display: block; color: #ddd; margin-bottom: 10px; }.migration-tip-option { display: block; color: #7ba9ef; }
@media(max-width: 760px) { .migration-packs { grid-template-columns: 1fr; }.migration-intro { flex-direction: column; align-items: stretch; gap: 20px; }.migration-vip { flex-basis: auto; border-left: 0; padding: 12px 0; border-top: 1px solid #35452c; }.migration-contact { flex-direction: column; align-items: flex-start; }.migration-pack { padding: 20px 16px; }.migration-set { gap: 8px; }.migration-item-button { padding: 6px; } }
@media(prefers-reduced-motion: reduce) { .migration-item-button { transition: none; } }
