#member-actions { position:fixed;z-index:9100;top:15px;right:16px;display:flex;align-items:center;gap:7px; }
#member-badge {
    border:1px solid rgba(255,255,255,.45);border-radius:999px;background:rgba(0,0,0,.58);color:#fff;
    padding:5px 14px 5px 6px;backdrop-filter:blur(10px);font-weight:700;cursor:pointer;box-shadow:0 3px 15px rgba(0,0,0,.22);
    display:flex;align-items:center;gap:7px; }
#member-avatar { width:30px;height:30px;border-radius:50%;object-fit:cover;background:#fff;border:1px solid rgba(255,255,255,.7); }
#member-avatar-fallback { width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.18);font-size:1.05rem; }
#member-order-btn { width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.45);
    background:rgba(26,107,58,.86);color:#fff;font-size:1.05rem;display:flex;align-items:center;justify-content:center;
    backdrop-filter:blur(10px);cursor:pointer;box-shadow:0 3px 15px rgba(0,0,0,.22); }
#member-order-btn:hover,#member-badge:hover { filter:brightness(1.12); }
#member-login-btn {
    border:1px solid rgba(255,255,255,.5);border-radius:999px;background:rgba(0,0,0,.62);color:#fff;
    padding:9px 16px;backdrop-filter:blur(10px);font-weight:800;cursor:pointer;box-shadow:0 3px 15px rgba(0,0,0,.22);
    display:flex;align-items:center;gap:7px;white-space:nowrap;
}
#member-login-btn:hover { background:rgba(26,107,58,.9); }
@media (max-width: 1000px) {
    #member-actions { position:absolute; top:7px; right:8px; max-width:54vw; }
    #member-login-btn { padding:7px 11px; font-size:.8rem; min-height:36px; min-width:0; }
    #member-login-btn span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    #member-badge { min-width:0; max-width:120px; }
    #member-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    #member-order-btn { width:36px; height:36px; flex:0 0 36px; }
}
@media (max-width: 400px) {
    #member-name { display:none; }
    #member-badge { width:36px; height:36px; padding:2px; justify-content:center; }
    #member-avatar, #member-avatar-fallback { width:28px; height:28px; }
}

.app-modal { position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.62);display:none;align-items:center;
    justify-content:center;padding:18px;backdrop-filter:blur(5px); }
.app-modal.show { display:flex; }
.app-modal-card { width:min(460px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:20px;
    padding:26px;box-shadow:0 16px 60px rgba(0,0,0,.4);position:relative; }
.app-modal-close { position:absolute;right:14px;top:12px;border:0;background:none;font-size:1.6rem;color:#777; }
.app-modal-card h3 { color:#1a6b3a;font-weight:800;margin:0 35px 18px 0; }
.modal-field { margin-bottom:14px; }
.modal-field label { display:block;font-weight:700;margin-bottom:5px;color:#333; }
.modal-field input { width:100%;border:1.5px solid #ddd;border-radius:10px;padding:10px 12px; }
.modal-action { width:100%;border:0;border-radius:11px;padding:11px;background:#1a6b3a;color:#fff;font-weight:700;cursor:pointer; }
.modal-secondary { background:#eee;color:#444;margin-top:8px; }
.modal-msg { margin-top:10px;font-size:.9rem;color:#c0392b;min-height:1.2em; }
.login-register-link { text-align:center;margin-top:16px;font-size:.85rem;color:#777; }
.login-register-link button { background:none;border:0;color:#1a6b3a;font-weight:700;cursor:pointer;text-decoration:underline; }

.reg-subtitle { text-align:center;color:#888;font-size:.87rem;margin-bottom:18px; }
.line-register-benefit { display:flex;align-items:center;gap:11px;color:#315342;font-size:.84rem;line-height:1.55; }
.line-register-btn {
    width:100%;min-height:48px;border:0;border-radius:13px;background:#06c755;color:#fff;
    display:flex;align-items:center;justify-content:center;gap:10px;font-size:1rem;font-weight:800;
    cursor:pointer;box-shadow:0 6px 16px rgba(6,199,85,.22);transition:filter .2s,transform .1s;
}
.line-register-btn:hover { filter:brightness(.95); }
.line-register-btn:active { transform:scale(.985); }
.line-logo-mark {
    width:24px;height:24px;border-radius:7px;background:#fff;color:#06c755;
    display:grid;place-items:center;font-size:.67rem;font-weight:900;letter-spacing:-.05em;
}
.google-register-btn {
    width:100%;min-height:48px;border:1px solid #dadce0;border-radius:13px;background:#fff;color:#3c4043;
    display:flex;align-items:center;justify-content:center;gap:10px;font-size:1rem;font-weight:700;
    cursor:pointer;box-shadow:0 2px 8px rgba(60,64,67,.15);transition:filter .2s,transform .1s;
}
.google-register-btn:hover { background:#f8f9fa; }
.google-register-btn:active { transform:scale(.985); }
.google-register-btn.above-line { margin-bottom:10px; }
.google-logo-mark { width:20px;height:20px;flex-shrink:0; }
.register-divider { display:flex;align-items:center;gap:12px;color:#909993;font-size:.78rem;margin:18px 0; }
.register-divider::before,.register-divider::after { content:"";height:1px;flex:1;background:#e0e7e2; }
.reg-form-group { margin-bottom:14px; }
.reg-form-group label { display:block;font-size:.86rem;font-weight:600;color:#444;margin-bottom:5px; }
.reg-form-group input {
    width:100%;padding:11px 14px;border:2px solid #e0e0e0;border-radius:12px;font-size:.95rem;
    color:#333;outline:none;transition:border-color .2s;background:#fff;
}
.reg-form-group input:focus { border-color:#1a6b3a; }
.reg-submit-btn {
    width:100%;padding:13px;background:#1a6b3a;color:#fff;border:none;border-radius:14px;
    font-size:1rem;font-weight:700;cursor:pointer;margin-top:8px;transition:background .2s,transform .1s;
}
.reg-submit-btn:hover { background:#155232; }
.reg-submit-btn:active { transform:scale(.98); }
.reg-submit-btn:disabled { background:#aaa;cursor:not-allowed; }
.reg-error-msg {
    background:rgba(220,53,69,.08);border:1px solid rgba(220,53,69,.3);border-radius:10px;color:#dc3545;
    font-size:.87rem;padding:10px 14px;margin-top:12px;display:none;
}
.otp-email-display {
    background:rgba(26,107,58,.08);border-radius:10px;padding:10px 14px;font-size:.9rem;color:#1a6b3a;
    font-weight:600;margin-bottom:20px;text-align:center;word-break:break-all;
}
.otp-input {
    letter-spacing:.45em;font-size:2.2rem;font-weight:700;text-align:center;padding:14px 10px;width:100%;
    border:2px solid #e0e0e0;border-radius:14px;color:#333;outline:none;transition:border-color .2s;background:#fff;
}
.otp-input:focus { border-color:#1a6b3a; }
.otp-timer { font-size:.82rem;color:#888;margin-top:10px;text-align:center; }
.otp-timer span { color:#e07000;font-weight:700; }
.otp-timer span.expired { color:#dc3545; }
.reg-success { text-align:center;padding:20px 0; }
.reg-success .success-icon { font-size:4rem;display:block;margin-bottom:16px; }
.reg-success h4 { color:#1a6b3a;font-weight:800;font-size:1.3rem;margin-bottom:8px; }
