:root {
    --ink: #f2f7ff;
    --muted: #9fb3c9;
    --line: rgba(159, 179, 201, .25);
    --panel: #0d1b34;
    --panel-2: #122441;
    --soft: #10213c;
    --blue: #1fb6ff;
    --violet: #7a3cff;
    --green: #42f087;
    --red: #ff6b78;
    --amber: #f6c453;
    --shadow: 0 20px 55px rgba(0, 0, 0, .3);
}
* { box-sizing: border-box; }
html { min-height: 100%; background: #071325; }
body {
    min-height: 100vh;
    margin: 0;
    background:
        radial-gradient(circle at 18% 0, rgba(31, 182, 255, .13), transparent 34%),
        linear-gradient(180deg, #08162b 0, #071325 68%, #0b1730 100%);
    color: var(--ink);
    font-family: "Trebuchet MS", "Segoe UI", Tahoma, sans-serif;
    letter-spacing: 0;
}
.member-topbar {
    position: sticky;
    z-index: 1000;
    top: 0;
    display: flex;
    align-items: center;
    min-height: 68px;
    padding: 8px max(18px, calc((100vw - 1180px) / 2));
    border-bottom: 1px solid var(--line);
    background: rgba(7, 19, 37, .94);
    box-shadow: 0 8px 25px rgba(0, 0, 0, .22);
    backdrop-filter: blur(12px);
}
.member-brand { display: flex; align-items: center; gap: 10px; color: var(--ink); font-weight: 800; text-decoration: none; }
.member-brand img { display: block; width: 190px; max-height: 44px; object-fit: contain; filter: brightness(1.2); }
.member-brand span { padding-left: 10px; border-left: 1px solid var(--line); color: var(--blue); }
.member-nav { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.member-nav a { padding: 10px 12px; border-radius: 6px; color: #dce9f7; font-size: 14px; font-weight: 700; text-decoration: none; }
.member-nav a:hover, .member-nav .nav-primary { background: rgba(31, 182, 255, .13); color: #fff; }
.member-nav .language-switch { border: 1px solid var(--line); color: var(--green); }
.member-menu-button { display: none; margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--ink); font-size: 22px; }
.member-main { width: min(1120px, calc(100% - 32px)); min-height: calc(100vh - 126px); margin: 0 auto; padding: 34px 0 54px; }
.member-footer { padding: 20px; border-top: 1px solid rgba(255, 255, 255, .07); color: var(--muted); text-align: center; font-size: 12px; }
.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.page-head h1 { margin: 0 0 7px; font-size: 30px; }
.page-head p { margin: 0; color: var(--muted); line-height: 1.6; }
.profile-head-actions { display: flex; align-items: flex-end; flex-direction: column; gap: 10px; }
.panel { border: 1px solid var(--line); border-radius: 8px; background: rgba(13, 27, 52, .96); box-shadow: var(--shadow); }
.panel-body { padding: 24px; }
.auth-shell { display: grid; grid-template-columns: minmax(0, 500px); justify-content: center; padding-top: 24px; }
.member-form-shell { display: grid; grid-template-columns: minmax(0, 820px); justify-content: center; }
.auth-logo { display: block; width: min(260px, 72%); margin: 0 auto 24px; filter: brightness(1.25); }
.auth-title { text-align: center; }
.auth-title h1 { margin: 0 0 8px; font-size: 28px; }
.auth-title p { margin: 0 0 24px; color: var(--muted); line-height: 1.55; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.field { display: grid; gap: 7px; align-content: start; min-width: 0; }
.field.full { grid-column: 1 / -1; }
.field label, .choice-field legend { color: #eaf3ff; font-size: 13px; font-weight: 800; }
.field input, .field select, .field textarea {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid #35506d;
    border-radius: 6px;
    background: #09172c;
    color: var(--ink);
    font: inherit;
}
.field input:disabled { color: #9eb1c7; background: #0c1a30; }
.field textarea { min-height: 92px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--blue); outline: 3px solid rgba(31, 182, 255, .15); }
.field-help { color: var(--muted); font-size: 12px; line-height: 1.5; }
.field-error { color: var(--red); font-size: 12px; }
.check-field { display: flex; align-items: flex-start; gap: 10px; color: #d8e6f6; font-size: 13px; line-height: 1.55; }
.check-field input { width: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--blue); }
.button-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid #45617f;
    border-radius: 6px;
    background: #112440;
    color: var(--ink);
    font: inherit;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}
.button.primary { border-color: var(--blue); background: #126fb4; color: #fff; }
.button.success { border-color: var(--green); background: #147348; color: #fff; }
.button.danger { border-color: #7d3540; color: var(--red); }
.button:disabled { cursor: not-allowed; opacity: .5; }
.text-link { color: var(--blue); font-weight: 700; text-decoration: none; }
.notice { margin-bottom: 18px; padding: 13px 15px; border: 1px solid #28658a; border-radius: 6px; background: #0c2a45; line-height: 1.5; }
.notice.success { border-color: #21794c; background: #0b3524; color: #8af0b7; }
.notice.error { border-color: #843744; background: #35151d; color: #ffadb5; }
.notice.warning { border-color: #7a6428; background: #322810; color: #f7d77d; }
.dashboard-grid { display: grid; grid-template-columns: 1.3fr .7fr; gap: 18px; }
.identity-card { display: grid; grid-template-columns: 92px 1fr; gap: 20px; align-items: center; }
.profile-photo { width: 92px; height: 92px; border: 1px solid var(--line); border-radius: 8px; background: #142843; object-fit: cover; }
.profile-photo.is-empty { display: none; }
.profile-photo-control { display: flex; align-items: center; gap: 16px; }
.profile-photo-control > div { display: grid; flex: 1; gap: 7px; }
.profile-placeholder { display: grid; place-items: center; color: var(--blue); font-size: 34px; font-weight: 800; }
.badminger-id { color: var(--green); font-size: 24px; font-weight: 900; }
.button-icon { display: inline-flex; align-items: center; margin-right: 7px; font-size: 17px; line-height: 1; }
.muted { color: var(--muted); }
.quick-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.quick-link { display: grid; gap: 6px; min-height: 96px; padding: 16px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--ink); text-decoration: none; }
.quick-link strong { color: var(--blue); }
.data-list { display: grid; }
.data-row { display: grid; grid-template-columns: 180px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.data-row:last-child { border: 0; }
.data-row dt { color: var(--muted); font-size: 13px; }
.data-row dd { margin: 0; font-weight: 700; }
.member-qr { display: block; width: min(280px, 100%); height: auto; margin: 0 auto; border: 12px solid #fff; }
.id-card { text-align: center; }
.id-card h1 { margin-bottom: 6px; }
.id-card .profile-photo { margin: 8px auto; }
.member-card-shell { display: grid; justify-items: center; gap: 18px; width: 100%; padding: 18px 0 30px; }
.premium-member-card {
    --card-base: #071b2c;
    --card-surface: #0b4350;
    --card-accent: #40e0c0;
    --card-accent-2: #ffcc66;
    --card-border: rgba(64, 224, 192, .62);
    --card-panel: rgba(11, 67, 80, .84);
    --card-avatar-shadow: rgba(255, 204, 102, .3);
    --card-text: #f8fbff;
    position: relative;
    isolation: isolate;
    container-type: inline-size;
    width: min(760px, 100%);
    aspect-ratio: 85.6 / 53.98;
    overflow: hidden;
    padding: 3.4cqw 4.2cqw 3cqw;
    border: 1px solid var(--card-border);
    border-radius: 8px;
    background: var(--card-base);
    color: var(--card-text);
    box-shadow: 0 28px 70px rgba(0, 0, 0, .42), inset 0 0 0 1px rgba(255, 255, 255, .08);
}
.card-theme-1 { --card-base: #251119; --card-surface: #6d2330; --card-accent: #ff7468; --card-accent-2: #62d8ff; --card-border: rgba(255, 116, 104, .64); --card-panel: rgba(109, 35, 48, .84); --card-avatar-shadow: rgba(98, 216, 255, .3); }
.card-theme-2 { --card-base: #10172e; --card-surface: #2c4397; --card-accent: #66e5ff; --card-accent-2: #f2d55e; --card-border: rgba(102, 229, 255, .62); --card-panel: rgba(44, 67, 151, .84); --card-avatar-shadow: rgba(242, 213, 94, .3); }
.card-theme-3 { --card-base: #0b241f; --card-surface: #17614e; --card-accent: #8ef0b8; --card-accent-2: #ff9e66; --card-border: rgba(142, 240, 184, .62); --card-panel: rgba(23, 97, 78, .84); --card-avatar-shadow: rgba(255, 158, 102, .3); }
.card-theme-4 { --card-base: #181a20; --card-surface: #424b58; --card-accent: #dce9f4; --card-accent-2: #43baff; --card-border: rgba(220, 233, 244, .58); --card-panel: rgba(66, 75, 88, .84); --card-avatar-shadow: rgba(67, 186, 255, .3); }
.card-theme-5 { --card-base: #24152f; --card-surface: #68417d; --card-accent: #f2a8ff; --card-accent-2: #65eecb; --card-border: rgba(242, 168, 255, .62); --card-panel: rgba(104, 65, 125, .84); --card-avatar-shadow: rgba(101, 238, 203, .3); }
.premium-member-card::before {
    position: absolute;
    z-index: -3;
    inset: 0;
    background: repeating-linear-gradient(118deg, transparent 0 22px, rgba(255, 255, 255, .025) 22px 23px);
    content: "";
}
.premium-member-card::after {
    position: absolute;
    z-index: -2;
    top: -26%;
    right: -8%;
    width: 66%;
    height: 155%;
    transform: rotate(15deg);
    border-left: 1px solid var(--card-border);
    background: var(--card-panel);
    clip-path: polygon(32% 0, 100% 0, 78% 100%, 0 100%);
    content: "";
}
.member-card-art, .member-card-art span, .member-card-art i { position: absolute; display: block; pointer-events: none; }
.member-card-art { z-index: -1; inset: 0; }
.member-card-art span { height: 1px; background: var(--card-accent); opacity: .38; transform-origin: left center; }
.member-card-art span:nth-child(1) { top: 25%; left: 50%; width: 58%; transform: rotate(-28deg); }
.member-card-art span:nth-child(2) { top: 67%; left: 44%; width: 68%; transform: rotate(18deg); background: var(--card-accent-2); }
.member-card-art span:nth-child(3) { top: 84%; left: 8%; width: 52%; transform: rotate(-12deg); opacity: .2; }
.member-card-art i { right: 7%; bottom: -19%; width: 34%; aspect-ratio: 1; border: 1px solid var(--card-accent-2); transform: rotate(38deg); opacity: .19; }
.card-pattern-1 .member-card-art span:nth-child(1) { top: 12%; left: 42%; transform: rotate(34deg); }
.card-pattern-1 .member-card-art span:nth-child(2) { top: 78%; left: 35%; transform: rotate(-34deg); }
.card-pattern-1 .member-card-art i { right: 13%; bottom: 6%; width: 24%; transform: rotate(16deg); }
.card-pattern-2 .member-card-art span:nth-child(1) { top: 18%; left: 38%; width: 72%; transform: rotate(-8deg); }
.card-pattern-2 .member-card-art span:nth-child(2) { top: 55%; left: 52%; width: 45%; transform: rotate(52deg); }
.card-pattern-2 .member-card-art i { right: -8%; bottom: 18%; width: 42%; transform: rotate(58deg); }
.card-pattern-3 .member-card-art span:nth-child(1) { top: 34%; left: 35%; transform: rotate(22deg); }
.card-pattern-3 .member-card-art span:nth-child(2) { top: 72%; left: 26%; transform: rotate(-18deg); }
.card-pattern-3 .member-card-art i { right: 19%; bottom: -16%; width: 30%; transform: rotate(45deg); }
.member-card-header, .member-card-footer { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; }
.member-card-header { height: 7cqw; }
.member-card-brand { display: flex; align-items: center; gap: 1.5cqw; min-width: 0; }
.member-card-brand img { display: block; width: 25cqw; max-width: none; height: auto; filter: brightness(1.45); }
.member-card-brand span { padding-left: 1.5cqw; border-left: 1px solid rgba(255, 255, 255, .3); color: rgba(255, 255, 255, .72); font-size: 1.7cqw; font-weight: 800; text-transform: uppercase; }
.member-card-edition { display: grid; justify-items: end; gap: .4cqw; color: var(--card-accent); font-size: 1.35cqw; letter-spacing: 0; }
.member-card-edition b { color: rgba(255, 255, 255, .72); font-family: Consolas, monospace; font-size: 1.45cqw; }
.member-card-body { position: relative; z-index: 2; display: grid; grid-template-columns: 18cqw minmax(0, 1fr) 16.8cqw; gap: 3.2cqw; align-items: center; height: 42cqw; }
.member-card-avatar { position: relative; width: 18cqw; aspect-ratio: 1; padding: .75cqw; border: 1px solid var(--card-border); border-radius: 8px; background: rgba(2, 10, 20, .58); box-shadow: .9cqw 1.2cqw 0 var(--card-avatar-shadow); }
.member-card-avatar img, .generated-avatar { display: block; width: 100%; height: 100%; border-radius: 5px; object-fit: cover; }
.generated-avatar { position: relative; isolation: isolate; display: grid; place-items: center; overflow: hidden; background: var(--card-surface); color: white; font-size: 6.2cqw; font-weight: 900; }
.generated-avatar::before, .generated-avatar::after { position: absolute; z-index: -1; content: ""; }
.generated-avatar::before { top: -22%; right: -18%; width: 76%; height: 76%; transform: rotate(28deg); background: var(--card-accent); opacity: .62; }
.generated-avatar::after { bottom: -28%; left: -20%; width: 90%; height: 74%; transform: rotate(-18deg); background: var(--card-accent-2); opacity: .48; }
.avatar-style-1 .generated-avatar::before { inset: -12% auto auto -18%; transform: rotate(48deg); }
.avatar-style-1 .generated-avatar::after { right: -15%; bottom: -25%; left: auto; transform: rotate(24deg); }
.avatar-style-2 .generated-avatar::before { top: -36%; right: 10%; width: 42%; height: 150%; transform: rotate(34deg); }
.avatar-style-2 .generated-avatar::after { bottom: -45%; left: -20%; width: 145%; height: 62%; transform: rotate(8deg); }
.avatar-style-3 .generated-avatar::before { top: 8%; right: -30%; width: 82%; height: 82%; transform: rotate(45deg); }
.avatar-style-3 .generated-avatar::after { bottom: 4%; left: -35%; width: 72%; height: 72%; transform: rotate(45deg); }
.avatar-style-4 .generated-avatar::before { top: -55%; right: -4%; width: 58%; height: 180%; transform: rotate(-20deg); }
.avatar-style-4 .generated-avatar::after { bottom: -22%; left: -16%; width: 74%; height: 64%; transform: rotate(34deg); }
.avatar-style-5 .generated-avatar::before { top: -20%; right: -8%; width: 110%; height: 42%; transform: rotate(-12deg); }
.avatar-style-5 .generated-avatar::after { bottom: -12%; left: -8%; width: 110%; height: 42%; transform: rotate(12deg); }
.avatar-style-6 .generated-avatar::before { top: -22%; right: -28%; width: 90%; height: 90%; transform: rotate(62deg); }
.avatar-style-6 .generated-avatar::after { bottom: -32%; left: 4%; width: 58%; height: 92%; transform: rotate(-38deg); }
.avatar-style-7 .generated-avatar::before { top: -40%; right: 22%; width: 34%; height: 180%; transform: rotate(38deg); }
.avatar-style-7 .generated-avatar::after { bottom: -16%; left: -28%; width: 85%; height: 58%; transform: rotate(18deg); }
.member-card-identity { min-width: 0; align-self: center; }
.member-card-label { display: block; margin-bottom: .4cqw; color: var(--card-accent); font-size: 1.45cqw; font-weight: 900; }
.member-card-id { display: block; color: white; font-family: Consolas, monospace; font-size: 3.2cqw; letter-spacing: 0; white-space: nowrap; }
.member-card-identity h1 { max-width: 100%; margin: 1.5cqw 0 1.8cqw; overflow: hidden; color: white; font-size: 4.5cqw; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.member-card-meta { display: flex; gap: 1.1cqw; flex-wrap: wrap; }
.member-card-meta span { padding: .65cqw 1cqw; border: 1px solid rgba(255, 255, 255, .2); border-radius: 4px; background: rgba(2, 10, 20, .38); color: rgba(255, 255, 255, .7); font-size: 1.45cqw; white-space: nowrap; }
.member-card-meta b { color: white; }
.member-card-qr-wrap { display: grid; justify-items: center; gap: .85cqw; align-self: center; }
.member-card-qr { display: block; width: 15.2cqw; height: 15.2cqw; padding: .75cqw; border-radius: 5px; background: white; object-fit: contain; }
.member-card-qr-wrap span { color: rgba(255, 255, 255, .72); font-size: 1.2cqw; font-weight: 900; text-transform: uppercase; white-space: nowrap; }
.member-card-footer { color: rgba(255, 255, 255, .58); font-size: 1.45cqw; font-weight: 800; }
.member-card-footer b { color: var(--card-accent-2); font-family: Consolas, monospace; }
.member-card-actions { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.member-card-actions .button { gap: 8px; min-width: 150px; }
.member-card-actions .button span { font-size: 20px; line-height: 1; }
.member-card-help { max-width: 600px; margin: -4px 0 0; color: var(--muted); text-align: center; font-size: 13px; line-height: 1.55; }
.history-toolbar { display: grid; gap: 7px; margin-bottom: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--panel); }
.history-toolbar > label { font-size: 13px; font-weight: 800; }
.history-toolbar > div { display: flex; gap: 8px; }
.history-toolbar input { min-width: 0; flex: 1; }
.history-toolbar small { color: var(--muted); }
.history-stack { display: grid; gap: 14px; }
.history-item { padding: 18px; border: 1px solid var(--line); border-radius: 7px; background: var(--panel); }
.history-title { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 10px; }
.history-title strong { font-size: 17px; }
.history-meta { display: flex; gap: 12px; flex-wrap: wrap; color: var(--muted); font-size: 13px; }
.amount { color: var(--green); font-size: 20px; font-weight: 900; }
.history-event-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.history-performance { display: flex; gap: 6px; flex-wrap: wrap; }
.history-performance span { min-width: 48px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 5px; background: var(--soft); color: var(--muted); text-align: center; font-size: 11px; font-weight: 800; }
.history-performance b { color: var(--ink); font-size: 13px; }
.match-list { display: grid; gap: 8px; margin-top: 12px; }
.match-line { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-left: 3px solid var(--blue); background: var(--soft); font-size: 13px; line-height: 1.5; }
.match-line > div { display: grid; gap: 2px; min-width: 0; }
.match-line > div span { overflow-wrap: anywhere; }
.match-outcome { display: inline-flex; align-items: center; justify-content: space-between; gap: 7px; min-width: 94px; padding: 6px 8px; border-radius: 5px; font-size: 12px; font-weight: 900; white-space: nowrap; }
.match-outcome b { font-size: 10px; }
.match-outcome.win { background: rgba(38, 177, 102, .16); color: #24a56a; }
.match-outcome.draw { background: rgba(245, 158, 11, .16); color: #d68b09; }
.match-outcome.loss { background: rgba(239, 68, 68, .14); color: #dc5757; }
.match-outcome.pending { background: rgba(100, 116, 139, .14); color: var(--muted); }
.history-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 18px; }
.history-pagination span { color: var(--muted); font-size: 13px; }
.history-pagination .disabled { pointer-events: none; opacity: .42; }
.empty-state { padding: 44px 20px; color: var(--muted); text-align: center; }
.checkin-box { text-align: center; }
.checkin-box h1 { margin-bottom: 8px; }
.checkin-mark { display: grid; place-items: center; width: 74px; height: 74px; margin: 0 auto 18px; border-radius: 50%; background: #0c3c28; color: var(--green); font-size: 38px; font-weight: 900; }
.divider { height: 1px; margin: 22px 0; background: var(--line); }
.divider-label { display: flex; align-items: center; gap: 12px; margin: 20px 0; color: var(--muted); font-size: 12px; }
.divider-label::before, .divider-label::after { height: 1px; flex: 1; background: var(--line); content: ""; }

.choice-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.choice-field legend { margin-bottom: 9px; }
.field-question { margin: 0 0 10px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.choice-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.skill-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.hand-grid { grid-template-columns: repeat(2, minmax(0, 180px)); }
.day-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.time-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.visibility-grid { grid-template-columns: repeat(2, minmax(0, 180px)); }
.choice-chip { position: relative; display: block; min-width: 0; cursor: pointer; }
.choice-chip input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.choice-chip span { display: flex; align-items: center; justify-content: center; min-height: 43px; padding: 8px; border: 1px solid #35506d; border-radius: 6px; background: #09172c; color: #cddced; text-align: center; font-size: 13px; font-weight: 800; line-height: 1.25; }
.choice-chip input:checked + span { border-color: var(--blue); background: rgba(31, 182, 255, .16); color: #fff; box-shadow: inset 0 0 0 1px var(--blue); }
.choice-chip input:focus-visible + span { outline: 3px solid rgba(31, 182, 255, .2); }
.current-location-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.map-current-button { padding: 5px 9px; border: 1px solid #3c6582; border-radius: 5px; background: #102a45; color: var(--blue); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.map-current-button:disabled { cursor: not-allowed; opacity: .45; }
.current-location-status { display: flex; align-items: center; gap: 9px; min-height: 52px; padding: 12px 14px; border: 1px solid #35506d; border-radius: 7px; background: #14243a; color: var(--muted); }
.current-location-status span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #334155; color: #cbd5e1; font-size: 10px; }
.current-location-status.is-ready { border-color: #208a6d; background: rgba(20, 128, 99, .15); color: #b9f6df; }
.current-location-status.is-ready span { background: #168665; color: #fff; font-size: 13px; }

.crop-dialog { width: min(680px, calc(100% - 24px)); padding: 0; border: 1px solid #35506d; border-radius: 8px; background: var(--panel); color: var(--ink); box-shadow: var(--shadow); }
.crop-dialog::backdrop { background: rgba(2, 8, 18, .82); }
.crop-dialog-head { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding: 10px 16px; border-bottom: 1px solid var(--line); }
.crop-dialog-head h2 { margin: 0; font-size: 19px; }
.crop-close { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--line); border-radius: 6px; background: #112440; color: var(--ink); font-size: 26px; cursor: pointer; }
.crop-stage { height: min(62vh, 540px); min-height: 300px; background: #050d1a; }
.crop-stage img { display: block; max-width: 100%; }
.crop-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 16px; border-top: 1px solid var(--line); }
.qr-scan-dialog { width: min(560px, calc(100% - 24px)); padding: 0; border: 1px solid #35506d; border-radius: 8px; background: var(--panel); color: var(--ink); box-shadow: var(--shadow); }
.qr-scan-dialog::backdrop { background: rgba(2, 8, 18, .86); }
.qr-scan-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 16px; border-bottom: 1px solid var(--line); }
.qr-scan-head h2 { margin: 0 0 5px; font-size: 20px; }
.qr-scan-head p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.qr-reader { min-height: 320px; padding: 12px; background: #050d1a; }
.qr-reader video { border-radius: 6px; object-fit: cover; }
.qr-reader img { max-width: 100%; }
.qr-scan-message { margin: 14px 16px 0; }
.qr-scan-actions { display: flex; justify-content: flex-end; padding: 14px 16px; border-top: 1px solid var(--line); }

.social-login { margin-bottom: 20px; }
.social-login > p { margin: 0 0 10px; color: var(--muted); text-align: center; font-size: 13px; }
.social-buttons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.social-button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: #f8fafc; color: #15263b; font-size: 13px; font-weight: 800; text-decoration: none; }
.social-logo { display: block; width: 24px; height: 24px; flex: 0 0 24px; object-fit: contain; }
.social-button.line { background: #06c755; color: #fff; }
.social-button.facebook { background: #1877f2; color: #fff; }
.social-button.google { background: #fff; color: #27384c; }
.social-button.connected { border-color: #287d53; background: #103b2a; color: #8ef0b8; }
.social-button.disabled { filter: grayscale(1); opacity: .4; }
.privacy-notice { width: min(840px, 100%); margin: 0 auto; }
.privacy-notice h2 { margin: 26px 0 7px; font-size: 19px; }
.privacy-notice p { margin: 0; color: #c3d1e1; line-height: 1.75; }
.bm-cookie-consent { position: fixed; z-index: 5000; right: 18px; bottom: 18px; left: 18px; display: flex; align-items: center; justify-content: space-between; gap: 18px; width: min(760px, calc(100% - 36px)); margin-left: auto; padding: 16px 18px; border: 1px solid #355f80; border-radius: 8px; background: #0b1b32; color: #eef6ff; box-shadow: 0 20px 55px rgba(0, 0, 0, .4); }
.bm-cookie-consent strong { display: block; margin-bottom: 3px; }
.bm-cookie-consent p { margin: 0; color: #b8c9dc; font-size: 13px; line-height: 1.55; }
.bm-cookie-consent a { color: var(--blue); font-weight: 800; }
.bm-cookie-consent button { flex: 0 0 auto; min-width: 92px; min-height: 42px; border: 0; border-radius: 6px; background: #126fb4; color: #fff; font: inherit; font-weight: 800; cursor: pointer; }

@media (max-width: 760px) {
    .member-main { width: min(100% - 24px, 1120px); padding-top: 22px; }
    .member-menu-button { display: block; }
    .member-nav { position: absolute; display: none; right: 12px; top: 60px; width: min(300px, calc(100% - 24px)); padding: 8px; border: 1px solid var(--line); border-radius: 7px; background: #0b1b32; box-shadow: var(--shadow); }
    .menu-open .member-nav { display: grid; }
    .member-brand img { width: 158px; }
    .member-brand span { display: none; }
    .dashboard-grid, .form-grid { grid-template-columns: 1fr; }
    .field.full { grid-column: auto; }
    .page-head { display: block; }
    .page-head .button { margin-top: 14px; }
    .profile-head-actions { align-items: flex-start; margin-top: 14px; }
    .profile-head-actions .button { width: 100%; margin-top: 0; }
    .identity-card { grid-template-columns: 72px 1fr; }
    .profile-photo { width: 72px; height: 72px; }
    .badminger-id { font-size: 20px; }
    .data-row { grid-template-columns: 1fr; gap: 3px; }
    .history-title { display: block; }
    .amount { margin-top: 8px; }
    .history-toolbar > div { flex-wrap: wrap; }
    .history-toolbar input { flex-basis: 100%; }
    .history-toolbar .button { flex: 1; margin-top: 0; }
    .history-event-summary { align-items: flex-start; flex-direction: column; }
    .history-performance { width: 100%; }
    .history-performance span { flex: 1; }
    .match-line { align-items: stretch; flex-direction: column; }
    .match-outcome { align-self: flex-start; }
    .quick-links { grid-template-columns: 1fr 1fr; }
    .choice-grid, .day-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .skill-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hand-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .time-grid, .visibility-grid { grid-template-columns: 1fr; }
    .social-buttons { grid-template-columns: 1fr; }
    .bm-cookie-consent { align-items: stretch; flex-direction: column; }
    .bm-cookie-consent button { width: 100%; }
    .profile-photo-control { align-items: flex-start; }
    .crop-stage { min-height: 260px; }
    .qr-reader { min-height: 280px; }
    .panel-body { padding: 18px; }
    .member-card-shell { padding-top: 0; }
    .premium-member-card { width: min(760px, 100%); }
    .member-card-actions { width: 100%; }
    .member-card-actions .button { min-width: 0; flex: 1; padding: 0 12px; }
}
