:root {
    --gy-bg: #f7f7f5;
    --gy-surface: #fffaf6;
    --gy-surface-strong: #ffffff;
    --gy-ink: #171513;
    --gy-muted: #706a65;
    --gy-line: rgba(76, 59, 48, .12);
    --gy-gold: #ef6500;
    --gy-gold-strong: #cf4f00;
    --gy-gold-soft: #fff0e5;
    --gy-green: #188351;
    --gy-danger: #be3f34;
    --gy-shadow: 0 18px 55px rgba(67, 42, 24, .1);
    --gy-radius: 24px;
    --gy-shell-width: 480px;
    --gy-app-bar-height: 82px;
}

html {
    background: var(--gy-bg);
}

body.gy-user-body,
body.gy-auth-body {
    margin: 0;
    min-height: 100vh;
    color: var(--gy-ink);
    background:
        radial-gradient(circle at 18% -10%, rgba(255, 199, 157, .28), transparent 30%),
        linear-gradient(180deg, #fff 0%, var(--gy-bg) 48%, #f5f2ef 100%);
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: geometricPrecision;
    letter-spacing: 0;
}

.gy-auth-card :where(h1, h2, h3, h4, h5, h6, p, a, button, label, span, strong, b, input),
.gy-topbar :where(h1, h2, h3, h4, h5, h6, p, a, button, label, span, strong, b),
.gy-content :where(h1, h2, h3, h4, h5, h6, p, a, button, label, span, strong, b, input),
.gy-page :where(h1, h2, h3, h4, h5, h6, p, a, button, label, span, strong, b, input, select, textarea),
.gy-bottom-nav :where(a, span) {
    font-family: inherit;
    font-weight: 400;
}

.gy-shell {
    position: relative;
    width: min(100%, var(--gy-shell-width));
    min-height: 100vh;
    margin: 0 auto;
    padding-bottom: calc(92px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .72);
}

[data-gy-app-view] {
    min-height: calc(100vh - var(--gy-app-bar-height) - 92px);
    outline: none;
}

[data-gy-app-view][data-gy-context="guest"] {
    display: grid;
    width: 100%;
    min-height: auto;
    place-items: center;
}

[data-gy-app-view][aria-busy="true"] {
    pointer-events: none;
}

.gy-app-bar {
    position: sticky;
    top: 0;
    z-index: 45;
    display: grid;
    min-height: calc(var(--gy-app-bar-height) + env(safe-area-inset-top));
    grid-template-columns: 48px minmax(0, 1fr) 48px;
    align-items: center;
    gap: 12px;
    padding: calc(12px + env(safe-area-inset-top)) 18px 12px;
    border-bottom: 1px solid rgba(76, 59, 48, .08);
    background: rgba(255, 255, 255, .9);
    backdrop-filter: blur(18px);
}

.gy-app-bar-button {
    display: grid;
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: #fff;
    color: var(--gy-ink);
    box-shadow: 0 8px 24px rgba(67, 42, 24, .07);
    cursor: pointer;
}

.gy-app-bar-button svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.75;
}

.gy-app-identity {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
}

.gy-app-logo {
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 8px 22px rgba(67, 42, 24, .14);
}

.gy-app-identity-copy {
    min-width: 0;
}

.gy-app-identity-copy span,
.gy-app-identity-copy strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-app-identity-copy span {
    color: var(--gy-muted);
    font-size: 12px;
}

.gy-app-identity-copy strong {
    margin-top: 2px;
    color: var(--gy-ink);
    font-size: 16px;
    font-weight: 600;
}

.gy-drawer {
    position: fixed;
    inset: 0;
    z-index: 2200;
    visibility: hidden;
    pointer-events: none;
}

.gy-drawer.is-open {
    visibility: visible;
    pointer-events: auto;
}

.gy-drawer-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: rgba(22, 17, 13, .4);
    opacity: 0;
    transition: opacity .2s ease;
    backdrop-filter: blur(3px);
}

.gy-drawer.is-open .gy-drawer-backdrop {
    opacity: 1;
}

.gy-drawer-panel {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    display: flex;
    width: min(86vw, 340px);
    flex-direction: column;
    padding: calc(18px + env(safe-area-inset-top)) 18px calc(18px + env(safe-area-inset-bottom));
    background: #fff;
    box-shadow: 26px 0 70px rgba(41, 24, 13, .2);
    transform: translateX(-102%);
    transition: transform .24s ease;
}

.gy-drawer.is-open .gy-drawer-panel {
    transform: translateX(0);
}

.gy-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--gy-line);
}

.gy-drawer-links {
    display: grid;
    gap: 4px;
    padding: 18px 0;
}

.gy-drawer-links a,
.gy-drawer-logout button {
    display: flex;
    min-height: 48px;
    width: 100%;
    align-items: center;
    border: 0;
    border-radius: 15px;
    background: transparent;
    color: var(--gy-ink);
    padding: 0 14px;
    font: inherit;
    font-size: 14px;
    text-align: left;
    cursor: pointer;
}

.gy-drawer-links a:hover,
.gy-drawer-links a:focus-visible {
    background: var(--gy-gold-soft);
    color: var(--gy-gold-strong);
}

.gy-drawer-logout {
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--gy-line);
}

.gy-drawer-logout button {
    color: var(--gy-danger);
}

.gy-drawer-panel {
    width: min(90vw, 360px);
    overflow: hidden;
    border-radius: 0 28px 28px 0;
    background: #faf8f6;
    padding: calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom));
}

.gy-drawer-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    align-items: start;
    gap: 10px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 23px;
    background:
        radial-gradient(circle at 96% 0%, rgba(255, 226, 205, .27), transparent 36%),
        linear-gradient(145deg, #fb7418, #e95805 58%, #cc4500);
    padding: 15px;
    color: #fff;
    box-shadow: 0 13px 27px rgba(190, 63, 0, .2);
}

.gy-drawer-head::after {
    position: absolute;
    right: -45px;
    bottom: -70px;
    width: 145px;
    height: 145px;
    border: 25px solid rgba(255, 255, 255, .055);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.gy-drawer-account,
.gy-drawer-close {
    position: relative;
    z-index: 1;
}

.gy-drawer-account {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.gy-drawer-logo {
    width: 50px;
    height: 50px;
    border: 2px solid rgba(255, 255, 255, .62);
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 7px 17px rgba(91, 24, 0, .2);
}

.gy-drawer-account > div {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.gy-drawer-account span {
    color: rgba(255, 255, 255, .72);
    font-size: 9px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.gy-drawer-account strong {
    overflow: hidden;
    color: #fff;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-drawer-account small {
    display: flex;
    align-items: center;
    gap: 5px;
    color: rgba(255, 255, 255, .8);
    font-size: 8px;
}

.gy-drawer-account small i {
    width: 6px;
    height: 6px;
    border: 1px solid rgba(255, 255, 255, .6);
    border-radius: 50%;
    background: #58d594;
}

.gy-drawer-close {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 14px;
    background: rgba(103, 25, 0, .16);
    color: #fff;
    cursor: pointer;
}

.gy-drawer-close svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.gy-drawer-links {
    display: block;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 1px 10px;
    scrollbar-width: thin;
    scrollbar-color: rgba(218, 77, 0, .2) transparent;
}

.gy-drawer-group + .gy-drawer-group {
    margin-top: 13px;
}

.gy-drawer-group > p {
    margin: 0 8px 6px;
    color: #a08373;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.gy-drawer-links .gy-drawer-group > a {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 18px;
    min-height: 57px;
    align-items: center;
    gap: 10px;
    margin-top: 5px;
    border: 1px solid transparent;
    border-radius: 17px;
    background: transparent;
    padding: 7px 9px;
    color: #2a211d;
}

.gy-drawer-links .gy-drawer-group > a:hover,
.gy-drawer-links .gy-drawer-group > a:focus-visible {
    border-color: rgba(218, 77, 0, .1);
    background: #fff4ec;
    color: #c84600;
}

.gy-drawer-links .gy-drawer-group > a.is-active {
    border-color: rgba(218, 77, 0, .13);
    background: linear-gradient(105deg, #fff0e5, #fff9f5);
    color: #c84600;
    box-shadow: 0 7px 18px rgba(74, 38, 17, .06);
}

.gy-drawer-link-icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 13px;
    background: #fff0e6;
    color: #da4d00;
}

.gy-drawer-links a.is-active .gy-drawer-link-icon {
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
    box-shadow: 0 7px 16px rgba(218, 77, 0, .19);
}

.gy-drawer-link-icon svg,
.gy-drawer-logout-icon svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gy-drawer-link-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.gy-drawer-link-copy strong {
    overflow: hidden;
    color: currentColor;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-drawer-link-copy small {
    overflow: hidden;
    color: #94847b;
    font-size: 8px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-drawer-chevron {
    color: #b19889;
    font-size: 20px;
    line-height: 1;
    text-align: center;
}

.gy-drawer-logout {
    margin-top: 0;
    border-top: 1px solid #eadfd9;
    padding: 10px 1px 0;
}

.gy-drawer-logout button {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 18px;
    min-height: 55px;
    gap: 10px;
    border: 1px solid rgba(190, 63, 52, .12);
    border-radius: 17px;
    background: #fff5f3;
    color: #b83c32;
    padding: 7px 9px;
    font-size: 11px;
    font-weight: 650;
}

.gy-drawer-logout-icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 13px;
    background: #ffe5e1;
}

.gy-drawer-logout button > span:last-child {
    color: #c8918c;
    font-size: 20px;
    text-align: center;
}

body.gy-user-body .gy-drawer-close:focus,
body.gy-user-body .gy-drawer-close:focus-visible {
    border-color: rgba(255, 255, 255, .6);
    outline: none !important;
    box-shadow: none !important;
}

body.gy-drawer-open {
    overflow: hidden;
}

.gy-impersonation-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #f1cc75;
    background: #fff3cd;
    color: #6f4d00;
    padding: 10px 18px;
    font-size: 13px;
}

.gy-impersonation-banner p {
    margin: 0;
}

.gy-impersonation-banner button {
    border: 0;
    border-radius: 10px;
    background: #6f4d00;
    color: #fff;
    padding: 8px 10px;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.gy-auth-page {
    background-image:
        linear-gradient(135deg, rgba(185, 130, 19, .04) 25%, transparent 25%),
        linear-gradient(315deg, rgba(185, 130, 19, .03) 25%, transparent 25%);
    background-position: 0 0;
    background-size: 28px 28px;
}

.gy-content {
    padding: 0 18px 24px;
}

.gy-page {
    min-height: 100vh;
    padding-bottom: 24px;
}

.gy-page-content {
    padding: 18px;
}

.gy-stack {
    display: grid;
    gap: 14px;
}

.gy-page-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px 10px;
}

.gy-page-back {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--gy-line);
    border-radius: 15px;
    background: rgba(255, 253, 248, .88);
    color: var(--gy-ink);
    box-shadow: 0 10px 22px rgba(78, 56, 18, .06);
}

.gy-page-back svg {
    width: 18px;
    height: 18px;
}

.gy-page-heading {
    min-width: 0;
}

.gy-page-heading p,
.gy-page-heading h1 {
    margin: 0;
}

.gy-page-heading p {
    color: var(--gy-muted);
    font-size: 12px;
}

.gy-page-heading h1 {
    color: var(--gy-ink);
    font-size: 20px;
    line-height: 1.2;
    font-weight: 600;
}

.gy-card {
    border: 1px solid var(--gy-line);
    border-radius: 24px;
    background: var(--gy-surface-strong);
    padding: 16px;
    box-shadow: 0 12px 30px rgba(78, 56, 18, .07);
}

.gy-card-dark {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 26px;
    background:
        radial-gradient(circle at 90% 10%, rgba(255, 217, 112, .34), transparent 30%),
        linear-gradient(135deg, #171107, #3b2a0f 52%, #b47c10);
    color: #fff;
    padding: 18px;
    box-shadow: 0 18px 42px rgba(78, 56, 18, .2);
}

.gy-card-dark::before,
.gy-balance-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .46;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .07) 12.5%, transparent 12.5%, transparent 50%, rgba(255, 255, 255, .07) 50%, rgba(255, 255, 255, .07) 62.5%, transparent 62.5%, transparent 100%) 0 0 / 34px 34px,
        radial-gradient(circle at 20% 18%, rgba(255, 255, 255, .08) 0 1px, transparent 1.5px) 0 0 / 22px 22px;
    mix-blend-mode: screen;
}

.gy-card-dark > * {
    position: relative;
    z-index: 1;
}

.gy-card-title {
    margin: 0;
    color: var(--gy-ink);
    font-size: 17px;
    line-height: 1.25;
    font-weight: 600;
}

.gy-card-subtitle {
    margin: 5px 0 0;
    color: var(--gy-muted);
    font-size: 12px;
    line-height: 1.45;
}

.gy-muted {
    color: var(--gy-muted);
}

.gy-mini-label {
    color: var(--gy-muted);
    font-size: 11px;
    text-transform: uppercase;
}

.gy-value {
    color: var(--gy-ink);
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
}

.gy-form-card {
    display: grid;
    gap: 16px;
}

.gy-form-row {
    display: grid;
    gap: 8px;
}

.gy-select {
    width: 100%;
    min-height: 52px;
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: #fffefa;
    color: var(--gy-ink);
    padding: 0 14px;
    outline: none;
}

.gy-input-with-prefix,
.gy-input-with-suffix {
    position: relative;
}

.gy-input-prefix,
.gy-input-suffix {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gy-gold-strong);
    font-size: 14px;
}

.gy-input-prefix {
    left: 14px;
}

.gy-input-suffix {
    right: 14px;
}

.gy-input-with-prefix .gy-input {
    padding-left: 38px;
}

.gy-input-with-suffix .gy-input {
    padding-right: 44px;
}

.gy-amount-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.gy-amount-option {
    min-height: 48px;
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: #fffefa;
    color: var(--gy-ink);
    font: inherit;
    cursor: pointer;
}

.gy-note-card {
    display: grid;
    gap: 10px;
    border: 1px solid rgba(217, 166, 37, .22);
    border-radius: 20px;
    background: #fff8e4;
    padding: 14px;
}

.gy-note-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #5f4c29;
    font-size: 13px;
    line-height: 1.4;
}

.gy-note-row svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    color: var(--gy-gold-strong);
}

.gy-filter-strip {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 4px 0 2px;
    scrollbar-width: none;
}

.gy-filter-strip::-webkit-scrollbar {
    display: none;
}

.gy-filter {
    flex: 0 0 auto;
    border: 1px solid var(--gy-line);
    border-radius: 999px;
    background: rgba(255, 253, 248, .78);
    color: var(--gy-muted);
    padding: 9px 14px;
    font-size: 12px;
}

.gy-filter.is-active {
    border-color: #171107;
    background: #171107;
    color: var(--gy-gold);
}

.gy-list {
    display: grid;
    gap: 12px;
}

.gy-list-item {
    border: 1px solid var(--gy-line);
    border-radius: 20px;
    background: var(--gy-surface-strong);
    padding: 14px;
    box-shadow: 0 10px 24px rgba(78, 56, 18, .06);
}

.gy-list-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.gy-list-title {
    margin: 0;
    color: var(--gy-ink);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 500;
}

.gy-list-meta {
    margin: 4px 0 0;
    color: var(--gy-muted);
    font-size: 12px;
}

.gy-list-amount {
    flex: 0 0 auto;
    color: var(--gy-ink);
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    text-align: right;
}

.gy-list-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
}

.gy-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 11px;
    line-height: 1;
    text-transform: capitalize;
}

.gy-badge-success {
    background: rgba(24, 131, 81, .12);
    color: #126540;
}

.gy-badge-warning {
    background: rgba(217, 166, 37, .16);
    color: #8a5a08;
}

.gy-badge-danger {
    background: rgba(190, 63, 52, .12);
    color: var(--gy-danger);
}

.gy-badge-info {
    background: rgba(34, 158, 217, .12);
    color: #17769f;
}

.gy-empty {
    border: 1px dashed var(--gy-line);
    border-radius: 24px;
    background: rgba(255, 253, 248, .72);
    padding: 28px 18px;
    color: var(--gy-muted);
    text-align: center;
}

.gy-empty h3 {
    margin: 0;
    color: var(--gy-ink);
    font-size: 16px;
    font-weight: 500;
}

.gy-empty p {
    margin: 6px 0 0;
    font-size: 13px;
}

.gy-detail-grid {
    display: grid;
    gap: 10px;
}

.gy-mini-stat {
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: #fffaf0;
    padding: 12px 8px;
    text-align: center;
}

.gy-mini-stat label {
    display: block;
    color: var(--gy-muted);
    font-size: 11px;
    text-transform: uppercase;
}

.gy-mini-stat span {
    display: block;
    margin-top: 5px;
    color: var(--gy-ink);
    font-size: 14px;
    line-height: 1.2;
}

.gy-detail-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: #fffaf0;
    padding: 12px;
}

.gy-detail-row label {
    color: var(--gy-muted);
    font-size: 11px;
    text-transform: uppercase;
}

.gy-detail-row span,
.gy-detail-row div {
    color: var(--gy-ink);
    font-size: 14px;
    text-align: right;
}

.gy-small-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #fff8e4;
    color: #8a5a08;
    padding: 8px 12px;
    font-size: 12px;
}

.gy-menu-list {
    display: grid;
    gap: 10px;
}

.gy-menu-list form {
    margin: 0;
}

.gy-menu-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    border: 1px solid var(--gy-line);
    border-radius: 20px;
    background: var(--gy-surface-strong);
    box-shadow: 0 10px 24px rgba(78, 56, 18, .06);
    color: var(--gy-ink);
    padding: 12px;
    text-align: left;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.gy-menu-item:hover {
    border-color: rgba(185, 126, 14, .28);
    background: #fffdf8;
    box-shadow: 0 14px 30px rgba(78, 56, 18, .08);
    transform: translateY(-1px);
}

.gy-menu-left {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 12px;
}

.gy-menu-icon {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 16px;
    background: #171107;
    color: var(--gy-gold);
}

.gy-menu-icon .icon,
.gy-menu-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.gy-menu-label {
    overflow: hidden;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-profile-balance-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-top: 18px;
}

.gy-profile-balance-meta > div {
    display: grid;
    gap: 4px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 15px;
    background: rgba(255, 255, 255, .13);
    padding: 11px 12px;
}

.gy-profile-balance-meta span {
    color: rgba(255, 255, 255, .72);
    font-size: 9px;
}

.gy-profile-balance-meta strong {
    overflow: hidden;
    color: #fff;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-profile-quick-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-top: 13px;
}

.gy-profile-quick-actions a {
    display: flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: 14px;
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
}

.gy-profile-quick-actions a:first-child {
    background: #fff;
    color: #d94d00;
}

.gy-profile-quick-actions svg,
.gy-profile-row-icon svg,
.gy-profile-logout svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.gy-profile-section {
    display: grid;
    gap: 8px;
}

.gy-profile-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 3px;
}

.gy-profile-section-head h2 {
    margin: 0;
    color: #1f1815;
    font-size: 17px;
    font-weight: 650;
}

.gy-profile-section-head > span {
    color: #d94d00;
    font-size: 10px;
}

.gy-profile-card-list {
    overflow: hidden;
    border: 1px solid #eee5df;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(52, 34, 23, .05);
}

.gy-profile-row {
    display: grid;
    min-height: 70px;
    grid-template-columns: 42px minmax(0, 1fr) 20px;
    align-items: center;
    gap: 11px;
    color: #201916;
    padding: 10px 13px;
}

.gy-profile-row + .gy-profile-row {
    border-top: 1px solid #f0e9e5;
}

.gy-profile-row-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background: linear-gradient(145deg, #fff2e9, #ffe7d8);
    color: #dc5205;
}

.gy-profile-row-copy,
.gy-profile-row-copy strong,
.gy-profile-row-copy small {
    display: block;
    min-width: 0;
}

.gy-profile-row-copy strong {
    color: #211a17;
    font-size: 13px;
    font-weight: 600;
}

.gy-profile-row-copy small {
    overflow: hidden;
    margin-top: 3px;
    color: #817772;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-profile-chevron {
    color: #987a68;
    font-size: 24px;
    font-weight: 300;
    text-align: right;
}

.gy-profile-community {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.gy-profile-community > a {
    display: grid;
    justify-items: center;
    gap: 4px;
    border: 1px solid #eee5df;
    border-radius: 19px;
    background: #fff;
    color: #211a17;
    padding: 14px 8px;
    text-align: center;
    box-shadow: 0 8px 22px rgba(52, 34, 23, .05);
}

.gy-profile-community > a > span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
}

.gy-profile-community svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
    stroke: none;
}

.gy-profile-community strong {
    margin-top: 3px;
    font-size: 12px;
}

.gy-profile-community small {
    color: #827873;
    font-size: 9px;
}

.gy-profile-logout-form {
    margin-top: 3px;
}

.gy-profile-logout {
    display: flex;
    width: 100%;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(190, 63, 52, .18);
    border-radius: 16px;
    background: #fff8f7;
    color: #bd433b;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
}

.gy-menu-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #fff8e4;
    color: #8a5a08;
    padding: 8px 12px;
    font-size: 12px;
}

.gy-menu-icon.is-telegram {
    background: #229ed9;
    color: #fff;
}

.gy-menu-icon.is-whatsapp {
    background: #25d366;
    color: #fff;
}

.gy-menu-icon.is-whatsapp .icon,
.gy-menu-icon.is-telegram .icon {
    fill: currentColor;
    stroke: none;
}

.gy-menu-item.is-danger {
    border-color: rgba(190, 63, 52, .16);
}

.gy-menu-item.is-danger .gy-menu-icon {
    background: rgba(190, 63, 52, .1);
    color: var(--gy-danger);
}

.gy-menu-item.is-danger .gy-menu-label,
.gy-menu-item.is-danger .gy-menu-action {
    color: var(--gy-danger);
}

.gy-menu-item.is-danger .gy-menu-action {
    background: rgba(190, 63, 52, .08);
}

.gy-copy-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 16px;
    background: rgba(255, 255, 255, .1);
    padding: 12px;
}

.gy-copy-box span {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    color: #fff;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 12px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-copy-box .gy-small-action {
    min-width: 52px;
    flex: 0 0 auto;
    padding-right: 10px;
    padding-left: 10px;
}

.gy-upload-box {
    border: 1px dashed rgba(217, 166, 37, .58);
    border-radius: 20px;
    background: #fff8e4;
    padding: 18px;
    text-align: center;
}

.gy-upload-box label {
    display: grid;
    gap: 6px;
    place-items: center;
    cursor: pointer;
}

.gy-upload-box svg {
    width: 30px;
    height: 30px;
    color: #9b6509;
}

.gy-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.gy-tab {
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: rgba(255, 253, 248, .72);
    color: var(--gy-muted);
    padding: 11px 8px;
    font-size: 12px;
    text-align: center;
}

.gy-tab.is-active {
    border-color: #171107;
    background: #171107;
    color: var(--gy-gold);
}

.gy-auth-page {
    position: relative;
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 24px 18px;
    overflow: hidden;
}

.gy-auth-page::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 50% 0%, rgba(230, 177, 45, .42), transparent 34%),
        linear-gradient(145deg, rgba(22, 17, 8, .08), transparent 42%);
    pointer-events: none;
}

.gy-auth-card {
    position: relative;
    width: min(100%, 430px);
    border: 1px solid var(--gy-line);
    border-radius: 28px;
    background: rgba(255, 253, 248, .94);
    box-shadow: var(--gy-shadow);
    padding: 26px 20px 22px;
}

.gy-brand-lockup {
    display: flex;
    align-items: center;
    gap: 12px;
}

.gy-brand-mark {
    width: 54px;
    height: 54px;
    flex: 0 0 auto;
    border-radius: 18px;
    object-fit: cover;
    background: #1f1a10;
    box-shadow: 0 12px 28px rgba(76, 54, 14, .2);
}

.gy-auth-logo {
    width: 74px;
    height: 74px;
    margin: 0 auto 14px;
    border-radius: 22px;
    object-fit: cover;
    box-shadow: 0 14px 32px rgba(87, 62, 13, .18);
}

.gy-eyebrow {
    margin: 0;
    color: var(--gy-gold-strong);
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.gy-title {
    margin: 4px 0 0;
    color: var(--gy-ink);
    font-size: 26px;
    line-height: 1.08;
    font-weight: 600;
}

.gy-subtitle {
    margin: 8px 0 0;
    color: var(--gy-muted);
    font-size: 14px;
    line-height: 1.5;
}

.gy-form {
    display: grid;
    gap: 16px;
    margin-top: 22px;
}

.gy-field {
    display: grid;
    gap: 8px;
}

.gy-label {
    color: #3b2d14;
    font-size: 13px;
    font-weight: 500;
}

.gy-input-wrap {
    position: relative;
}

.gy-input-icon,
.gy-password-toggle {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    color: var(--gy-gold-strong);
}

.gy-input-icon {
    left: 7px;
}

.gy-password-toggle {
    right: 7px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.gy-input {
    width: 100%;
    min-height: 52px;
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: #fffefa;
    color: var(--gy-ink);
    padding: 0 16px 0 48px;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.gy-input-plain {
    padding-right: 16px;
    padding-left: 16px;
}

.gy-input:focus {
    border-color: rgba(217, 166, 37, .72);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(217, 166, 37, .16);
}

.gy-input-wrap .gy-input.gy-has-action {
    padding-right: 48px;
}

.gy-button {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(135deg, #171107, #4b3510 48%, var(--gy-gold));
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    box-shadow: 0 14px 28px rgba(88, 61, 12, .18);
    cursor: pointer;
}

.gy-button-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.9;
}

.gy-button-secondary {
    background: #fff8e4;
    color: #271d0b;
    border: 1px solid rgba(217, 166, 37, .35);
    box-shadow: none;
}

.gy-auth-switch {
    margin: 4px 0 0;
    color: var(--gy-muted);
    font-size: 14px;
    text-align: center;
}

.gy-auth-switch a,
.gy-link {
    color: #9b6509;
    font-weight: 500;
}

.gy-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 18px 12px;
}

.gy-topbar-meta {
    min-width: 0;
}

.gy-topbar-meta p,
.gy-topbar-meta h1 {
    margin: 0;
}

.gy-topbar-meta p {
    color: var(--gy-muted);
    font-size: 12px;
    font-weight: 500;
}

.gy-topbar-meta h1 {
    overflow: hidden;
    color: var(--gy-ink);
    font-size: 18px;
    line-height: 1.2;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-icon-button {
    display: grid;
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--gy-line);
    border-radius: 16px;
    background: rgba(255, 253, 248, .82);
    color: #3c2b0c;
    box-shadow: 0 10px 28px rgba(78, 56, 18, .08);
}

.gy-balance-card {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    background:
        radial-gradient(circle at 86% 20%, rgba(255, 230, 149, .52), transparent 30%),
        linear-gradient(135deg, #171107 0%, #3b2a0f 48%, #c8941c 100%);
    color: #fff;
    padding: 24px 22px;
    box-shadow: 0 22px 46px rgba(76, 54, 14, .22);
}

.gy-balance-card::after {
    content: "";
    position: absolute;
    right: -46px;
    bottom: -72px;
    z-index: 0;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    border: 34px solid rgba(255, 255, 255, .08);
}

.gy-card-label {
    margin: 0;
    color: rgba(255, 255, 255, .76);
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.gy-balance-head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.gy-balance-toggle {
    display: inline-grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 14px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.gy-balance-toggle:hover {
    border-color: rgba(255, 255, 255, .36);
    background: rgba(255, 255, 255, .18);
    transform: translateY(-1px);
}

.gy-eye-icon {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.gy-eye-closed,
html.gy-balances-hidden .gy-eye-open {
    display: none;
}

html.gy-balances-hidden .gy-eye-closed {
    display: block;
}

.gy-balance-amount {
    position: relative;
    z-index: 1;
    margin: 8px 0 22px;
    font-size: clamp(34px, 10vw, 46px);
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0;
}

.gy-balance-row {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.gy-stat-pill {
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 18px;
    background: rgba(255, 255, 255, .12);
    padding: 12px;
}

.gy-stat-pill span {
    display: block;
    color: rgba(255, 255, 255, .72);
    font-size: 11px;
    font-weight: 400;
}

.gy-stat-pill strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
}

.gy-section {
    margin-top: 22px;
}

.gy-plan-image-card {
    overflow: hidden;
    margin-top: 30px;
    border: 1px solid var(--gy-line);
    border-radius: 24px;
    background: var(--gy-surface-strong);
    box-shadow: 0 14px 34px rgba(78, 56, 18, .09);
}

.gy-plan-image-card img {
    display: block;
    width: 100%;
    height: auto;
}

.gy-section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.gy-section-head h2 {
    margin: 0;
    color: var(--gy-ink);
    font-size: 19px;
    font-weight: 600;
}

.gy-section-head a,
.gy-section-head span {
    color: #9b6509;
    font-size: 12px;
    font-weight: 500;
}

.gy-action-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.gy-action {
    display: flex;
    min-width: 0;
    min-height: 86px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid var(--gy-line);
    border-radius: 20px;
    background: var(--gy-surface-strong);
    color: var(--gy-ink);
    font: inherit;
    text-align: center;
    box-shadow: 0 12px 28px rgba(78, 56, 18, .07);
    cursor: pointer;
}

.gy-action-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 14px;
    background: var(--gy-gold-soft);
    color: #9b6509;
}

.gy-action span:last-child {
    max-width: 100%;
    overflow: hidden;
    font-size: 11px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-info-grid {
    display: grid;
    gap: 10px;
}

.gy-info-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid var(--gy-line);
    border-radius: 20px;
    background: var(--gy-surface-strong);
    padding: 14px;
    box-shadow: 0 10px 24px rgba(78, 56, 18, .06);
}

.gy-info-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 14px;
    background: #171107;
    color: var(--gy-gold);
}

.gy-info-card h3,
.gy-info-card p {
    margin: 0;
}

.gy-info-card h3 {
    color: var(--gy-ink);
    font-size: 14px;
    font-weight: 500;
}

.gy-info-card p {
    margin-top: 3px;
    color: var(--gy-muted);
    font-size: 12px;
    line-height: 1.45;
}

.gy-community-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.gy-community-card {
    position: relative;
    overflow: hidden;
    min-height: 126px;
    border: 1px solid var(--gy-line);
    border-radius: 24px;
    background: var(--gy-surface-strong);
    padding: 16px;
    box-shadow: 0 12px 28px rgba(78, 56, 18, .07);
}

.gy-community-card::after {
    content: "";
    position: absolute;
    right: -28px;
    bottom: -36px;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    opacity: .1;
}

.gy-community-icon {
    position: relative;
    z-index: 1;
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 18px;
    color: #fff;
    box-shadow: 0 12px 22px rgba(22, 17, 8, .12);
}

.gy-community-icon svg {
    width: 25px;
    height: 25px;
}

.gy-community-card h3,
.gy-community-card p {
    position: relative;
    z-index: 1;
    margin: 0;
}

.gy-community-card h3 {
    margin-top: 13px;
    color: var(--gy-ink);
    font-size: 15px;
    line-height: 1.2;
    font-weight: 500;
}

.gy-community-card p {
    margin-top: 4px;
    color: var(--gy-muted);
    font-size: 12px;
    line-height: 1.35;
}

.gy-community-telegram::after {
    background: #229ed9;
}

.gy-community-telegram .gy-community-icon {
    background: linear-gradient(135deg, #37b8ed, #168ac4);
}

.gy-community-whatsapp::after {
    background: #25d366;
}

.gy-community-whatsapp .gy-community-icon {
    background: linear-gradient(135deg, #35dc73, #118c46);
}

.gy-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 2100;
    background: rgba(18, 13, 5, .64);
}

.gy-modal-panel {
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 2101;
    width: min(90%, 390px);
    transform: translate(-50%, -50%);
    border: 1px solid var(--gy-line);
    border-radius: 24px;
    background: var(--gy-surface-strong);
    padding: 20px;
    box-shadow: 0 24px 70px rgba(18, 13, 5, .28);
}

.gy-announcement-overlay {
    border: 0;
    backdrop-filter: blur(5px);
    cursor: default;
}

.gy-announcement-panel {
    width: min(calc(100% - 28px), 420px);
    max-height: min(88vh, 720px);
    overflow-y: auto;
    border-color: rgba(218, 77, 0, .18);
    border-radius: 28px;
    background: #fff;
    padding: 20px;
    box-shadow: 0 28px 80px rgba(73, 35, 12, .3);
    scrollbar-width: thin;
    scrollbar-color: rgba(218, 77, 0, .35) transparent;
}

.gy-announcement-panel::before {
    position: absolute;
    top: 0;
    right: 26px;
    left: 26px;
    height: 4px;
    border-radius: 0 0 8px 8px;
    background: linear-gradient(90deg, #ff7a16, #d94d00);
    content: "";
}

.gy-announcement-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 11px;
}

.gy-announcement-head p,
.gy-announcement-head h3,
.gy-announcement-intro,
.gy-announcement-list p,
.gy-announcement-list strong,
.gy-announcement-list small {
    margin: 0;
}

.gy-announcement-head p {
    color: var(--gy-orange-deep);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.gy-announcement-head h3 {
    margin-top: 2px;
    color: var(--gy-ink);
    font-size: 22px;
    line-height: 1.15;
    font-weight: 700;
}

.gy-announcement-mark,
.gy-announcement-close {
    display: grid;
    place-items: center;
    border-radius: 14px;
}

.gy-announcement-mark {
    width: 42px;
    height: 42px;
    background: linear-gradient(145deg, #ff7a16, #d94d00);
    color: #fff;
    font-family: Georgia, serif;
    font-size: 24px;
    font-weight: 700;
    font-style: italic;
    box-shadow: 0 8px 20px rgba(218, 77, 0, .22);
}

.gy-announcement-close {
    width: 38px;
    height: 38px;
    border: 1px solid rgba(218, 77, 0, .12);
    background: #fff6ef;
    color: var(--gy-orange-deep);
}

.gy-announcement-close svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.gy-announcement-intro {
    margin-top: 13px;
    color: var(--gy-muted);
    font-size: 12px;
    line-height: 1.45;
}

.gy-announcement-list {
    display: grid;
    gap: 7px;
    margin-top: 14px;
}

.gy-announcement-list > div {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    min-height: 56px;
    border: 1px solid rgba(218, 77, 0, .1);
    border-radius: 17px;
    background: linear-gradient(105deg, #fff8f2, #fff);
    padding: 8px 11px;
}

.gy-announcement-list > div > span {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: rgba(238, 88, 0, .1);
    color: var(--gy-orange-deep);
}

.gy-announcement-list svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gy-announcement-list p {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.gy-announcement-list strong {
    color: var(--gy-ink);
    font-size: 13px;
    line-height: 1.25;
    font-weight: 650;
}

.gy-announcement-list small {
    color: var(--gy-muted);
    font-size: 11px;
    line-height: 1.3;
}

.gy-announcement-action {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 14px;
    border-radius: 16px;
    background: linear-gradient(135deg, #f87516, #d94d00);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 10px 22px rgba(218, 77, 0, .2);
}

.gy-announcement-action svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.gy-gift-modal-panel {
    width: min(calc(100% - 28px), 400px);
    overflow: hidden;
    border-color: rgba(218, 77, 0, .16);
    border-radius: 28px;
    background:
        radial-gradient(circle at 10% 0%, rgba(255, 211, 178, .28), transparent 34%),
        #fff;
    padding: 21px;
    box-shadow: 0 28px 80px rgba(73, 35, 12, .3);
}

.gy-gift-modal-panel::before {
    position: absolute;
    top: 0;
    right: 25px;
    left: 25px;
    height: 4px;
    border-radius: 0 0 8px 8px;
    background: linear-gradient(90deg, #ff7a16, #d94d00);
    content: "";
}

.gy-gift-modal-head {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 40px;
    align-items: start;
    gap: 12px;
}

.gy-gift-modal-head p,
.gy-gift-modal-head h3 {
    margin: 0;
}

.gy-gift-modal-head .gy-eyebrow {
    color: var(--gy-orange-deep);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
}

.gy-gift-modal-head h3 {
    margin-top: 2px;
    color: var(--gy-ink);
    font-size: 23px;
    line-height: 1.12;
    font-weight: 700;
}

.gy-gift-modal-head h3 + p {
    margin-top: 6px;
    color: var(--gy-muted);
    font-size: 12px;
    line-height: 1.4;
}

.gy-gift-modal-mark {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(145deg, #ff7a16, #d94d00);
    color: #fff;
    box-shadow: 0 9px 22px rgba(218, 77, 0, .22);
}

.gy-gift-modal-mark svg,
.gy-gift-modal-submit svg,
.gy-gift-code-input > svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gy-gift-modal-mark svg {
    width: 25px;
    height: 25px;
}

.gy-gift-modal-close {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(218, 77, 0, .18);
    border-radius: 14px;
    background: #fff5ed;
    color: #6b2b08;
    cursor: pointer;
}

.gy-gift-modal-close svg {
    display: block;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
}

.gy-gift-modal-form {
    gap: 15px;
    margin-top: 22px;
}

.gy-gift-modal-form .gy-label {
    color: var(--gy-ink);
    font-size: 12px;
    font-weight: 650;
}

.gy-gift-code-input {
    position: relative;
}

.gy-gift-code-input > svg {
    position: absolute;
    top: 50%;
    left: 15px;
    z-index: 1;
    width: 20px;
    height: 20px;
    transform: translateY(-50%);
    color: var(--gy-orange-deep);
    pointer-events: none;
}

.gy-gift-code-input .gy-input {
    min-height: 56px;
    border-color: rgba(218, 77, 0, .18);
    border-radius: 17px;
    background: #fffaf6;
    padding-right: 15px;
    padding-left: 46px;
    font-size: 14px;
    letter-spacing: .08em;
}

.gy-gift-code-input .gy-input:focus {
    border-color: rgba(218, 77, 0, .62);
    box-shadow: 0 0 0 4px rgba(239, 101, 0, .11);
}

.gy-gift-modal-form .gy-field > small {
    color: var(--gy-muted);
    font-size: 10px;
    line-height: 1.35;
}

.gy-gift-modal-submit {
    min-height: 54px;
    background: linear-gradient(135deg, #f87516, #d94d00);
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 12px 25px rgba(218, 77, 0, .22);
}

.gy-gift-modal-submit svg {
    width: 20px;
    height: 20px;
}

@media (max-height: 720px) {
    .gy-announcement-panel {
        max-height: calc(100vh - 24px);
        padding: 17px;
    }

    .gy-announcement-intro {
        display: none;
    }

    .gy-announcement-list {
        gap: 5px;
        margin-top: 11px;
    }

    .gy-announcement-list > div {
        min-height: 50px;
        padding-top: 6px;
        padding-bottom: 6px;
    }
}

.gy-bottom-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 50;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
    background: rgba(255, 253, 248, .88);
    border-top: 1px solid var(--gy-line);
    backdrop-filter: blur(18px);
}

.gy-bottom-nav-inner {
    display: grid;
    width: min(100%, var(--gy-shell-width));
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    margin: 0 auto;
}

.gy-nav-item {
    display: flex;
    min-width: 0;
    min-height: 58px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-radius: 18px;
    color: #7e725f;
    font-size: 11px;
    font-weight: 500;
}

.gy-nav-item svg {
    width: 22px;
    height: 22px;
}

.gy-nav-item.is-active {
    background: linear-gradient(135deg, var(--gy-gold), var(--gy-gold-strong));
    color: #fff;
}

.gy-loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    pointer-events: none;
    opacity: 0;
    background: rgba(255, 255, 255, .38);
    transition: opacity .12s ease;
    backdrop-filter: blur(1.5px);
}

.gy-loader::before {
    content: "";
    display: block;
    width: 34px;
    height: 34px;
    border: 3px solid rgba(239, 101, 0, .18);
    border-top-color: var(--gy-gold);
    border-radius: 50%;
    box-shadow: 0 8px 24px rgba(207, 79, 0, .16);
    animation: gy-loader-spin .62s linear infinite;
}

.gy-loader.is-loading {
    opacity: 1;
}

body.gy-user-body :where(a, button, input, select, textarea, label, [role="button"]),
body.gy-auth-body :where(a, button, input, select, textarea, label, [role="button"]) {
    -webkit-tap-highlight-color: transparent;
}

body.gy-user-body :where(a, button, input, select, textarea, [tabindex]):focus,
body.gy-auth-body :where(a, button, input, select, textarea, [tabindex]):focus {
    outline: none !important;
}

body.gy-user-body :where(a, button, input, select, textarea, [tabindex]):focus:not(:focus-visible),
body.gy-auth-body :where(a, button, input, select, textarea, [tabindex]):focus:not(:focus-visible) {
    box-shadow: none !important;
}

body.gy-user-body :where(a, button, input, select, textarea, [tabindex]):focus-visible,
body.gy-auth-body :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid rgba(217, 166, 37, .62) !important;
    outline-offset: 3px;
}

body.gy-user-body .gy-announcement-close:focus,
body.gy-user-body .gy-announcement-close:focus-visible {
    border-color: rgba(218, 77, 0, .34);
    outline: none !important;
    background: #ffecdf;
    box-shadow: none !important;
}

body.gy-user-body .gy-gift-modal-close:focus,
body.gy-user-body .gy-gift-modal-close:focus-visible {
    border-color: rgba(218, 77, 0, .42);
    outline: none !important;
    background: #ffe9d9;
    box-shadow: none !important;
}

body.gy-user-body .iziToast-wrapper,
body.gy-auth-body .iziToast-wrapper {
    top: calc(env(safe-area-inset-top) + 12px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    padding: 0 14px !important;
    pointer-events: none;
}

body.gy-user-body .iziToast-capsule,
body.gy-auth-body .iziToast-capsule {
    pointer-events: none;
}

body.gy-user-body .iziToast.gy-toast,
body.gy-auth-body .iziToast.gy-toast {
    width: min(430px, calc(100vw - 28px)) !important;
    min-height: 0 !important;
    margin: 0 auto 10px !important;
    border: 1px solid rgba(217, 166, 37, .22) !important;
    border-radius: 18px !important;
    background: rgba(255, 253, 248, .96) !important;
    box-shadow: 0 18px 45px rgba(36, 25, 8, .18) !important;
    color: var(--gy-ink) !important;
    overflow: hidden !important;
    pointer-events: auto;
    backdrop-filter: blur(14px);
}

body.gy-user-body .iziToast.gy-toast::before,
body.gy-auth-body .iziToast.gy-toast::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--gy-gold);
}

body.gy-user-body .iziToast.gy-toast::after,
body.gy-auth-body .iziToast.gy-toast::after {
    content: "";
    position: absolute;
    left: 18px;
    top: 50%;
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: var(--gy-gold);
    box-shadow: 0 0 0 5px rgba(217, 166, 37, .12);
    transform: translateY(-50%);
}

body.gy-user-body .iziToast.gy-toast-success::before,
body.gy-user-body .iziToast.gy-toast-success::after,
body.gy-auth-body .iziToast.gy-toast-success::before,
body.gy-auth-body .iziToast.gy-toast-success::after {
    background: #20a162;
}

body.gy-user-body .iziToast.gy-toast-error::before,
body.gy-user-body .iziToast.gy-toast-error::after,
body.gy-auth-body .iziToast.gy-toast-error::before,
body.gy-auth-body .iziToast.gy-toast-error::after {
    background: var(--gy-danger);
}

body.gy-user-body .iziToast.gy-toast-warning::before,
body.gy-user-body .iziToast.gy-toast-warning::after,
body.gy-auth-body .iziToast.gy-toast-warning::before,
body.gy-auth-body .iziToast.gy-toast-warning::after {
    background: #c98200;
}

body.gy-user-body .iziToast.gy-toast > .iziToast-body,
body.gy-auth-body .iziToast.gy-toast > .iziToast-body {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: center !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 15px 46px 15px 46px !important;
    text-align: left !important;
}

body.gy-user-body .iziToast.gy-toast .iziToast-texts,
body.gy-auth-body .iziToast.gy-toast .iziToast-texts {
    display: grid !important;
    gap: 3px !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
}

body.gy-user-body .iziToast.gy-toast .iziToast-icon,
body.gy-auth-body .iziToast.gy-toast .iziToast-icon {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}

body.gy-user-body .iziToast.gy-toast .iziToast-title,
body.gy-auth-body .iziToast.gy-toast .iziToast-title {
    display: block !important;
    float: none !important;
    margin: 0 0 3px !important;
    color: var(--gy-ink) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
}

body.gy-user-body .iziToast.gy-toast .iziToast-message,
body.gy-auth-body .iziToast.gy-toast .iziToast-message {
    display: block !important;
    float: none !important;
    margin: 0 !important;
    color: var(--gy-muted) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
}

body.gy-user-body .iziToast.gy-toast .iziToast-close,
body.gy-auth-body .iziToast.gy-toast .iziToast-close {
    top: 50% !important;
    right: 10px !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 999px !important;
    background-color: rgba(23, 17, 7, .06) !important;
    background-size: 9px !important;
    opacity: 1 !important;
    transform: translateY(-50%);
}

body.gy-user-body .iziToast.gy-toast .iziToast-progressbar,
body.gy-auth-body .iziToast.gy-toast .iziToast-progressbar {
    height: 3px !important;
    background: rgba(217, 166, 37, .12) !important;
}

body.gy-user-body .iziToast.gy-toast .iziToast-progressbar div,
body.gy-auth-body .iziToast.gy-toast .iziToast-progressbar div {
    height: 3px !important;
}

body.gy-user-body .gy-topbar,
body.gy-user-body .gy-page-header,
body.gy-user-body .gy-content > *,
body.gy-user-body .gy-page-content > *,
body.gy-auth-body .gy-auth-card {
    animation: gy-rise-in .52s cubic-bezier(.16, .84, .32, 1) both;
}

body.gy-user-body .gy-content > *:nth-child(2),
body.gy-user-body .gy-page-content > *:nth-child(2) {
    animation-delay: .04s;
}

body.gy-user-body .gy-content > *:nth-child(3),
body.gy-user-body .gy-page-content > *:nth-child(3) {
    animation-delay: .08s;
}

body.gy-user-body .gy-content > *:nth-child(4),
body.gy-user-body .gy-page-content > *:nth-child(4) {
    animation-delay: .12s;
}

body.gy-user-body .gy-content > *:nth-child(n+5),
body.gy-user-body .gy-page-content > *:nth-child(n+5) {
    animation-delay: .16s;
}

body.gy-user-body .gy-action,
body.gy-user-body .gy-menu-item,
body.gy-user-body .gy-list-item,
body.gy-user-body .gy-card,
body.gy-user-body .gy-form-card {
    animation: gy-soft-pop .48s cubic-bezier(.16, .84, .32, 1) both;
}

body.gy-user-body .gy-action:nth-child(2),
body.gy-user-body .gy-menu-item:nth-child(2),
body.gy-user-body .gy-list-item:nth-child(2) {
    animation-delay: .04s;
}

body.gy-user-body .gy-action:nth-child(3),
body.gy-user-body .gy-menu-item:nth-child(3),
body.gy-user-body .gy-list-item:nth-child(3) {
    animation-delay: .08s;
}

body.gy-user-body .gy-action:nth-child(4),
body.gy-user-body .gy-menu-item:nth-child(4),
body.gy-user-body .gy-list-item:nth-child(4) {
    animation-delay: .12s;
}

body.gy-user-body .gy-action:nth-child(n+5),
body.gy-user-body .gy-menu-item:nth-child(n+5),
body.gy-user-body .gy-list-item:nth-child(n+5) {
    animation-delay: .16s;
}

.gy-card-dark::before,
.gy-balance-card::before {
    animation: gy-pattern-drift 18s linear infinite;
}

.gy-balance-card::after {
    animation: gy-orbit-glow 8s ease-in-out infinite;
}

@keyframes gy-loader-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes gy-rise-in {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes gy-soft-pop {
    0% {
        opacity: 0;
        transform: translateY(8px) scale(.985);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes gy-pattern-drift {
    0% {
        background-position: 0 0, 0 0;
    }
    100% {
        background-position: 34px 34px, 22px 22px;
    }
}

@keyframes gy-orbit-glow {
    0%, 100% {
        opacity: .78;
        transform: translate3d(0, 0, 0) scale(1);
    }
    50% {
        opacity: 1;
        transform: translate3d(-8px, -5px, 0) scale(1.04);
    }
}

@media (min-width: 768px) {
    .gy-auth-card {
        padding: 32px 30px 28px;
    }

    .gy-shell {
        border-right: 1px solid var(--gy-line);
        border-left: 1px solid var(--gy-line);
        box-shadow: 0 0 50px rgba(67, 42, 24, .08);
    }

    .gy-app-bar {
        padding-right: 28px;
        padding-left: 28px;
    }

    .gy-content,
    .gy-page-content {
        padding-right: 28px;
        padding-left: 28px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gy-loader::before {
        animation-duration: 1.4s;
    }

    body.gy-user-body .gy-topbar,
    body.gy-user-body .gy-page-header,
    body.gy-user-body .gy-content > *,
    body.gy-user-body .gy-page-content > *,
    body.gy-user-body .gy-action,
    body.gy-user-body .gy-menu-item,
    body.gy-user-body .gy-list-item,
    body.gy-user-body .gy-card,
    body.gy-user-body .gy-form-card,
    body.gy-auth-body .gy-auth-card,
    .gy-card-dark::before,
    .gy-balance-card::before,
    .gy-balance-card::after {
        animation: none !important;
    }
}

/* Mobile-first shell and white/orange authentication revision. */
body.gy-user-body {
    background:
        radial-gradient(circle at 50% -8%, rgba(255, 171, 106, .18), transparent 26%),
        #f4f3f2;
}

body.gy-auth-body {
    background:
        radial-gradient(circle at 50% -6%, rgba(255, 147, 65, .3), transparent 30%),
        linear-gradient(180deg, #fff9f5 0%, #f6f5f4 55%, #f0efed 100%);
}

.gy-auth-page {
    width: min(100%, var(--gy-shell-width));
    margin: 0 auto;
    padding: 24px 18px;
    background: rgba(255, 255, 255, .55);
    box-shadow: 0 0 55px rgba(59, 36, 21, .08);
}

.gy-auth-page::before {
    background:
        radial-gradient(circle at 15% 12%, rgba(255, 112, 0, .14), transparent 24%),
        radial-gradient(circle at 92% 88%, rgba(255, 157, 82, .12), transparent 28%);
}

.gy-auth-card {
    width: min(100%, 420px);
    border: 1px solid rgba(89, 63, 46, .1);
    border-radius: 30px;
    background: rgba(255, 255, 255, .97);
    padding: 30px 24px 25px;
    box-shadow: 0 20px 58px rgba(59, 36, 21, .11);
}

.gy-auth-logo {
    width: 80px;
    height: 80px;
    margin-bottom: 16px;
    border: 4px solid #fff;
    border-radius: 50%;
    box-shadow: 0 11px 30px rgba(207, 79, 0, .2);
}

.gy-auth-card .gy-eyebrow {
    color: var(--gy-gold-strong);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
}

.gy-auth-card .gy-title {
    margin-top: 7px;
    color: #171513;
    font-size: 28px;
    font-weight: 700;
}

.gy-auth-card .gy-subtitle {
    max-width: 310px;
    margin: 9px auto 0;
    color: #77716d;
    font-size: 13px;
}

.gy-auth-card .gy-form {
    gap: 17px;
    margin-top: 25px;
}

.gy-auth-card .gy-label {
    color: #403a36;
    font-size: 12px;
    font-weight: 600;
}

.gy-auth-card .gy-input {
    min-height: 54px;
    border-color: rgba(89, 63, 46, .13);
    border-radius: 17px;
    background: #fbfaf9;
}

.gy-auth-card .gy-input:focus {
    border-color: rgba(239, 101, 0, .7);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(239, 101, 0, .12);
}

.gy-auth-card .gy-input-icon,
.gy-auth-card .gy-password-toggle {
    color: var(--gy-gold-strong);
}

.gy-auth-card .gy-button {
    min-height: 54px;
    border-radius: 17px;
    background: linear-gradient(135deg, #f87516, #d94d00);
    font-weight: 600;
    box-shadow: 0 13px 27px rgba(218, 77, 0, .22);
}

.gy-auth-card .gy-auth-switch {
    margin-top: 2px;
    color: #77716d;
    font-size: 13px;
}

.gy-auth-card .gy-auth-switch a {
    color: var(--gy-gold-strong);
    font-weight: 600;
}

.gy-home-balance-amount[data-gy-fit-balance] {
    width: 100%;
    max-width: 100%;
    overflow: visible;
    font-variant-numeric: tabular-nums;
}

@media (min-width: 481px) {
    .gy-shell,
    .gy-auth-page {
        border-right: 1px solid var(--gy-line);
        border-left: 1px solid var(--gy-line);
    }
}

@media (max-width: 390px) {
    .gy-auth-page {
        padding: 16px 12px;
    }

    .gy-auth-card {
        border-radius: 25px;
        padding: 24px 18px 21px;
    }

    .gy-auth-logo {
        width: 70px;
        height: 70px;
    }
}

/* Phase 2: mockup-matched home dashboard. */
.gy-home-body .gy-shell {
    background: #f8f8f7;
}

.gy-home-content {
    padding: 18px 18px 30px;
}

.gy-home-balance {
    position: relative;
    display: flex;
    min-height: 272px;
    overflow: hidden;
    border: 1px solid rgba(80, 56, 42, .1);
    border-radius: 28px;
    background:
        radial-gradient(circle at 100% 100%, rgba(255, 188, 112, .42), transparent 28%),
        linear-gradient(135deg, #fff 0%, #fff 70%, #fff5eb 100%);
    box-shadow: 0 13px 34px rgba(49, 35, 26, .09);
}

.gy-home-balance::after {
    content: "";
    position: absolute;
    right: -70px;
    bottom: -80px;
    width: 230px;
    height: 230px;
    border-radius: 50%;
    background: rgba(255, 157, 54, .13);
    filter: blur(2px);
}

.gy-home-balance-copy {
    position: relative;
    z-index: 2;
    display: flex;
    width: 61%;
    flex-direction: column;
    padding: 28px 24px 24px;
}

.gy-home-balance-label {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #605c59;
    font-size: 14px;
    letter-spacing: .015em;
    text-transform: uppercase;
}

.gy-home-eye {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 0;
    border-radius: 14px;
    background: #f5f5f4;
    color: #171513;
    cursor: pointer;
}

.gy-home-balance-amount {
    margin: 17px 0 25px;
    color: #c94c00;
    font-size: clamp(38px, 6vw, 56px);
    line-height: 1;
    font-weight: 700;
    letter-spacing: .01em;
    white-space: nowrap;
}

.gy-home-balance-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: auto;
}

.gy-home-stat {
    min-width: 0;
    border: 1px solid rgba(112, 83, 65, .13);
    border-radius: 17px;
    background: rgba(255, 255, 255, .72);
    padding: 13px 15px;
}

.gy-home-stat span,
.gy-home-stat strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-home-stat span {
    color: #8a7568;
    font-size: 12px;
}

.gy-home-stat strong {
    margin-top: 6px;
    color: #171513;
    font-size: 15px;
    font-weight: 600;
}

.gy-home-wallet-wrap {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    width: 45%;
    overflow: hidden;
}

.gy-home-wallet {
    position: absolute;
    top: -27%;
    right: -5%;
    width: auto;
    max-width: none;
    height: 158%;
    object-fit: contain;
    filter: drop-shadow(0 18px 18px rgba(160, 62, 0, .22));
}

.gy-home-plan-card {
    display: block;
    overflow: hidden;
    margin-top: 20px;
    border: 1px solid rgba(80, 56, 42, .1);
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 13px 34px rgba(49, 35, 26, .08);
}

.gy-home-plan-card img {
    display: block;
    width: 100%;
    height: auto;
}

.gy-home-section {
    margin-top: 28px;
}

.gy-home-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 13px;
    padding: 0 5px;
}

.gy-home-section-head h2 {
    margin: 0;
    color: #171513;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 600;
}

.gy-home-section-head a,
.gy-home-section-head span {
    color: var(--gy-gold-strong);
    font-size: 13px;
}

.gy-home-actions {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 12px;
}

.gy-home-action {
    display: flex;
    min-width: 0;
    min-height: 104px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid rgba(80, 56, 42, .1);
    border-radius: 19px;
    background: #fff;
    color: #26211e;
    padding: 11px 6px;
    font: inherit;
    box-shadow: 0 9px 24px rgba(49, 35, 26, .07);
    cursor: pointer;
}

.gy-home-action-icon {
    display: grid;
    width: 39px;
    height: 39px;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
    box-shadow: 0 7px 15px rgba(218, 77, 0, .2);
}

.gy-home-action-icon svg,
.gy-home-info-icon svg,
.gy-home-community-icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.75;
}

.gy-home-action > span:last-child {
    overflow: hidden;
    max-width: 100%;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-home-info-list {
    display: grid;
    gap: 6px;
}

.gy-home-info-row {
    display: grid;
    width: 100%;
    min-height: 72px;
    grid-template-columns: 46px minmax(0, 1fr) 24px;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(80, 56, 42, .09);
    border-radius: 18px;
    background: #fff;
    color: #171513;
    padding: 10px 14px;
    font: inherit;
    text-align: left;
    box-shadow: 0 7px 20px rgba(49, 35, 26, .055);
    cursor: pointer;
}

.gy-home-info-icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 13px;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
}

.gy-home-info-copy,
.gy-home-info-copy strong,
.gy-home-info-copy small,
.gy-home-community-copy,
.gy-home-community-copy strong,
.gy-home-community-copy small {
    display: block;
    min-width: 0;
}

.gy-home-info-copy strong,
.gy-home-community-copy strong {
    color: #171513;
    font-size: 14px;
    font-weight: 600;
}

.gy-home-info-copy small,
.gy-home-community-copy small {
    overflow: hidden;
    margin-top: 3px;
    color: #77716d;
    font-size: 12px;
    line-height: 1.35;
    text-overflow: ellipsis;
}

.gy-home-chevron {
    color: #806959;
    font-size: 26px;
    font-weight: 300;
    text-align: center;
}

.gy-home-community {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.gy-home-community-card {
    display: grid;
    min-height: 98px;
    grid-template-columns: 54px minmax(0, 1fr) 24px;
    align-items: center;
    gap: 13px;
    border: 1px solid rgba(80, 56, 42, .09);
    border-radius: 22px;
    background: #fff;
    padding: 16px;
    box-shadow: 0 9px 24px rgba(49, 35, 26, .065);
}

.gy-home-community-icon {
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
}

.gy-home-community-icon svg {
    width: 27px;
    height: 27px;
}

.gy-modal-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.gy-modal-heading h3,
.gy-modal-heading p {
    margin: 0;
}

.gy-modal-heading h3 {
    color: #171513;
    font-size: 21px;
    font-weight: 600;
}

.gy-modal-heading h3 + p {
    margin-top: 5px;
    color: var(--gy-muted);
    font-size: 13px;
}

body.gy-modal-open {
    overflow: hidden;
}

@media (max-width: 719px) {
    .gy-home-content {
        padding: 14px 14px 24px;
    }

    .gy-home-balance {
        min-height: 244px;
        border-radius: 24px;
    }

    .gy-home-balance-copy {
        width: 72%;
        padding: 22px 16px 18px;
    }

    .gy-home-balance-label {
        font-size: 12px;
    }

    .gy-home-balance-amount {
        margin: 15px 0 21px;
        font-size: clamp(34px, 10.5vw, 43px);
    }

    .gy-home-balance-stats {
        gap: 8px;
    }

    .gy-home-stat {
        padding: 11px 10px;
    }

    .gy-home-stat span {
        font-size: 10px;
    }

    .gy-home-stat strong {
        font-size: 13px;
    }

    .gy-home-wallet-wrap {
        width: 48%;
    }

    .gy-home-wallet {
        top: -11%;
        right: -34%;
        height: 132%;
        opacity: .9;
    }

    .gy-home-plan-card {
        margin-top: 14px;
        border-radius: 21px;
    }

    .gy-home-section {
        margin-top: 24px;
    }

    .gy-home-section-head h2 {
        font-size: 18px;
    }

    .gy-home-actions {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 9px;
    }

    .gy-home-action {
        min-height: 88px;
        border-radius: 17px;
    }

    .gy-home-action-icon {
        width: 36px;
        height: 36px;
    }

    .gy-home-community {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .gy-home-community-card {
        min-height: 82px;
        border-radius: 18px;
        padding: 12px 14px;
    }
}

@media (max-width: 420px) {
    .gy-home-balance-copy {
        width: 78%;
    }

    .gy-home-wallet-wrap {
        width: 44%;
    }

    .gy-home-wallet {
        right: -49%;
    }
}

/* Silver Stone lifetime reward levels */
.gy-level-rewards-entry {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(239, 101, 0, .18);
    border-radius: 20px;
    background: linear-gradient(135deg, #fff 0%, #fff5ed 100%);
    padding: 14px;
    color: var(--gy-ink);
    box-shadow: 0 12px 32px rgba(151, 64, 10, .08);
    text-decoration: none;
}

.gy-level-rewards-entry-icon,
.gy-rewards-trophy {
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #ff781c, #e34f00);
    color: #fff;
    box-shadow: 0 9px 22px rgba(221, 80, 0, .22);
}

.gy-level-rewards-entry-icon { width: 48px; height: 48px; }
.gy-level-rewards-entry-icon svg,
.gy-rewards-trophy svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.gy-level-rewards-entry > span:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.gy-level-rewards-entry small { color: var(--gy-gold-strong); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.gy-level-rewards-entry strong { font-size: 16px; font-weight: 750; }
.gy-level-rewards-entry em { overflow: hidden; color: var(--gy-muted); font-size: 10px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.gy-growth-flow .gy-reward-levels { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.gy-rewards-flow { gap: 18px; padding-bottom: 26px; }
.gy-rewards-hero {
    overflow: hidden;
    position: relative;
    border-radius: 25px;
    background: linear-gradient(145deg, #ff7215 0%, #e65100 62%, #bf3e00 100%);
    padding: 20px;
    color: #fff;
    box-shadow: 0 20px 42px rgba(194, 63, 0, .22);
}
.gy-rewards-hero::after { content: ""; position: absolute; right: -54px; bottom: -75px; width: 180px; height: 180px; border: 32px solid rgba(255,255,255,.09); border-radius: 50%; }
.gy-rewards-hero-head { position: relative; z-index: 1; display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 13px; align-items: start; }
.gy-rewards-trophy { width: 54px; height: 54px; background: rgba(255,255,255,.18); box-shadow: none; }
.gy-rewards-hero-head > div > span { color: rgba(255,255,255,.78); font-size: 10px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.gy-rewards-hero h1 { margin: 3px 0 4px; color: #fff; font-size: 23px; font-weight: 800; line-height: 1.15; }
.gy-rewards-hero p { margin: 0; color: rgba(255,255,255,.82); font-size: 11px; line-height: 1.45; }
.gy-rewards-hero-stats { position: relative; z-index: 1; display: grid; grid-template-columns: 1.35fr .65fr; gap: 9px; margin-top: 18px; }
.gy-rewards-hero-stats > div { display: grid; gap: 4px; border: 1px solid rgba(255,255,255,.2); border-radius: 16px; background: rgba(97,29,0,.13); padding: 12px; backdrop-filter: blur(8px); }
.gy-rewards-hero-stats span { color: rgba(255,255,255,.74); font-size: 9px; text-transform: uppercase; }
.gy-rewards-hero-stats strong { color: #fff; font-size: 18px; font-weight: 760; }

.gy-rewards-progress,
.gy-rewards-history,
.gy-rewards-guide,
.gy-rewards-rules { border: 1px solid var(--gy-line); border-radius: 22px; background: #fff; padding: 17px; box-shadow: 0 12px 34px rgba(67,42,24,.06); }
.gy-rewards-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.gy-rewards-section-head > div { display: grid; gap: 2px; }
.gy-rewards-section-head span { color: var(--gy-gold-strong); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.gy-rewards-section-head h2 { margin: 0; font-size: 17px; font-weight: 760; }
.gy-rewards-section-head > strong { color: var(--gy-gold-strong); font-size: 15px; font-weight: 750; }
.gy-rewards-progress > p { margin: 8px 0 16px; color: var(--gy-muted); font-size: 10px; line-height: 1.5; }
.gy-rewards-progress-row { display: grid; grid-template-columns: 1fr auto; gap: 7px 10px; margin-top: 13px; }
.gy-rewards-progress-row > div:first-child { display: flex; grid-column: 1/-1; align-items: center; justify-content: space-between; gap: 8px; }
.gy-rewards-progress-row span { color: var(--gy-muted); font-size: 10px; }
.gy-rewards-progress-row strong { font-size: 12px; font-weight: 700; }
.gy-rewards-progress-track { overflow: hidden; height: 8px; border-radius: 999px; background: #f3e8e0; }
.gy-rewards-progress-track i,
.gy-rewards-level-copy > div i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ff851f, #e65100); }
.gy-rewards-progress-row small { min-width: 35px; color: var(--gy-gold-strong); font-size: 9px; font-weight: 700; text-align: right; }
.gy-rewards-qualifying { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; border-radius: 14px; background: var(--gy-gold-soft); padding: 11px 12px; }
.gy-rewards-qualifying span { color: #885331; font-size: 10px; }
.gy-rewards-qualifying strong { color: var(--gy-gold-strong); font-size: 16px; font-weight: 800; }
.gy-rewards-complete-badge { border-radius: 999px; background: #e7f6ee; color: var(--gy-green) !important; padding: 6px 9px; }

.gy-rewards-list-head { margin-bottom: 9px; }
.gy-rewards-level-list { display: grid; gap: 8px; }
.gy-rewards-level { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 11px; border: 1px solid var(--gy-line); border-radius: 18px; background: #fff; padding: 12px; }
.gy-rewards-level.is-current { border-color: rgba(239,101,0,.38); background: #fff8f2; box-shadow: 0 10px 24px rgba(188,71,0,.08); }
.gy-rewards-level.is-attained { border-color: rgba(24,131,81,.18); background: #fbfffc; }
.gy-rewards-level-number { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 14px; background: #f1ece8; color: #8c817a; font-size: 15px; font-weight: 800; }
.is-current .gy-rewards-level-number { background: linear-gradient(135deg,#ff7c1a,#e55200); color: #fff; }
.is-attained .gy-rewards-level-number { background: #e4f5ec; color: var(--gy-green); }
.gy-rewards-level-copy { display: grid; min-width: 0; gap: 3px; }
.gy-rewards-level-copy small { color: var(--gy-muted); font-size: 8px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.gy-rewards-level-copy strong { overflow: hidden; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.gy-rewards-level-copy > div { overflow: hidden; width: 100%; height: 4px; margin-top: 3px; border-radius: 999px; background: #f1e8e2; }
.gy-rewards-level-reward { display: grid; justify-items: end; gap: 2px; text-align: right; }
.gy-rewards-level-reward span { color: var(--gy-muted); font-size: 8px; }
.gy-rewards-level-reward strong { color: var(--gy-gold-strong); font-size: 12px; font-weight: 800; }
.gy-rewards-level-reward small { color: var(--gy-green); font-size: 7px; }

.gy-rewards-history-list { display: grid; gap: 7px; margin-top: 12px; }
.gy-rewards-history-list article { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 10px; border-top: 1px solid var(--gy-line); padding-top: 10px; }
.gy-rewards-history-list article:first-child { border-top: 0; padding-top: 0; }
.gy-rewards-history-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 13px; background: #e5f5ed; color: var(--gy-green); font-size: 12px; font-weight: 800; }
.gy-rewards-history-list article > div { display: grid; gap: 3px; }
.gy-rewards-history-list article > div strong { font-size: 11px; font-weight: 720; }
.gy-rewards-history-list article small { color: var(--gy-muted); font-size: 8px; }
.gy-rewards-history-list article > strong { color: var(--gy-green); font-size: 11px; font-weight: 800; }
.gy-rewards-history-empty { display: grid; justify-items: center; gap: 5px; padding: 16px 0 4px; text-align: center; }
.gy-rewards-history-empty > span { color: var(--gy-gold); font-size: 24px; }
.gy-rewards-history-empty strong { font-size: 12px; font-weight: 700; }
.gy-rewards-history-empty p { margin: 0; color: var(--gy-muted); font-size: 9px; }

.gy-rewards-guide > div > span { color: var(--gy-gold-strong); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.gy-rewards-guide h2 { margin: 3px 0; font-size: 17px; font-weight: 760; }
.gy-rewards-guide p { margin: 0 0 13px; color: var(--gy-muted); font-size: 10px; line-height: 1.45; }
.gy-rewards-guide > button { overflow: hidden; position: relative; width: 100%; border: 0; border-radius: 17px; background: #fff4eb; padding: 0; cursor: pointer; }
.gy-rewards-guide img { display: block; width: 100%; height: auto; }
.gy-rewards-guide > button > span { position: absolute; right: 10px; bottom: 10px; border-radius: 999px; background: rgba(28,18,13,.88); color: #fff; padding: 7px 10px; font-size: 9px; font-weight: 700; }
.gy-rewards-rules strong { font-size: 13px; font-weight: 760; }
.gy-rewards-rules ul { display: grid; gap: 7px; margin: 11px 0 0; padding-left: 18px; color: var(--gy-muted); font-size: 10px; line-height: 1.45; }
.gy-rewards-rules li::marker { color: var(--gy-gold); }

.gy-rewards-guide-modal { position: fixed; z-index: 2101; top: max(14px, env(safe-area-inset-top)); right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); left: 14px; overflow: auto; width: min(calc(100% - 28px), 452px); margin: 0 auto; border: 1px solid rgba(239,101,0,.2); border-radius: 24px; background: #fff; box-shadow: 0 28px 80px rgba(30,18,11,.28); }
.gy-rewards-guide-modal > div { position: sticky; z-index: 1; top: 0; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--gy-line); background: rgba(255,255,255,.94); padding: 12px 14px; backdrop-filter: blur(14px); }
.gy-rewards-guide-modal h3 { margin: 0; font-size: 15px; font-weight: 750; }
.gy-rewards-guide-modal button { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid var(--gy-line); border-radius: 14px; background: #fff; color: var(--gy-ink); cursor: pointer; }
.gy-rewards-guide-modal button svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.8; }
.gy-rewards-guide-modal > img { display: block; width: 100%; height: auto; }

@media (max-width: 350px) {
    .gy-rewards-hero { padding: 16px; }
    .gy-rewards-level { grid-template-columns: 38px minmax(0,1fr) auto; gap: 8px; padding: 10px; }
    .gy-rewards-level-number { width: 38px; height: 38px; }
    .gy-rewards-level-copy strong { font-size: 10px; }
    .gy-rewards-level-reward strong { font-size: 10px; }
}

/* Keep the shared wallet card authoritative over earlier phase-specific rules. */
.gy-home-balance.gy-wallet-balance-card,
.gy-profile-balance.gy-wallet-balance-card {
    display: block;
    min-height: 0;
    border-color: rgba(255, 255, 255, .28);
    background:
        radial-gradient(circle at 90% 2%, rgba(255, 224, 196, .28), transparent 30%),
        linear-gradient(145deg, #fb7418 0%, #e95805 52%, #c94300 100%);
    padding: 19px;
}

.gy-wallet-balance-card .gy-home-balance-amount,
.gy-wallet-balance-card .gy-balance-amount {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    margin: 7px 0 0;
    color: #fff;
    font-size: clamp(31px, 9vw, 39px);
    line-height: 1.08;
    letter-spacing: -.025em;
    text-overflow: clip;
}

/* Shared account-style balance card used on Home and Profile. */
.gy-wallet-balance-card,
.gy-home-balance.gy-wallet-balance-card,
.gy-profile-balance.gy-wallet-balance-card {
    position: relative;
    display: block;
    min-height: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 28px;
    background:
        radial-gradient(circle at 90% 2%, rgba(255, 224, 196, .28), transparent 30%),
        linear-gradient(145deg, #fb7418 0%, #e95805 52%, #c94300 100%);
    padding: 19px;
    color: #fff;
    box-shadow: 0 18px 38px rgba(183, 59, 0, .25);
}

.gy-home-balance.gy-wallet-balance-card::after,
.gy-profile-balance.gy-wallet-balance-card::after {
    position: absolute;
    right: -56px;
    bottom: -76px;
    width: 210px;
    height: 210px;
    border: 35px solid rgba(255, 255, 255, .055);
    border-radius: 50%;
    background: transparent;
    content: "";
    filter: none;
    pointer-events: none;
}

.gy-wallet-account-row,
.gy-wallet-balance-main,
.gy-wallet-meta,
.gy-wallet-actions {
    position: relative;
    z-index: 1;
}

.gy-wallet-account-row {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 42px;
    align-items: center;
    gap: 11px;
}

.gy-wallet-account-avatar {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;
    background: rgba(100, 29, 0, .2);
    color: #fff;
    font-size: 18px;
    font-weight: 750;
    box-shadow: 0 8px 18px rgba(104, 26, 0, .16);
}

.gy-wallet-account-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.gy-wallet-account-copy small {
    color: rgba(255, 255, 255, .72);
    font-size: 9px;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.gy-wallet-account-copy strong {
    overflow: hidden;
    color: #fff;
    font-size: 15px;
    line-height: 1.25;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-wallet-visibility {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 15px;
    background: rgba(115, 31, 0, .17);
    color: #fff;
    cursor: pointer;
}

.gy-wallet-visibility .gy-eye-icon {
    width: 19px;
    height: 19px;
}

.gy-wallet-balance-main {
    margin-top: 25px;
}

.gy-wallet-balance-main > span {
    display: block;
    color: rgba(255, 255, 255, .72);
    font-size: 12px;
}

.gy-wallet-balance-card .gy-home-balance-amount,
.gy-wallet-balance-card .gy-balance-amount {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    margin: 7px 0 0;
    color: #fff;
    font-size: clamp(31px, 9vw, 39px);
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: -.025em;
    font-variant-numeric: tabular-nums;
    text-overflow: clip;
    white-space: nowrap;
}

.gy-wallet-balance-card .gy-wallet-meta,
.gy-wallet-balance-card .gy-profile-balance-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 20px;
}

.gy-wallet-balance-card .gy-wallet-meta > div {
    display: grid;
    min-width: 0;
    gap: 3px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 14px;
    background: rgba(255, 255, 255, .12);
    padding: 9px 10px;
}

.gy-wallet-balance-card .gy-wallet-meta span {
    overflow: hidden;
    color: rgba(255, 255, 255, .68);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-wallet-balance-card .gy-wallet-meta strong {
    overflow: hidden;
    color: #fff;
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-wallet-balance-card .gy-wallet-actions,
.gy-wallet-balance-card .gy-profile-quick-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}

.gy-wallet-balance-card .gy-wallet-actions a,
.gy-wallet-balance-card .gy-profile-quick-actions a {
    display: flex;
    min-width: 0;
    min-height: 45px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 15px;
    background: rgba(91, 24, 0, .19);
    color: #fff;
    font-size: 10px;
    font-weight: 650;
    box-shadow: none;
}

.gy-wallet-balance-card .gy-wallet-actions svg,
.gy-wallet-balance-card .gy-profile-quick-actions svg {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

@media (max-width: 350px) {
    .gy-wallet-balance-card,
    .gy-home-balance.gy-wallet-balance-card,
    .gy-profile-balance.gy-wallet-balance-card {
        padding: 16px;
    }

    .gy-wallet-balance-card .gy-wallet-actions a,
    .gy-wallet-balance-card .gy-profile-quick-actions a {
        flex-direction: column;
        gap: 2px;
    }
}

/* Phase 3: recharge and withdrawal flows */
.gy-money-flow {
    gap: 14px;
    padding-top: 14px;
    padding-bottom: 30px;
}

.gy-flow-hero,
.gy-flow-intro {
    display: flex;
    align-items: center;
    gap: 14px;
    border: 1px solid rgba(222, 83, 0, .12);
    border-radius: 22px;
    background: linear-gradient(135deg, #fff 35%, #fff2e9);
    padding: 17px;
    box-shadow: 0 10px 28px rgba(61, 35, 19, .06);
}

.gy-flow-hero-icon,
.gy-account-icon {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
    box-shadow: 0 8px 18px rgba(218, 77, 0, .2);
}

.gy-flow-hero-icon svg,
.gy-account-icon svg,
.gy-security-note svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.gy-flow-hero div,
.gy-flow-intro div {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.gy-flow-hero span:not(.gy-flow-hero-icon),
.gy-flow-intro small {
    color: #8b7568;
    font-size: 11px;
}

.gy-flow-hero strong,
.gy-flow-intro strong {
    color: #201713;
    font-size: 17px;
    line-height: 1.25;
}

.gy-flow-hero small {
    color: #716863;
    font-size: 12px;
    line-height: 1.4;
}

.gy-flow-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    border-radius: 15px;
    background: #f1efed;
    padding: 4px;
}

.gy-flow-links a,
.gy-flow-links span {
    display: grid;
    min-height: 40px;
    place-items: center;
    border-radius: 12px;
    color: #7b716c;
    font-size: 13px;
    font-weight: 600;
}

.gy-flow-links .is-active {
    background: #fff;
    color: #d64b00;
    box-shadow: 0 3px 10px rgba(54, 35, 24, .08);
}

.gy-flow-card,
.gy-payment-card,
.gy-proof-card {
    border-color: rgba(83, 53, 35, .09);
    border-radius: 22px;
    box-shadow: 0 9px 26px rgba(52, 34, 23, .06);
}

.gy-field-heading,
.gy-proof-heading,
.gy-bank-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.gy-field-heading > span,
.gy-proof-heading > span {
    flex: 0 0 auto;
    color: #d94d00;
    font-size: 11px;
    font-weight: 600;
}

.gy-money-flow .gy-amount-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.gy-money-flow .gy-amount-option {
    min-height: 46px;
    border: 1px solid #eadfd9;
    border-radius: 13px;
    background: #fffaf7;
    color: #49352a;
    font-size: 13px;
    font-weight: 600;
}

.gy-money-flow .gy-amount-option:hover,
.gy-money-flow .gy-amount-option.is-active,
.gy-money-flow .gy-amount-option[aria-pressed="true"] {
    border-color: #e75a09;
    background: #fff0e6;
    color: #d64b00;
}

.gy-money-flow .gy-input,
.gy-money-flow .gy-select {
    min-height: 52px;
    border-color: #e9e2de;
    border-radius: 14px;
    background-color: #fcfbfa;
}

.gy-money-flow .gy-input:focus,
.gy-money-flow .gy-select:focus {
    border-color: #eb681d;
    box-shadow: 0 0 0 3px rgba(235, 104, 29, .12);
}

.gy-money-flow .gy-button {
    min-height: 50px;
    border-radius: 15px;
    background: linear-gradient(135deg, #f46b12, #d94d00);
    box-shadow: 0 10px 20px rgba(218, 77, 0, .2);
}

.gy-flow-note {
    border-color: rgba(221, 88, 9, .12);
    border-radius: 18px;
    background: #fff8f3;
}

.gy-balance-summary,
.gy-history-summary {
    overflow: hidden;
    border-radius: 23px;
    background: linear-gradient(135deg, #f56c13, #d94d00);
    color: #fff;
    padding: 20px;
    box-shadow: 0 13px 28px rgba(207, 69, 0, .23);
}

.gy-balance-summary > div:first-child,
.gy-history-summary > div {
    display: grid;
    gap: 4px;
}

.gy-balance-summary span,
.gy-history-summary span {
    color: rgba(255, 255, 255, .78);
    font-size: 11px;
}

.gy-balance-summary > div:first-child > strong,
.gy-history-summary strong {
    overflow: hidden;
    max-width: 100%;
    font-size: clamp(25px, 7.4vw, 32px);
    line-height: 1.2;
    text-overflow: ellipsis;
}

.gy-balance-summary-referral {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, .22);
    padding-top: 13px;
}

.gy-balance-summary-referral strong {
    font-size: 14px;
}

.gy-fee-preview {
    display: flex;
    justify-content: space-between;
    border-radius: 13px;
    background: #fff5ee;
    color: #6f5749;
    padding: 11px 13px;
    font-size: 12px;
}

.gy-fee-preview strong {
    color: #d94d00;
}

.gy-account-empty {
    display: grid;
    justify-items: center;
    gap: 8px;
    text-align: center;
}

.gy-account-empty .gy-button {
    margin-top: 7px;
}

.gy-bank-card {
    background: linear-gradient(145deg, #fff, #fff8f3);
}

.gy-bank-card-head > div {
    display: grid;
    flex: 1;
    gap: 2px;
}

.gy-bank-card-head small,
.gy-bank-card-name {
    color: #84756d;
    font-size: 11px;
}

.gy-bank-card-head strong {
    color: #211916;
    font-size: 14px;
}

.gy-bank-card-head > a {
    color: #d94d00;
    font-size: 12px;
    font-weight: 600;
}

.gy-bank-card-number {
    margin-top: 18px;
    color: #251915;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .08em;
}

.gy-bank-card-name {
    margin-top: 3px;
    text-transform: uppercase;
}

.gy-account-status {
    min-height: 18px;
    margin: 5px 0 0;
    font-size: 11px;
}

.gy-security-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #766b65;
    padding: 2px 8px;
    font-size: 11px;
    line-height: 1.45;
}

.gy-security-note svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    color: #d94d00;
}

.gy-payment-steps {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.gy-payment-steps span {
    display: grid;
    width: 48px;
    justify-items: center;
    gap: 4px;
    color: #a69d98;
}

.gy-payment-steps b {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: #eeeae7;
    font-size: 11px;
}

.gy-payment-steps small {
    font-size: 9px;
}

.gy-payment-steps i {
    width: 45px;
    height: 2px;
    margin-top: 13px;
    background: #e7e1dd;
}

.gy-payment-steps .is-active,
.gy-payment-steps .is-complete {
    color: #d94d00;
}

.gy-payment-steps .is-active b,
.gy-payment-steps .is-complete b {
    background: #ee5b08;
    color: #fff;
}

.gy-payment-amount {
    display: grid;
    gap: 3px;
    border-radius: 18px;
    background: #fff4ec;
    padding: 16px;
}

.gy-payment-amount > span {
    color: #8d7568;
    font-size: 11px;
}

.gy-payment-amount > strong {
    color: #d34a00;
    font-size: 26px;
    line-height: 1.25;
}

.gy-payment-card .gy-detail-grid {
    overflow: hidden;
    border: 1px solid #eee6e1;
    border-radius: 17px;
}

.gy-payment-card .gy-detail-row {
    padding: 13px 14px;
}

.gy-wallet-loading {
    display: grid;
    justify-items: center;
    gap: 5px;
    padding: 18px;
    background: #fff8f3;
}

.gy-inline-spinner {
    width: 24px;
    height: 24px;
    border: 3px solid #f5c5a9;
    border-top-color: #e45505;
    border-radius: 50%;
    animation: gy-spin .7s linear infinite;
}

.gy-proof-heading {
    align-items: flex-start;
    margin-bottom: 15px;
}

.gy-proof-heading h4,
.gy-proof-heading p {
    margin: 0;
}

.gy-proof-card .gy-upload-box {
    border: 1.5px dashed #e9854c;
    border-radius: 17px;
    background: #fff9f5;
}

.gy-submitted-state {
    display: grid;
    justify-items: center;
    gap: 5px;
    border-radius: 17px;
    background: #effaf4;
    color: #176a40;
    padding: 18px;
}

.gy-submitted-state > span {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background: #1c9b5d;
    color: #fff;
    font-size: 20px;
}

.gy-history-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.gy-history-summary > a {
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 12px;
    color: #fff;
    padding: 9px 11px;
    font-size: 11px;
    font-weight: 600;
}

.gy-money-flow .gy-filter-strip {
    scrollbar-width: none;
}

.gy-money-flow .gy-filter-strip::-webkit-scrollbar {
    display: none;
}

.gy-transaction-card {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    box-shadow: 0 7px 20px rgba(51, 34, 24, .05);
}

.gy-transaction-card::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    background: #e49a63;
    content: '';
}

.gy-transaction-card.is-approved::before,
.gy-transaction-card.is-successful::before {
    background: #22a363;
}

.gy-transaction-card.is-rejected::before {
    background: #d84949;
}

.gy-trx-code {
    overflow: hidden;
    max-width: 45%;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    text-overflow: ellipsis;
}

.gy-flow-empty {
    display: grid;
    justify-items: center;
    gap: 7px;
    border: 1px solid #eee5df;
    border-radius: 20px;
    background: #fff;
    padding: 30px 20px;
}

.gy-empty-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 15px;
    background: #fff0e6;
    color: #dd5204;
    font-size: 24px;
}

.gy-flow-empty .gy-button {
    margin-top: 7px;
    padding: 0 18px;
}

.gy-ledger-flow {
    gap: 13px;
}

.gy-ledger-summary {
    position: relative;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 24px;
    background:
        radial-gradient(circle at 94% 8%, rgba(255, 230, 208, .27), transparent 34%),
        linear-gradient(145deg, #fb7418, #e95805 58%, #cc4500);
    padding: 18px;
    color: #fff;
    box-shadow: 0 14px 30px rgba(190, 63, 0, .22);
}

.gy-ledger-summary::after {
    position: absolute;
    right: -40px;
    bottom: -65px;
    width: 150px;
    height: 150px;
    border: 28px solid rgba(255, 255, 255, .055);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.gy-ledger-summary-icon,
.gy-ledger-summary-copy,
.gy-ledger-summary > a {
    position: relative;
    z-index: 1;
}

.gy-ledger-summary-icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 16px;
    background: rgba(108, 27, 0, .16);
}

.gy-ledger-summary-icon svg,
.gy-ledger-summary > a svg,
.gy-ledger-card-icon svg,
.gy-ledger-empty .gy-empty-icon svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gy-ledger-summary-icon svg {
    width: 24px;
    height: 24px;
}

.gy-ledger-summary-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.gy-ledger-summary-copy span,
.gy-ledger-summary-copy small {
    color: rgba(255, 255, 255, .72);
}

.gy-ledger-summary-copy span {
    font-size: 10px;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.gy-ledger-summary-copy strong {
    overflow: hidden;
    color: #fff;
    font-size: clamp(24px, 7.3vw, 31px);
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -.02em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-ledger-summary-copy small {
    font-size: 9px;
}

.gy-ledger-summary > a {
    display: flex;
    grid-column: 1 / -1;
    min-height: 43px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 14px;
    background: rgba(104, 26, 0, .17);
    color: #fff;
    font-size: 11px;
    font-weight: 650;
}

.gy-ledger-summary > a svg {
    width: 17px;
    height: 17px;
}

.gy-ledger-toolbar {
    display: grid;
    gap: 10px;
    border: 1px solid #eee4de;
    border-radius: 20px;
    background: #fff;
    padding: 13px;
    box-shadow: 0 7px 20px rgba(51, 34, 24, .045);
}

.gy-ledger-toolbar > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.gy-ledger-toolbar > div:first-child strong {
    color: #211916;
    font-size: 13px;
    font-weight: 650;
}

.gy-ledger-toolbar > div:first-child span {
    color: #a04a1a;
    font-size: 9px;
}

.gy-ledger-toolbar .gy-filter-strip {
    gap: 6px;
    margin: 0 -2px;
    padding: 0 2px 2px;
}

.gy-ledger-toolbar .gy-filter {
    border-color: #eee1d9;
    background: #fff9f5;
    color: #796b64;
    padding: 8px 12px;
    font-size: 10px;
    font-weight: 600;
}

.gy-ledger-toolbar .gy-filter.is-active {
    border-color: #e95b09;
    background: linear-gradient(135deg, #f87516, #df5000);
    color: #fff;
    box-shadow: 0 6px 13px rgba(218, 77, 0, .18);
}

.gy-ledger-list {
    gap: 9px;
}

.gy-ledger-card {
    overflow: hidden;
    border-color: #ede3dd;
    border-radius: 20px;
    background: #fff;
    padding: 0;
    box-shadow: 0 8px 23px rgba(54, 34, 22, .055);
}

.gy-ledger-card::before {
    display: none;
}

.gy-ledger-card-main {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 14px;
}

.gy-ledger-card-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 14px;
    background: #fff0e6;
    color: #dc5204;
}

.gy-ledger-card.is-approved .gy-ledger-card-icon,
.gy-ledger-card.is-successful .gy-ledger-card-icon {
    background: #eaf8f0;
    color: #188351;
}

.gy-ledger-card.is-rejected .gy-ledger-card-icon,
.gy-ledger-card.is-cancelled .gy-ledger-card-icon {
    background: #fff0ef;
    color: #be3f34;
}

.gy-ledger-card-icon svg {
    width: 21px;
    height: 21px;
}

.gy-ledger-card-copy {
    min-width: 0;
}

.gy-ledger-card-copy h3,
.gy-ledger-card-copy p {
    margin: 0;
}

.gy-ledger-card-copy h3 {
    overflow: hidden;
    color: #211916;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-ledger-card-copy p {
    margin-top: 4px;
    color: #8a7c74;
    font-size: 9px;
    line-height: 1.3;
}

.gy-ledger-card-amount {
    display: grid;
    min-width: 0;
    justify-items: end;
    gap: 2px;
    text-align: right;
}

.gy-ledger-card-amount small {
    color: #9b8e87;
    font-size: 8px;
}

.gy-ledger-card-amount strong {
    max-width: 125px;
    overflow: hidden;
    color: #188351;
    font-size: 13px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-ledger-card-amount.is-debit strong {
    color: #d75208;
}

.gy-ledger-card-footer {
    display: grid;
    grid-template-columns: minmax(90px, .75fr) minmax(0, 1.25fr);
    gap: 9px;
    border-top: 1px solid #f0e8e3;
    background: #fffcfa;
    padding: 10px 14px;
}

.gy-ledger-card-footer > div {
    display: grid;
    min-width: 0;
    align-content: center;
    gap: 4px;
}

.gy-ledger-card-footer > div:last-child {
    justify-items: end;
}

.gy-ledger-card-footer small {
    color: #a0938c;
    font-size: 8px;
    text-transform: uppercase;
}

.gy-ledger-card-footer .gy-badge {
    width: fit-content;
    padding: 5px 8px;
    font-size: 9px;
}

.gy-ledger-card-footer .gy-trx-code {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    color: #62544c;
    font-size: 9px;
    font-weight: 600;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-ledger-complete {
    display: flex;
    min-height: 40px;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(230, 89, 8, .13);
    background: #fff5ee;
    color: #d64b00;
    padding: 0 14px;
    font-size: 10px;
    font-weight: 700;
}

.gy-ledger-complete span {
    font-size: 20px;
    line-height: 1;
}

.gy-ledger-empty {
    min-height: 280px;
    align-content: center;
    border-color: #eee3dd;
    border-radius: 24px;
    background:
        radial-gradient(circle at 50% 20%, rgba(255, 226, 205, .4), transparent 32%),
        #fff;
    padding: 32px 24px;
    text-align: center;
}

.gy-ledger-empty .gy-empty-icon {
    width: 58px;
    height: 58px;
    border-radius: 19px;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
    box-shadow: 0 10px 22px rgba(218, 77, 0, .2);
}

.gy-ledger-empty .gy-empty-icon svg {
    width: 26px;
    height: 26px;
}

.gy-ledger-empty h3 {
    margin-top: 7px;
    color: #211916;
    font-size: 16px;
    font-weight: 700;
}

.gy-ledger-empty p {
    max-width: 260px;
    color: #857970;
    font-size: 11px;
    line-height: 1.5;
}

.gy-ledger-empty .gy-button {
    width: min(100%, 220px);
    margin-top: 10px;
}

@media (max-width: 350px) {
    .gy-ledger-card-main {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .gy-ledger-card-icon {
        width: 38px;
        height: 38px;
    }

    .gy-ledger-card-amount {
        grid-column: 2;
        justify-items: start;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gy-inline-spinner {
        animation-duration: 1.5s;
    }
}

/* Phase 4: plans, activity and referral network */
.gy-growth-flow {
    gap: 14px;
    padding-top: 14px;
    padding-bottom: 30px;
}

.gy-plan-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    overflow: hidden;
    border-radius: 23px;
    background: linear-gradient(135deg, #f66c13, #d94d00);
    color: #fff;
    padding: 20px;
    box-shadow: 0 13px 28px rgba(207, 69, 0, .23);
}

.gy-plan-hero > div {
    display: grid;
    gap: 3px;
}

.gy-plan-hero span:not(.gy-plan-hero-icon) {
    color: rgba(255, 255, 255, .76);
    font-size: 11px;
}

.gy-plan-hero strong {
    font-size: 19px;
}

.gy-plan-hero small {
    max-width: 245px;
    color: rgba(255, 255, 255, .82);
    font-size: 11px;
    line-height: 1.45;
}

.gy-plan-hero-icon,
.gy-referral-gift {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 16px;
    background: rgba(255, 255, 255, .15);
}

.gy-plan-hero-icon svg,
.gy-referral-gift svg {
    width: 25px;
    height: 25px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.gy-growth-head {
    margin-top: 5px;
}

.gy-growth-head h2 {
    font-size: 17px;
}

.gy-plan-card {
    position: relative;
    overflow: hidden;
    border-color: rgba(83, 53, 35, .09);
    border-radius: 22px;
    box-shadow: 0 9px 26px rgba(52, 34, 23, .06);
}

.gy-plan-card::before {
    position: absolute;
    top: 0;
    right: 0;
    width: 95px;
    height: 95px;
    border-radius: 0 0 0 100%;
    background: linear-gradient(135deg, rgba(255, 123, 40, .1), rgba(225, 76, 0, .18));
    content: '';
}

.gy-plan-card-head,
.gy-plan-price,
.gy-plan-stats,
.gy-plan-purchase {
    position: relative;
    z-index: 1;
}

.gy-plan-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.gy-plan-number {
    color: rgba(218, 77, 0, .24);
    font-size: 28px;
    font-weight: 800;
}

.gy-plan-price {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px;
    border-radius: 15px;
    background: #fff4ec;
    padding: 12px 14px;
}

.gy-plan-price span {
    color: #8a766b;
    font-size: 11px;
}

.gy-plan-price strong {
    color: #d94d00;
    font-size: 20px;
}

.gy-plan-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 10px;
}

.gy-plan-stats .gy-mini-stat {
    min-width: 0;
    border: 1px solid #eee7e3;
    border-radius: 13px;
    background: #fff;
    padding: 10px 7px;
    text-align: center;
}

.gy-plan-stats .gy-mini-stat label,
.gy-plan-stats .gy-mini-stat span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-plan-stats .gy-mini-stat label {
    font-size: 9px;
}

.gy-plan-stats .gy-mini-stat span {
    font-size: 11px;
}

.gy-plan-purchase {
    margin-top: 14px;
}

.gy-growth-flow .gy-button {
    min-height: 49px;
    border-radius: 15px;
    background: linear-gradient(135deg, #f46b12, #d94d00);
    box-shadow: 0 10px 20px rgba(218, 77, 0, .18);
}

.gy-plan-summary {
    background: linear-gradient(135deg, #f66c13, #d94d00);
    box-shadow: 0 13px 28px rgba(207, 69, 0, .23);
}

.gy-plan-summary > span {
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 12px;
    color: #fff;
    padding: 8px 10px;
    font-size: 11px;
}

.gy-investment-card {
    border-radius: 19px;
}

.gy-investment-progress {
    overflow: hidden;
    height: 6px;
    margin-top: 14px;
    border-radius: 999px;
    background: #eee9e6;
}

.gy-investment-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #f46b12, #d94d00);
}

.gy-investment-meta {
    display: flex;
    justify-content: space-between;
    margin-top: 6px;
    color: #887b74;
    font-size: 9px;
}

.gy-activity-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.gy-activity-summary > div {
    display: grid;
    min-width: 0;
    gap: 5px;
    border: 1px solid #eee5df;
    border-radius: 18px;
    background: #fff;
    padding: 14px;
    box-shadow: 0 7px 20px rgba(51, 34, 24, .045);
}

.gy-activity-summary span {
    color: #8a7f79;
    font-size: 10px;
}

.gy-activity-summary strong {
    overflow: hidden;
    color: #168453;
    font-size: 15px;
    text-overflow: ellipsis;
}

.gy-activity-summary > div:last-child strong {
    color: #c7463e;
}

.gy-incomplete-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-radius: 14px;
    background: #fff4df;
    color: #8c5a0d;
    padding: 11px 13px;
    font-size: 11px;
}

.gy-incomplete-heading small {
    color: #9b8261;
    font-size: 9px;
}

.gy-incomplete-card {
    background: #fffdf9;
}

.gy-activity-card .gy-list-main {
    align-items: center;
}

.gy-activity-title {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
}

.gy-activity-title > div {
    min-width: 0;
}

.gy-activity-icon {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border-radius: 12px;
    background: #ecf9f2;
    color: #188253;
    font-size: 19px;
}

.gy-activity-card.is-debit .gy-activity-icon {
    background: #fff0ec;
    color: #d04e42;
}

.gy-activity-card.is-credit::before {
    background: #22a363;
}

.gy-activity-card.is-debit::before {
    background: #d84949;
}

.gy-transaction-overview {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 24px;
    background:
        radial-gradient(circle at 94% 5%, rgba(255, 230, 208, .27), transparent 33%),
        linear-gradient(145deg, #fb7418, #e95805 58%, #cc4500);
    padding: 18px;
    color: #fff;
    box-shadow: 0 14px 30px rgba(190, 63, 0, .22);
}

.gy-transaction-overview::after {
    position: absolute;
    right: -45px;
    bottom: -70px;
    width: 160px;
    height: 160px;
    border: 29px solid rgba(255, 255, 255, .05);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.gy-transaction-overview-head,
.gy-transaction-totals {
    position: relative;
    z-index: 1;
}

.gy-transaction-overview-head {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
}

.gy-transaction-overview-icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 15px;
    background: rgba(104, 26, 0, .16);
}

.gy-transaction-overview-icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gy-transaction-overview-head > div {
    display: grid;
    gap: 2px;
}

.gy-transaction-overview-head > div span {
    color: rgba(255, 255, 255, .7);
    font-size: 9px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.gy-transaction-overview-head > div strong {
    color: #fff;
    font-size: 15px;
    font-weight: 700;
}

.gy-transaction-totals {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 17px;
}

.gy-transaction-totals > div {
    display: grid;
    min-width: 0;
    gap: 3px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 15px;
    background: rgba(255, 255, 255, .12);
    padding: 11px;
}

.gy-transaction-totals span,
.gy-transaction-totals small {
    color: rgba(255, 255, 255, .68);
}

.gy-transaction-totals span {
    font-size: 9px;
}

.gy-transaction-totals strong {
    overflow: hidden;
    color: #fff;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-transaction-totals small {
    font-size: 8px;
}

.gy-transaction-notice {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    border: 1px solid #f0d7b1;
    border-radius: 17px;
    background: #fff8ea;
    padding: 11px;
}

.gy-transaction-notice > span {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 12px;
    background: #ef9d22;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
}

.gy-transaction-notice > div {
    display: grid;
    gap: 2px;
}

.gy-transaction-notice strong {
    color: #704813;
    font-size: 11px;
    font-weight: 700;
}

.gy-transaction-notice small {
    color: #9a794d;
    font-size: 9px;
}

.gy-transaction-toolbar {
    padding: 12px 13px;
}

.gy-activity-card.is-credit .gy-ledger-card-icon {
    background: #eaf8f0;
    color: #188351;
}

.gy-activity-card.is-debit .gy-ledger-card-icon {
    background: #fff0e8;
    color: #d75208;
}

.gy-activity-card.gy-ledger-card::before {
    display: none;
}

.gy-referral-hero {
    display: grid;
    gap: 15px;
    border-radius: 24px;
    background: linear-gradient(145deg, #f66c13, #d94d00 68%, #b93d00);
    color: #fff;
    padding: 19px;
    box-shadow: 0 14px 30px rgba(199, 64, 0, .24);
}

.gy-referral-hero-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.gy-referral-hero-head > div {
    display: grid;
    gap: 3px;
}

.gy-referral-hero-head span:not(.gy-referral-gift) {
    color: rgba(255, 255, 255, .72);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.gy-referral-hero-head strong {
    max-width: 210px;
    font-size: 18px;
    line-height: 1.25;
}

.gy-referral-copy-group > p {
    margin: 0 0 6px;
    color: rgba(255, 255, 255, .74);
    font-size: 10px;
}

.gy-referral-copy-box {
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 13px;
    background: rgba(255, 255, 255, .12);
    padding: 7px 8px 7px 11px;
}

.gy-referral-copy-box > span {
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gy-referral-copy-box .gy-small-action {
    flex: 0 0 auto;
    border: 0;
    background: #fff;
    color: #d94d00;
}

.gy-reward-levels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.gy-reward-level {
    display: grid;
    min-width: 0;
    justify-items: center;
    gap: 3px;
    border: 1px solid #ede4de;
    border-radius: 17px;
    background: #fff;
    padding: 13px 6px;
    text-align: center;
}

.gy-reward-level span,
.gy-reward-level small {
    color: #8a7b73;
    font-size: 9px;
}

.gy-reward-level strong {
    color: #251914;
    font-size: 22px;
}

.gy-reward-level.is-primary {
    border-color: #f0a579;
    background: #fff5ee;
}

.gy-reward-level.is-primary strong {
    color: #d94d00;
}

.gy-team-links {
    gap: 7px;
}

.gy-team-link {
    border-radius: 17px;
}

.gy-team-link .gy-list-main {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
}

.gy-team-level-icon,
.gy-member-avatar {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 13px;
    background: #fff0e6;
    color: #dc5205;
    font-size: 14px;
    font-weight: 700;
}

.gy-growth-flow .gy-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
    border-radius: 15px;
    background: #f1efed;
    padding: 4px;
}

.gy-growth-flow .gy-tab {
    min-height: 40px;
    border: 0;
    border-radius: 12px;
    color: #7b716c;
}

.gy-growth-flow .gy-tab.is-active {
    background: #fff;
    color: #d94d00;
    box-shadow: 0 3px 10px rgba(54, 35, 24, .08);
}

.gy-team-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-radius: 20px;
    background: linear-gradient(135deg, #f66c13, #d94d00);
    color: #fff;
    padding: 16px 18px;
    box-shadow: 0 10px 22px rgba(207, 69, 0, .2);
}

.gy-team-summary > div {
    display: flex;
    align-items: baseline;
    gap: 9px;
}

.gy-team-summary span,
.gy-team-summary small {
    color: rgba(255, 255, 255, .78);
    font-size: 10px;
}

.gy-team-summary strong {
    font-size: 24px;
}

.gy-member-card {
    border-radius: 17px;
}

.gy-member-card .gy-list-main {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
}

.gy-member-investment {
    display: grid;
    justify-items: end;
    gap: 2px;
}

.gy-member-investment small {
    color: #948780;
    font-size: 9px;
}

.gy-member-investment strong {
    color: #d94d00;
    font-size: 12px;
}

.gy-confirm-panel {
    display: grid;
    width: min(calc(100% - 32px), 390px);
    justify-items: center;
    gap: 14px;
    border-color: rgba(218, 77, 0, .14);
    background: #fff;
    padding: 22px 18px 18px;
    text-align: center;
}

[data-gy-confirm-modal] .gy-modal-overlay {
    z-index: 2300;
}

[data-gy-confirm-modal] .gy-confirm-panel {
    z-index: 2301;
}

.gy-confirm-icon {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
    box-shadow: 0 10px 22px rgba(218, 77, 0, .22);
}

.gy-confirm-icon svg {
    width: 29px;
    height: 29px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.gy-confirm-copy {
    display: grid;
    gap: 5px;
}

.gy-confirm-copy p,
.gy-confirm-copy h3 {
    margin: 0;
}

.gy-confirm-copy .gy-eyebrow {
    color: #d94d00;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.gy-confirm-copy h3 {
    color: #201713;
    font-size: 20px;
    font-weight: 650;
}

.gy-confirm-copy h3 + p {
    max-width: 300px;
    color: #776b65;
    font-size: 13px;
    line-height: 1.45;
}

.gy-confirm-actions {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1.25fr;
    gap: 9px;
    margin-top: 3px;
}

.gy-confirm-actions > button {
    min-height: 48px;
    border-radius: 14px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
}

.gy-confirm-cancel {
    border: 1px solid #e8dfda;
    background: #f7f4f2;
    color: #5f534d;
}

.gy-confirm-actions .gy-button {
    border: 0;
    background: linear-gradient(135deg, #f46b12, #d94d00);
    color: #fff;
    box-shadow: 0 9px 19px rgba(218, 77, 0, .2);
}

/* Phase 5: profile, security and authentication */
.gy-profile-flow,
.gy-security-flow {
    gap: 14px;
    padding-top: 14px;
    padding-bottom: 30px;
}

.gy-profile-identity {
    display: flex;
    align-items: center;
    gap: 13px;
    border: 1px solid #eee5df;
    border-radius: 20px;
    background: #fff;
    padding: 14px;
    box-shadow: 0 8px 24px rgba(52, 34, 23, .055);
}

.gy-profile-avatar {
    display: grid;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(145deg, #f87516, #d94d00);
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(218, 77, 0, .2);
}

.gy-profile-identity > div {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.gy-profile-identity span:not(.gy-profile-avatar) {
    color: #8b7d75;
    font-size: 10px;
}

.gy-profile-identity strong {
    overflow: hidden;
    color: #211916;
    font-size: 16px;
    text-overflow: ellipsis;
}

.gy-profile-identity small {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #218454;
    font-size: 10px;
}

.gy-profile-identity small i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #26a665;
}

.gy-profile-balance {
    border-color: rgba(255, 255, 255, .14);
    background: linear-gradient(135deg, #f66c13, #d94d00);
    box-shadow: 0 13px 28px rgba(207, 69, 0, .23);
}

.gy-profile-balance .gy-balance-amount {
    overflow: hidden;
    max-width: 100%;
    font-variant-numeric: tabular-nums;
    text-overflow: ellipsis;
}

.gy-profile-balance .gy-stat-pill {
    border-color: rgba(255, 255, 255, .2);
    background: rgba(255, 255, 255, .13);
}

.gy-profile-balance .gy-button {
    border: 1px solid rgba(255, 255, 255, .35);
    background: rgba(255, 255, 255, .14);
    color: #fff;
    box-shadow: none;
}

.gy-profile-balance .gy-button-secondary {
    background: #fff;
    color: #d94d00;
}

.gy-profile-menu {
    gap: 7px;
}

.gy-menu-section-title {
    margin: 16px 4px 3px;
    color: #6e625c;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .02em;
}

.gy-menu-section-title:first-child {
    margin-top: 2px;
}

.gy-profile-menu .gy-menu-item {
    min-height: 66px;
    border-color: #eee6e1;
    border-radius: 17px;
    box-shadow: 0 6px 18px rgba(52, 34, 23, .045);
}

.gy-profile-menu .gy-menu-icon {
    border-radius: 13px;
    background: #fff0e6;
    color: #dc5205;
}

.gy-profile-menu .gy-menu-action {
    background: #fff4ec;
    color: #d94d00;
}

.gy-profile-menu .gy-menu-item.is-danger {
    background: #fffafa;
}

.gy-profile-menu .gy-menu-item.is-danger .gy-menu-label,
.gy-profile-menu .gy-menu-item.is-danger .gy-menu-action {
    color: #bd433b;
}

.gy-security-card {
    border-color: rgba(83, 53, 35, .09);
    border-radius: 22px;
    box-shadow: 0 9px 26px rgba(52, 34, 23, .06);
}

.gy-security-card .gy-input {
    min-height: 53px;
    border-color: #e9e2de;
    border-radius: 14px;
    background: #fcfbfa;
}

.gy-security-card .gy-input:focus {
    border-color: #eb681d;
    box-shadow: 0 0 0 3px rgba(235, 104, 29, .12);
}

.gy-security-card .gy-password-toggle {
    color: #d94d00;
}

.gy-security-card .gy-password-toggle svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.gy-security-card .gy-button {
    min-height: 50px;
    border-radius: 15px;
    background: linear-gradient(135deg, #f46b12, #d94d00);
    box-shadow: 0 10px 20px rgba(218, 77, 0, .2);
}

.gy-auth-assurance,
.gy-referral-applied {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: -4px 0 0;
    color: #7d746f;
    font-size: 10px;
}

.gy-auth-assurance span,
.gy-referral-applied span {
    display: grid;
    width: 16px;
    height: 16px;
    place-items: center;
    border-radius: 50%;
    background: #eaf8f0;
    color: #188251;
    font-size: 9px;
    font-weight: 700;
}

.gy-referral-applied {
    justify-content: flex-start;
    margin-top: 1px;
    color: #218454;
}

.gy-impersonation-banner {
    border-bottom: 1px solid rgba(218, 77, 0, .18);
    background: #fff4ec;
    color: #713514;
    padding: 10px 14px;
    font-size: 11px;
}

.gy-impersonation-banner button {
    border-radius: 10px;
    background: linear-gradient(135deg, #f46b12, #d94d00);
    padding: 8px 10px;
    white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
    .gy-home-action,
    .gy-home-info-row,
    .gy-home-community-card,
    .gy-home-wallet {
        transition: none !important;
    }
}

/* Keep the phone composition at every viewport width. */
.gy-app-bar {
    padding-right: 18px;
    padding-left: 18px;
}

.gy-content,
.gy-page-content {
    padding-right: 18px;
    padding-left: 18px;
}

.gy-home-content {
    padding: 14px 14px 24px;
}

.gy-home-balance {
    min-height: 244px;
    border-radius: 24px;
}

.gy-home-balance-copy {
    width: 72%;
    padding: 22px 16px 18px;
}

.gy-home-balance-label {
    font-size: 12px;
}

.gy-home-balance-amount {
    margin: 15px 0 21px;
    font-size: clamp(28px, 7.8vw, 34px);
}

.gy-home-balance-stats {
    gap: 8px;
}

.gy-home-stat {
    padding: 11px 10px;
}

.gy-home-stat span {
    font-size: 10px;
}

.gy-home-stat strong {
    font-size: 13px;
}

.gy-home-wallet-wrap {
    width: 48%;
}

.gy-home-wallet {
    top: -11%;
    right: -34%;
    height: 132%;
    opacity: .9;
}

.gy-home-plan-card {
    margin-top: 14px;
    border-radius: 21px;
}

.gy-home-section {
    margin-top: 24px;
}

.gy-home-section-head h2 {
    font-size: 18px;
}

.gy-home-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
}

.gy-home-action {
    min-height: 88px;
    border-radius: 17px;
}

.gy-home-action-icon {
    width: 36px;
    height: 36px;
}

.gy-home-community {
    grid-template-columns: 1fr;
    gap: 8px;
}

.gy-home-community-card {
    min-height: 82px;
    border-radius: 18px;
    padding: 12px 14px;
}

@media (max-width: 420px) {
    .gy-home-balance-copy {
        width: 78%;
    }

    .gy-home-wallet-wrap {
        width: 44%;
    }

    .gy-home-wallet {
        right: -49%;
    }
}