.btn, button, input[type='submit']{ display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); border-radius: var(--radius-sm); border: 1px solid transparent; padding: 0.64rem 1.05rem; font-weight: 600; letter-spacing: 0.01em; line-height: 1.2; cursor: pointer; box-shadow: 0 1px 0 rgba(15, 23, 42, 0.08); transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.14s ease, box-shadow 0.2s ease; } .btn:active, button:active, input[type='submit']:active{ transform: translateY(1px); box-shadow: 0 1px 0 rgba(15, 23, 42, 0.05); } .btn:focus-visible, button:focus-visible, input[type='submit']:focus-visible{ outline: 3px solid var(--color-focus-ring); outline-offset: 3px; box-shadow: 0 0 0 6px rgba(8, 15, 25, 0.86); } .btn:disabled, button:disabled, input[type='submit']:disabled, .btn[aria-disabled='true']{ cursor: not-allowed; opacity: 0.65; filter: saturate(0.8); } .btn-primary, button, input[type='submit']{ background: linear-gradient(160deg, #4b5968 0%, #3c4857 100%); border-color: #34404e; color: var(--color-white); } .btn-primary:hover, button:hover, input[type='submit']:hover{ background: linear-gradient(160deg, #556577 0%, #42505f 100%); border-color: #2f3a46; box-shadow: 0 6px 12px rgba(31, 41, 51, 0.18); } .btn-secondary{ background: linear-gradient(160deg, #f3b45f 0%, #eea849 100%); border-color: #df983a; color: #102033; } .btn-secondary:hover{ background: linear-gradient(160deg, #f6bf70 0%, #f0af58 100%); border-color: #d88f30; color: #102033; box-shadow: 0 6px 12px rgba(238, 168, 73, 0.3); } .btn-outline{ background: var(--color-btn-outline-bg); border-color: var(--color-btn-outline-border); color: var(--color-btn-outline-text); } .btn-outline:hover{ background: var(--color-btn-outline-hover-bg); border-color: var(--color-btn-outline-hover-border); color: var(--color-btn-outline-hover-text); box-shadow: 0 4px 10px rgba(44, 55, 67, 0.14); } .card{ background: var(--color-bg-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); overflow: hidden; transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.16s ease; } .card:hover{ border-color: #c6d2dd; box-shadow: var(--shadow-md); transform: translateY(-1px); } .card-header{ padding: 0.8rem var(--space-4); border-bottom: 1px solid var(--color-border); background: var(--color-bg-soft); font-weight: 600; color: var(--color-primary-dark); } .card-body{ padding: var(--space-3); } .card-body> :last-child{ margin-bottom: 0; } details>summary:focus-visible{ outline: none; box-shadow: var(--shadow-focus); border-radius: var(--radius-sm); } .hero{ background: linear-gradient(140deg, #ffffff 0%, #fff4e6 100%); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: var(--space-7) var(--space-6); } .section-stack{ display: grid; gap: var(--space-4); } .section-stack>*{ margin-bottom: 0; } .page-hierarchy{ gap: var(--space-5); } .page-hierarchy>*{ margin-bottom: 0; } .section-surface{ border-radius: var(--radius-lg); } .section-surface--elevated{ border: 1px solid #d5e1ed; background: linear-gradient(165deg, #f4f8fc 0%, #ecf3fa 100%); } .section-surface--band{ border: 1px solid #d9e5f1; background: linear-gradient(180deg, #f8fbff 0%, #f2f7fc 100%); } .section-surface>.card-header, .section-surface>.card-body>h2, .section-surface>.card-body>h3, .servers-index-page>section>h2{ margin-bottom: var(--space-1); font-size: clamp(1.12rem, 1.7vw, 1.34rem); line-height: 1.24; } .section-surface>.card-header{ border-bottom-color: rgba(93, 121, 149, 0.16); } .section-surface>.card-body>p:last-child, .servers-index-page>section>p:last-child{ margin-bottom: 0; } .servers-index-page>section.section-surface{ padding: var(--space-3); } .servers-index-page>section.section-surface>h2{ margin-bottom: var(--space-2); } .game-hub-results__body{ display: grid; gap: var(--space-3); } .game-hub-results__body>*{ margin-bottom: 0; } .game-search{ display: grid; gap: var(--space-1); margin-bottom: var(--space-3); } .game-search[aria-busy='true']{ opacity: 0.75; } .game-search__subtitle{ margin-bottom: 0; color: var(--color-text-muted); font-size: 0.84rem; } .game-search__bar{ display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-2); padding: 0.65rem 0.75rem; border: 1px solid #d5dfeb; border-radius: var(--radius-md); background: linear-gradient(165deg, #f8fbff 0%, #f0f5fb 100%); box-shadow: var(--shadow-sm); transition: border-color var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) var(--motion-ease); } .game-search__bar:focus-within{ border-color: #b7c8da; box-shadow: 0 0 0 2px rgba(244, 107, 69, 0.12); } .game-search__field{ margin-bottom: 0; min-width: 8rem; flex: 0 0 auto; } .game-search__field--narrow{ min-width: 7.1rem; } .game-search input, .game-search select{ border-radius: var(--radius-sm); border-color: #c9d4de; background: #ffffff; padding: 0.5rem 0.65rem; min-height: 2.35rem; font-size: 0.92rem; transition: border-color var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) var(--motion-ease), background-color var(--motion-base) var(--motion-ease); } .game-search input:hover, .game-search select:hover{ border-color: #acbccb; background: #ffffff; } .game-search input:focus, .game-search select:focus{ border-color: var(--color-accent-orange); box-shadow: 0 0 0 3px rgba(238, 168, 73, 0.16); } .game-search__field--search{ flex: 1 1 15rem; min-width: 13rem; } .game-search__field--check{ display: flex; align-items: end; min-width: auto; } .game-search__field--check label{ display: inline-flex; align-items: center; gap: var(--space-2); margin-bottom: 0; } .game-search__field--check input[type='checkbox']{ width: auto; } .game-search__actions{ display: flex; gap: var(--space-2); align-items: center; margin-bottom: 0; margin-left: auto; flex: 0 0 auto; } .game-search__button{ white-space: nowrap; min-height: 2.35rem; } .game-search--toolbar .game-search__field>label{ font-size: 0.75rem; margin-bottom: 0.2rem; color: var(--color-text-muted); line-height: 1.1; } .server-badge-gold{ display: inline-flex; align-items: center; gap: 0.3rem; border-radius: 999px; padding: 0.16rem 0.58rem; border: 1px solid #c8961a; background: linear-gradient(135deg, #ffe58f 0%, #f3c84c 45%, #dca61d 100%); color: #3f2a00; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.01em; line-height: 1.1; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35); box-shadow: 0 0 0 1px rgba(255, 212, 118, 0.35), 0 0 10px rgba(224, 170, 42, 0.25); } .server-badge-gold__star{ color: #8c5e00; font-size: 0.76rem; line-height: 1; } .server-badge-gold__label{ white-space: nowrap; } .server-badge-gold--inline{ margin-left: 0.35rem; vertical-align: middle; } .state-message{ border-radius: var(--radius-md); border: 1px solid var(--color-border); padding: var(--space-4); } .flash-stack .state-message{ animation: flash-in 220ms var(--motion-ease) both; } .flash-stack{ display: grid; margin-bottom: var(--space-4); } .state-message[data-reward-earned='1']{ position: relative; overflow: hidden; } .state-message.is-reward-highlight{ animation: reward-earned-highlight 720ms var(--motion-ease) both; } .reward-earned-burst{ position: absolute; inset: -25%; pointer-events: none; border-radius: 999px; background: radial-gradient(circle, rgba(118, 182, 137, 0.28) 0%, rgba(118, 182, 137, 0.12) 35%, rgba(118, 182, 137, 0) 70%); animation: reward-earned-burst 820ms var(--motion-ease) both; } .reward-earned-badge{ position: absolute; top: 0.35rem; right: 0.45rem; pointer-events: none; border-radius: var(--radius-pill); padding: 0.16rem 0.5rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.02em; color: #1f3b2a; background: #dcf3e4; border: 1px solid #99c8a8; box-shadow: 0 6px 14px rgba(44, 90, 58, 0.18); animation: reward-earned-badge 860ms var(--motion-ease) both; } .state-message>*:last-child{ margin-bottom: 0; } .tilt-plus-mark{ display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-pill); border: 1px solid #d9ab3a; background: linear-gradient(150deg, #ffe8a6 0%, #f2c560 100%); color: #6d4d07; font-size: 0.74rem; font-weight: 800; letter-spacing: 0.02em; line-height: 1.1; padding: 0.14rem 0.46rem; vertical-align: middle; white-space: nowrap; } .state-message--empty{ background: #fff8ef; border-color: #f2d7ae; } .state-message--loading{ background: linear-gradient(165deg, #f5f8fc 0%, #edf3f9 100%); border-color: #d3dee9; } .async-status{ width: 100%; align-items: flex-start; gap: var(--space-2); } .async-status__spinner{ margin-top: 0.15rem; margin-left: auto; flex: 0 0 auto; } .async-status__content{ flex: 1 1 auto; display: grid; gap: 0.15rem; min-width: 0; } .async-status__text{ color: #2f4255; font-weight: 600; line-height: 1.35; } .async-status__stage{ color: var(--color-text-muted); font-size: 0.82rem; line-height: 1.25; } .async-status__progress{ margin-top: var(--space-1); } .pagination{ display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); } .pagination p{ margin-bottom: 0; } .ad-banner-region{ margin-bottom: var(--space-3); } .ad-banner-region--primary-context{ margin-top: var(--space-1); margin-bottom: var(--space-3); } .ad-banner-slot{ display: flex; justify-content: center; align-items: center; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: linear-gradient(165deg, #fafcfe 0%, #f2f7fc 100%); padding: 0.42rem; } .ad-banner-slot__link{ display: inline-flex; align-items: center; justify-content: center; text-decoration: none; } .ad-banner-slot__image{ display: block; width: auto; max-width: min(100%, 728px); height: auto; max-height: 90px; border-radius: 0.3rem; } @media (max-width: 900px){.hero{ padding: var(--space-6) var(--space-4); max-width: 100%; box-sizing: border-box; } .page-hierarchy{ gap: var(--space-4); } .game-search__bar{ align-items: stretch; } .game-search__field{ flex: 1 1 calc(50% - var(--space-2)); min-width: 0; } .game-search__field--search{ flex: 1 1 100%; } .game-search__actions{ margin-left: 0; width: 100%; } .game-search__button{ flex: 1 1 auto; }} @media (max-width: 760px){.card, .card-body{ width: 100%; max-width: 100%; box-sizing: border-box; } .game-search__field{ flex: 1 1 100%; } .game-search__actions{ flex-wrap: wrap; }} .state-message--success{ background: linear-gradient(165deg, #e9f8f0 0%, #dff3e8 100%); border-color: #7ec4a0; } .state-message--error{ background: linear-gradient(165deg, #fff2ef 0%, #ffe8e2 100%); border-color: #eeb7ab; } .state-message--info{ background: linear-gradient(165deg, #f5f8fc 0%, #edf3f9 100%); border-color: #d3dee9; } .state-message--warning{ background: linear-gradient(165deg, #fff8ed 0%, #fff1df 100%); border-color: #efcc98; } .inline-link-row{ display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-bottom: 0; } .inline-link-row a{ display: inline-flex; align-items: center; border: 1px solid #d1dce8; border-radius: var(--radius-pill); background: #f3f7fc; color: #2f3d4d; font-size: 0.85rem; font-weight: 500; line-height: 1.1; padding: 0.34rem 0.7rem; transition: border-color var(--motion-base) var(--motion-ease), background-color var(--motion-base) var(--motion-ease), color var(--motion-base) var(--motion-ease), box-shadow var(--motion-base) var(--motion-ease); } .inline-link-row a:hover{ border-color: #bfcedf; background: #ebf2f9; } .inline-link-row a:focus-visible{ outline: none; box-shadow: var(--shadow-focus); } .inline-link-row .server-list-intro__updates-link{ border-color: #d88f30; background: linear-gradient(160deg, #f3b45f 0%, #eea849 100%); color: #172331; font-weight: 700; box-shadow: 0 8px 14px rgba(238, 168, 73, 0.18); } .inline-link-row .server-list-intro__updates-link:hover{ border-color: #d18427; background: linear-gradient(160deg, #f6bf70 0%, #f0af58 100%); color: #172331; } .taxonomy-seo-block{ margin-top: var(--space-2); } .taxonomy-seo-block__body{ display: grid; gap: var(--space-2); } .taxonomy-seo-block__title{ margin-bottom: 0; font-size: clamp(1.14rem, 1.8vw, 1.38rem); line-height: 1.25; } .taxonomy-seo-block__body h3{ margin-bottom: 0; margin-top: var(--space-1); font-size: 1.02rem; line-height: 1.3; color: var(--color-primary-dark); } .taxonomy-seo-block__body p, .taxonomy-seo-block__body li{ line-height: 1.5; } .taxonomy-seo-block__body ul, .taxonomy-seo-block__body ol{ margin-top: 0; margin-bottom: 0; padding-left: 1.2rem; } .taxonomy-seo-block__context-links{ margin-bottom: 0; color: var(--color-text-muted); font-size: 0.9rem; } .taxonomy-seo-block__context-links a{ font-weight: 600; } .taxonomy-compact-nav{ margin-top: var(--space-2); display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: var(--space-2); } @keyframes flash-in{ from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } } @keyframes reward-earned-highlight{ 0% { transform: translateY(0); } 30% { transform: translateY(-1px); } 100% { transform: translateY(0); } } @keyframes reward-earned-burst{ from { opacity: 0.75; transform: scale(0.5); } to { opacity: 0; transform: scale(1.15); } } @keyframes reward-earned-badge{ 0% { opacity: 0; transform: translateY(6px) scale(0.92); } 20% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 0; transform: translateY(-8px) scale(1.02); } } @keyframes credit-reward-pulse{ 0%, 100% { opacity: 1; } 50% { opacity: 0.72; } } @media (prefers-reduced-motion: reduce){.state-message.is-reward-highlight{ animation: none; } .reward-earned-burst, .reward-earned-badge{ animation: none; display: none; } .credit-emphasis--reward{ animation: none; }} .sr-only{ border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .site-breadcrumbs{ margin-bottom: var(--space-3); } .site-breadcrumbs__list{ display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.55rem; margin: 0; padding: 0; list-style: none; color: var(--color-text-muted); font-size: 0.84rem; } .site-breadcrumbs__item{ display: inline-flex; align-items: center; gap: 0.55rem; } .site-breadcrumbs__item:not(:last-child)::after{ content: '/'; color: #a7b4c2; } .site-breadcrumbs__link{ color: #48617b; text-decoration: none; } .site-breadcrumbs__link:hover{ color: #2e4359; text-decoration: underline; text-underline-offset: 0.14em; } .site-breadcrumbs__current{ color: #42576c; font-weight: 600; } .server-banner{ width: 468px; height: 60px; max-width: 100%; object-fit: cover; display: block; } .server-ip-copy-block{ display: grid; gap: 0.45rem; } .ip-copy-popup{ position: absolute; z-index: 1200; width: min(24rem, calc(100vw - 1.5rem)); border: 1px solid #cfd9e3; border-radius: var(--radius-md); background: linear-gradient(165deg, #f8fbff 0%, #eef4fa 100%); box-shadow: 0 16px 30px rgba(31, 41, 51, 0.18); padding: 0.7rem; } .ip-copy-popup__body{ display: grid; gap: 0.58rem; } .ip-copy-popup__message{ margin: 0; font-size: 0.9rem; line-height: 1.45; color: #2f3d4d; font-weight: 600; } .ip-copy-popup__title, .ip-copy-popup__subtext, .ip-copy-popup__microtext{ display: block; } .ip-copy-popup__title{ font-size: 0.94rem; font-weight: 700; line-height: 1.22; color: #223548; } .ip-copy-popup__subtext{ margin-top: 0.22rem; font-size: 0.84rem; font-weight: 500; line-height: 1.4; color: #304458; } .ip-copy-popup__subtext strong{ font-weight: 700; } .ip-copy-popup__microtext{ margin-top: 0.18rem; font-size: 0.74rem; font-weight: 500; line-height: 1.35; color: #5b6d80; } .ip-copy-popup__actions{ display: flex; flex-wrap: wrap; gap: 0.38rem; } .ip-copy-popup__action{ min-height: 2.05rem; padding: 0.34rem 0.7rem; font-size: 0.82rem; } .ip-copy-popup--guest .ip-copy-popup__actions{ gap: 0.44rem; } .ip-copy-popup--guest [data-copy-popup-register]{ font-weight: 700; } .ip-copy-popup--guest [data-copy-popup-share]{ opacity: 0.9; } .ip-copy-popup__action[hidden]{ display: none !important; } .credit-emphasis{ display: inline-flex; align-items: center; border-radius: var(--radius-pill); padding: 0.06rem 0.5rem; margin: 0 0.08rem; font-weight: 700; line-height: 1.25; white-space: nowrap; } .credit-emphasis--reward{ color: #104530; border: 1px solid #90c9a7; background: linear-gradient(165deg, #eaf8ef 0%, #dff1e7 100%); box-shadow: 0 0 0 0 rgba(67, 158, 104, 0.34); animation: credit-reward-pulse 1.4s ease-out 1; } .faq-accordion{ display: grid; gap: clamp(0.75rem, 1.4vw, 1rem); width: 100%; max-width: 100%; box-sizing: border-box; } .faq-accordion__item{ border: 1px solid rgba(91, 116, 143, 0.62); border-radius: var(--radius-md); background: linear-gradient(145deg, rgba(31, 49, 68, 0.94) 0%, rgba(20, 35, 52, 0.96) 100%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 12px 28px rgba(5, 12, 22, 0.2); overflow: hidden; transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; } .faq-accordion__item:hover{ border-color: rgba(243, 180, 95, 0.52); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 16px 34px rgba(5, 12, 22, 0.28), 0 0 20px rgba(243, 180, 95, 0.12); transform: translateY(-2px); } .faq-accordion__item[open]{ border-color: rgba(243, 180, 95, 0.78); box-shadow: inset 3px 0 0 rgba(245, 123, 87, 0.78), inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 16px 36px rgba(5, 12, 22, 0.3); } .faq-accordion__item[open] .faq-accordion__icon{ border-color: rgba(243, 180, 95, 0.68); background: linear-gradient(155deg, rgba(66, 48, 35, 0.92) 0%, rgba(41, 46, 56, 0.95) 100%); color: #f7c36d; } .faq-accordion__summary{ list-style: none; cursor: pointer; display: grid; grid-template-columns: 3rem minmax(0, 1fr) 1.25rem; align-items: center; gap: clamp(0.85rem, 1.8vw, 1.25rem); width: 100%; min-height: 4.1rem; margin: 0; padding: clamp(0.85rem, 1.8vw, 1.15rem) clamp(1rem, 2vw, 1.35rem); color: #f3f7fb; font-weight: 700; box-sizing: border-box; } .faq-accordion__summary::-webkit-details-marker{ display: none; } .faq-accordion__summary:focus-visible{ outline: 2px solid rgba(243, 180, 95, 0.72); outline-offset: 3px; } .faq-accordion__icon{ display: inline-grid; place-items: center; width: 3rem; height: 3rem; border: 1px solid rgba(121, 148, 178, 0.5); border-radius: var(--radius-sm); background: linear-gradient(155deg, rgba(44, 61, 78, 0.74) 0%, rgba(24, 39, 57, 0.86) 100%); color: #f3b45f; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04); box-sizing: border-box; } .faq-accordion__icon .ui-icon{ width: 1.35rem; height: 1.35rem; } .faq-accordion__question{ min-width: 0; margin: 0; color: #f3f7fb; font-size: clamp(1.04rem, 1.7vw, 1.28rem); line-height: 1.25; font-weight: 700; letter-spacing: 0.01em; overflow-wrap: anywhere; } .faq-accordion__caret{ position: relative; display: block; width: 1.1rem; height: 1.1rem; flex: 0 0 auto; margin-right: 0; border: 0; color: #eaf1f8; transition: transform 180ms ease, color 180ms ease; } .faq-accordion__caret::before{ content: ''; position: absolute; inset: 0.18rem; border-right: 0.16rem solid currentColor; border-bottom: 0.16rem solid currentColor; transform: rotate(45deg); } .faq-accordion__item[open] .faq-accordion__caret{ color: #f3b45f; transform: rotate(180deg); } .faq-accordion__content{ margin: 0 clamp(1rem, 2vw, 1.35rem) clamp(1rem, 2vw, 1.25rem) calc(clamp(1rem, 2vw, 1.35rem) + 4.25rem); padding-top: clamp(0.85rem, 1.6vw, 1rem); border-top: 1px solid rgba(121, 148, 178, 0.28); } .faq-accordion__answer{ max-width: 56rem; margin: 0; color: #b7c7d6; font-size: clamp(0.98rem, 1.35vw, 1.08rem); line-height: 1.65; } @media (max-width: 760px){.faq-accordion__summary{ grid-template-columns: 2.65rem minmax(0, 1fr) 1rem; min-height: 3.85rem; padding: 0.8rem 0.85rem; gap: 0.75rem; } .faq-accordion__icon{ width: 2.65rem; height: 2.65rem; } .faq-accordion__icon .ui-icon{ width: 1.18rem; height: 1.18rem; } .faq-accordion__content{ margin: 0 0.85rem 0.95rem calc(0.85rem + 3.4rem); }} @media (prefers-reduced-motion: reduce){.faq-accordion__caret{ transition: none; }} .ui-inline{ display: inline-flex; align-items: center; gap: 0.45rem; } .ui-icon{ width: 1em; height: 1em; flex: 0 0 auto; } .ui-icon--sm{ width: 0.95em; height: 0.95em; } .game-accent{ --game-accent: var(--color-accent-coral); --game-accent-rgb: 244, 107, 69; } .card:hover{ border-color: #3a4d61; } .hero{ background: linear-gradient(140deg, #162334 0%, #1b2a3d 100%); } .section-surface--elevated{ border-color: #3d5670; background: linear-gradient(165deg, #1b2d40 0%, #17293b 100%); } .section-surface--band{ border-color: #3f5670; background: linear-gradient(180deg, #1a2b3f 0%, #162739 100%); } .section-surface>.card-header{ border-bottom-color: rgba(116, 144, 172, 0.22); } .game-search__bar{ border-color: #32465b; background: linear-gradient(165deg, #182738 0%, #142232 100%); } .game-search__bar:focus-within{ border-color: #57718e; } .game-search input, .game-search select{ border-color: #3a5168; background: #101c2a; color: var(--color-text-primary); } .game-search input:hover, .game-search select:hover{ border-color: #5a7591; background: #132131; } .state-message--success{ background: linear-gradient(165deg, #143427 0%, #173d2d 100%); border-color: #2c7f5b; } .state-message--error{ background: linear-gradient(165deg, #3a1f23 0%, #452428 100%); border-color: #8b4a50; } .state-message--info, .state-message--loading{ background: linear-gradient(165deg, #17273a 0%, #152436 100%); border-color: #3b5268; } .state-message--warning, .state-message--empty{ background: linear-gradient(165deg, #3b2e1f 0%, #463523 100%); border-color: #8b6a44; } .btn-secondary{ background: linear-gradient(160deg, #d8a14e 0%, #c68638 100%); border-color: #b7772d; color: #102033; } .btn-secondary:hover{ background: linear-gradient(160deg, #e0ad60 0%, #cf9247 100%); border-color: #c08137; color: #102033; box-shadow: 0 6px 12px rgba(207, 146, 71, 0.28); } .tilt-plus-mark{ border-color: #a6802e; color: #f6dfaa; background: linear-gradient(150deg, #6f541b 0%, #9d7423 100%); } .inline-link-row a{ border-color: #3a5168; background: #1a2b3d; color: #d7e2ee; } .inline-link-row a:hover{ border-color: #5d7894; background: #22364b; } .inline-link-row .server-list-intro__updates-link{ border-color: #c08137; background: linear-gradient(160deg, #e0ad60 0%, #cf9247 100%); color: #101923; box-shadow: 0 8px 14px rgba(207, 146, 71, 0.24); } .inline-link-row .server-list-intro__updates-link:hover{ border-color: #d19a4f; background: linear-gradient(160deg, #e8ba73 0%, #d9a056 100%); color: #101923; } .taxonomy-seo-block__body h3{ color: #dce8f3; } .taxonomy-seo-block__context-links{ color: #a7bbcf; } .ad-banner-slot{ border-color: #3a5168; background: linear-gradient(165deg, #1a2a3c 0%, #162536 100%); } .btn:focus-visible, button:focus-visible, input[type='submit']:focus-visible, .btn-secondary:focus-visible, .btn-outline:focus-visible{ outline: 3px solid #7dd3fc; outline-offset: 3px; box-shadow: 0 0 0 6px rgba(8, 15, 25, 0.86), 0 0 0 8px rgba(125, 211, 252, 0.28); } .ip-copy-popup__chooser{ display: grid; gap: 0.5rem; } .ip-copy-popup__chooser[hidden]{ display: none; } .ip-copy-popup__choice{ display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.55rem; align-items: center; padding: 0.55rem; border: 1px solid #d4dee8; border-radius: var(--radius-sm); background: rgba(255, 255, 255, 0.72); } .ip-copy-popup__choice-text{ display: grid; min-width: 0; gap: 0.18rem; } .ip-copy-popup__choice-label{ color: #223548; font-size: 0.84rem; font-weight: 700; line-height: 1.2; } .ip-copy-popup__choice-address{ display: block; min-width: 0; overflow-wrap: anywhere; color: #425267; font-size: 0.82rem; line-height: 1.25; } .ip-copy-popup__choice-button{ min-height: 2rem; padding: 0.32rem 0.58rem; font-size: 0.78rem; white-space: nowrap; } @media (max-width: 420px){.ip-copy-popup__choice{ grid-template-columns: 1fr; } .ip-copy-popup__choice-button{ width: 100%; }}
