
.profile-page{background:var(--brand-white);color:var(--color-text-primary);font-family:var(--font-family-sans,"Roboto","Noto Sans Thai",Arial,sans-serif)}
.profile-page button,.profile-page input{font:inherit;color:inherit}.profile-header{background:var(--brand-white);border-bottom:1px solid var(--color-border)}
.profile-header-icon{border:0;background:transparent;padding:8px;display:grid;place-items:center;cursor:pointer}.profile-header-icon img{width:24px;height:24px}.profile-search{border:1px solid var(--color-border);background:var(--brand-white);overflow:hidden}.profile-search input{border:0;outline:0;background:transparent;padding:0 18px;font-size:16px;line-height:24px}.profile-search input::placeholder{color:var(--color-text-placeholder)}.profile-search button{border:0;background:transparent;cursor:pointer}.profile-notification-dot{position:absolute;right:7px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--brand-yellow);border:2px solid var(--brand-white)}.profile-account{border:0;background:transparent;display:flex;align-items:center;gap:8px;padding:0;cursor:pointer;font-size:14px;line-height:20px;font-weight:500;white-space:nowrap}.profile-account .account-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover}.profile-account .account-chevron{width:20px;height:20px}.profile-sidebar{background:var(--brand-white);border-right:1px solid var(--color-border)}
.profile-main-v2.app-main>.page-shell--profile-v2{width:100%;min-width:0;max-width:none;padding:24px}.profile-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.profile-title-row h1{margin:0;font-size:20px;line-height:28px;font-weight:700}.profile-title-row p{margin:4px 0 0;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-secondary)}.profile-edit-button{height:36px;border:1px solid var(--color-border-strong);border-radius:18px;background:var(--brand-white);display:inline-flex;align-items:center;gap:8px;padding:0 16px;font-size:14px;line-height:20px;font-weight:500;cursor:pointer}.profile-edit-button img{width:20px;height:20px}
.profile-summary-card{margin-top:16px;min-height:150px;border:1px solid var(--color-border);border-radius:12px;background:var(--brand-white);display:grid;grid-template-columns:minmax(0,1.55fr) 1px minmax(310px,.72fr);align-items:center;padding:20px 24px;gap:24px}.profile-summary-left{display:flex;align-items:center;gap:20px;min-width:0}.profile-avatar-wrap{position:relative;flex:0 0 96px;width:96px;height:96px}.profile-avatar{width:96px;height:96px;border-radius:50%;object-fit:cover;border:1px solid var(--color-border)}.profile-camera-button{position:absolute;right:-2px;bottom:2px;width:36px;height:36px;border-radius:50%;border:1px solid var(--color-border-strong);background:var(--brand-white);display:grid;place-items:center;cursor:pointer}.profile-camera-button img{width:20px;height:20px}.profile-identity{min-width:0}.profile-name-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.profile-name-line h2{margin:0;font-size:20px;line-height:28px;font-weight:600}.demo-chip{display:inline-flex;align-items:center;min-height:22px;padding:1px 7px;border-radius:4px;background:var(--gray-100);color:var(--color-text-secondary);font-size:12px;line-height:18px;font-weight:500}.profile-identity>p{margin:2px 0 10px;font-size:14px;line-height:20px;color:var(--color-text-secondary)}.profile-identity-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.member-badge,.join-date{display:inline-flex;align-items:center;gap:6px;font-size:13px;line-height:18px}.member-badge{min-height:28px;padding:4px 8px;border:1px solid rgba(253,200,6,.45);border-radius:6px;background:#FFF9E4;color:#6D5500;font-weight:500}.member-badge img,.join-date img{width:20px;height:20px}.join-date{color:var(--color-text-secondary)}.profile-summary-divider{height:92px;background:var(--color-border)}.profile-access-summary{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;align-items:center}.access-icon{width:52px;height:52px;border-radius:10px;background:var(--gray-050);border:1px solid var(--color-border);display:grid;place-items:center}.access-icon img{width:24px;height:24px}.profile-access-summary>div:last-child{display:grid;gap:3px}.profile-access-summary span{font-size:13px;line-height:18px;color:var(--color-text-secondary)}.profile-access-summary strong{font-size:16px;line-height:20px;font-weight:600}.profile-access-summary a{display:inline-flex;align-items:center;gap:3px;width:max-content;text-decoration:none;color:var(--color-text-primary);font-size:14px;line-height:20px;font-weight:500}.profile-access-summary a img{width:16px;height:16px}
.profile-tabs-v2{margin-top:8px;height:48px;border-bottom:1px solid var(--color-border);display:flex;align-items:flex-end;gap:24px}.profile-tab-v2{position:relative;height:48px;padding:0 4px 12px;border:0;background:transparent;font-size:14px;line-height:20px;font-weight:500;color:var(--color-text-secondary);cursor:pointer}.profile-tab-v2.is-active{color:var(--color-text-primary)}.profile-tab-v2.is-active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--brand-yellow)}
.profile-tab-panel{padding-top:16px}.profile-body-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(330px,.86fr);gap:20px;align-items:start}.profile-left-column,.profile-right-rail{display:grid;gap:16px;min-width:0}.profile-card{border:1px solid var(--color-border);border-radius:12px;background:var(--brand-white);padding:16px;box-shadow:none}.profile-card h2{margin:0;font-size:20px;line-height:28px;font-weight:600}.profile-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.usage-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:16px}.usage-metric{min-width:0;min-height:72px;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:10px;padding:0 16px;border-left:1px solid var(--color-border)}.usage-metric:first-child{border-left:0;padding-left:0}.usage-metric:last-child{padding-right:0}.metric-icon{width:38px;height:38px;border-radius:8px;background:var(--gray-050);border:1px solid var(--color-border);display:grid;place-items:center}.metric-icon img{width:24px;height:24px}.usage-metric>div{display:grid;gap:2px}.usage-metric span{font-size:13px;line-height:18px;color:var(--color-text-secondary)}.usage-metric strong{font-size:24px;line-height:28px;font-weight:700}.continue-card{padding-bottom:4px}.continue-row{min-height:70px;border-top:1px solid var(--color-border);display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center}.continue-row:first-of-type{margin-top:10px}.continue-icon{width:36px;height:36px;border-radius:8px;background:var(--gray-050);border:1px solid var(--color-border);display:grid;place-items:center}.continue-icon img{width:24px;height:24px}.continue-copy{display:grid;gap:2px}.continue-copy strong{font-size:14px;line-height:20px;font-weight:500}.continue-copy span{font-size:13px;line-height:18px;color:var(--color-text-secondary)}.profile-primary-small,.profile-secondary-small{height:32px;min-height:32px;padding:0 12px;border-radius:16px;font-size:14px;line-height:20px;font-weight:500;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;cursor:pointer}.profile-primary-small{border:1px solid var(--brand-yellow);background:var(--brand-yellow);color:var(--brand-black)}.profile-secondary-small{border:1px solid var(--color-border-strong);background:var(--brand-white);color:var(--color-text-primary)}.text-action{border:0;background:transparent;padding:0;display:inline-flex;align-items:center;gap:2px;font-size:14px;line-height:20px;font-weight:500;cursor:pointer}.text-action img{width:16px;height:16px}.account-fields{margin:12px 0 0}.account-fields>div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:16px;min-height:42px;align-items:center;border-top:1px solid var(--color-border)}.account-fields>div:first-child{border-top:0}.account-fields dt{font-size:14px;line-height:20px;color:var(--color-text-secondary)}.account-fields dd{margin:0;font-size:14px;line-height:20px;font-weight:500}.status-list{display:grid;margin-top:10px}.status-row{min-height:42px;border-top:1px solid var(--color-border);display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px}.status-row:first-child{border-top:0}.status-row>img{width:20px;height:20px}.status-row span{font-size:14px;line-height:20px}.status-row em{font-size:12px;line-height:18px;font-style:normal;color:var(--color-text-secondary)}.status-chip{padding:2px 7px;border-radius:4px;background:#EAF6EE;color:#287A43!important}.status-chip.status-pending{background:var(--gray-100);color:var(--color-text-secondary)!important}.profile-full-button{width:100%;height:36px;margin-top:10px;border:1px solid var(--color-border-strong);border-radius:18px;background:var(--brand-white);font-size:14px;line-height:20px;font-weight:500;cursor:pointer}.notification-settings{display:grid;margin-top:8px}.notification-settings label,.notification-detail-list label{min-height:42px;border-top:1px solid var(--color-border);display:grid;grid-template-columns:minmax(0,1fr) 42px;align-items:center;gap:12px;cursor:pointer}.notification-settings label:first-child,.notification-detail-list label:first-child{border-top:0}.notification-settings label>span{font-size:14px;line-height:20px}.notification-settings input,.notification-detail-list input{position:absolute;opacity:0;pointer-events:none}.notification-settings i,.notification-detail-list i{position:relative;width:40px;height:22px;border-radius:999px;background:var(--gray-300);transition:.16s}.notification-settings i::after,.notification-detail-list i::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:var(--brand-white);box-shadow:0 1px 2px rgba(0,0,0,.18);transition:.16s}.notification-settings input:checked+i,.notification-detail-list input:checked+i{background:var(--brand-yellow)}.notification-settings input:checked+i::after,.notification-detail-list input:checked+i::after{transform:translateX(18px)}.notification-all{margin-top:8px;margin-left:auto}.help-card{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:center}.help-icon{width:40px;height:40px;border-radius:50%;background:var(--gray-050);display:grid;place-items:center}.help-icon img{width:24px;height:24px}.help-card>div{display:grid;gap:4px}.help-card strong{font-size:14px;line-height:20px;font-weight:600}.help-card .text-action{width:max-content}
.profile-settings-layout{max-width:880px}.settings-form-card{padding:20px}.profile-form{display:grid;gap:16px;margin-top:16px}.profile-form label{display:grid;gap:8px;font-size:14px;line-height:20px;font-weight:500}.profile-form input{height:40px;border:1px solid var(--color-border-strong);border-radius:8px;background:var(--brand-white);padding:0 12px;outline:0;font-size:14px;font-weight:400}.profile-form input:focus{border-color:var(--brand-yellow);box-shadow:0 0 0 2px rgba(253,200,6,.18)}.form-actions{display:flex;justify-content:flex-end;gap:8px}.security-detail-list{display:grid;margin-top:12px}.security-detail-list>div{min-height:68px;border-top:1px solid var(--color-border);display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:12px}.security-detail-list>div:first-child{border-top:0}.security-detail-list img{width:24px;height:24px}.security-detail-list span{display:grid;gap:2px}.security-detail-list strong{font-size:14px;line-height:20px}.security-detail-list small{font-size:13px;line-height:18px;color:var(--color-text-secondary)}.security-detail-list button{height:32px;border:1px solid var(--color-border-strong);border-radius:16px;background:var(--brand-white);padding:0 12px;font-size:14px;font-weight:500}.notification-detail-list{display:grid;margin-top:8px}.notification-detail-list label{min-height:72px}.notification-detail-list label>span{display:grid;gap:2px}.notification-detail-list strong{font-size:14px;line-height:20px}.notification-detail-list small{font-size:13px;line-height:18px;color:var(--color-text-secondary)}
.profile-overlay{position:fixed;inset:0;background:rgba(0,0,0,.34);z-index:100}.profile-drawer{position:fixed;left:-340px;top:0;width:330px;height:100vh;background:var(--brand-white);z-index:110;box-shadow:10px 0 30px rgba(0,0,0,.14);transition:left .16s ease;padding:16px 12px}.profile-drawer.is-open{left:0}.drawer-head{height:62px;display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--color-border);margin-bottom:16px}.drawer-close{width:40px;height:40px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer}.drawer-close img{width:24px;height:24px}.drawer-logo{display:block;width:120px;height:auto;max-height:40px;object-fit:contain}.profile-drawer nav{display:flex;flex-direction:column;gap:4px}.profile-drawer nav a{height:47px;border-radius:8px;padding:0 12px;display:flex;align-items:center;text-decoration:none;color:var(--color-text-primary);font-size:15px}.profile-drawer nav a.is-active{background:rgba(253,200,6,.14);color:#0F0F0F}.profile-popover{position:fixed;z-index:95;width:245px;border:1px solid var(--color-border);background:var(--brand-white);border-radius:10px;padding:12px;box-shadow:0 10px 24px rgba(0,0,0,.12);display:flex;flex-direction:column;gap:6px}.profile-popover span{font-size:14px;color:var(--color-text-secondary)}.profile-dialog{position:fixed;inset:0;z-index:150;display:grid;place-items:center}.profile-dialog-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.38)}.profile-dialog-card{position:relative;width:460px;max-width:calc(100vw - 48px);border:1px solid var(--color-border);border-radius:12px;background:var(--brand-white);padding:24px;box-shadow:0 18px 48px rgba(0,0,0,.18)}.profile-dialog-card h2{margin:0;font-size:20px;line-height:28px;font-weight:600}.profile-dialog-card>p{margin:12px 0 0;font-size:14px;line-height:20px;color:var(--color-text-secondary)}.dialog-close{position:absolute;right:12px;top:12px;width:40px;height:40px;border:0;background:transparent;display:grid;place-items:center}.dialog-close img{width:24px;height:24px}.profile-toast{position:fixed;left:50%;bottom:28px;z-index:170;transform:translateX(-50%);background:var(--brand-black);color:var(--brand-white);border-radius:8px;padding:8px 16px;font-size:14px;line-height:20px}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}[hidden]{display:none!important}
.profile-page button:focus-visible,.profile-page a:focus-visible,.profile-page input:focus-visible{outline:2px solid var(--brand-black);outline-offset:2px}@media(max-width:1279px){html,body,.app-page{min-width:var(--desktop-min)}}
