@import"https://fonts.googleapis.com/css2?family=Anuphan:wght@400;500;600;700;800&display=swap";:root{--font-sans: "Anuphan", "LINE Seed Sans TH", "Noto Sans Thai", "Segoe UI", sans-serif;--color-ink: #112d27;--color-muted: #6b7b75;--color-soft: #f8f6ee;--color-canvas: #fffdf8;--color-surface: rgba(255, 255, 252, .92);--color-panel: #fbfbf5;--color-border: rgba(24, 54, 46, .13);--color-brand: #0f8f58;--color-brand-strong: #0e5c42;--color-line: #06c755;--color-warm: #f5b64b;--color-danger: #bd4b3f;--color-success: #11945c;--shadow-soft: 0 24px 80px rgba(21, 61, 47, .12);--shadow-card: 0 14px 36px rgba(21, 61, 47, .08);--radius-xl: 28px;--radius-lg: 22px;--radius-md: 16px;--radius-sm: 12px;color:var(--color-ink);font-family:var(--font-sans);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0;overflow-x:hidden;overflow-y:auto}body{min-width:320px;background:var(--color-canvas)}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}svg{display:block;width:1em;height:1em;fill:currentColor}.app-shell{width:100%;min-height:100svh;overflow-x:hidden;overflow-y:auto;background:radial-gradient(circle at 10% 8%,rgba(6,199,85,.13),transparent 30%),radial-gradient(circle at 90% 16%,rgba(245,182,75,.18),transparent 24%),linear-gradient(145deg,#fffdf8,#f1f8ef)}.compact-shell{display:grid;place-items:center;padding:clamp(14px,3vw,28px)}.visit-screen{display:grid;grid-template-rows:auto auto minmax(0,auto) auto auto;align-content:center;justify-items:center;gap:16px;width:min(100%,380px);max-width:calc(100vw - 32px);height:min(100%,820px);min-height:0;min-width:0}.visit-screen>*,.line-loading-screen>*{max-width:100%}.line-loading-screen{display:grid;align-content:center;justify-items:center;gap:18px;width:min(100%,380px);max-width:calc(100vw - 32px);min-height:min(620px,calc(100svh - 32px));text-align:center}.loading-spinner{width:52px;height:52px;border:5px solid rgba(15,143,88,.16);border-top-color:var(--color-brand);border-radius:999px;animation:oonjai-spin .9s linear infinite}@keyframes oonjai-spin{to{transform:rotate(360deg)}}.brand-lockup{display:grid;place-items:center;min-width:0}.brand-logo{display:block;width:128px;height:96px;object-fit:contain;object-position:center;filter:drop-shadow(0 8px 14px rgba(6,199,85,.1))}.app-header .brand-logo{width:116px;height:70px;object-fit:contain}.header-status strong,.header-status small{display:block}.visit-copy{display:grid;justify-items:center;gap:10px;text-align:center}.visit-copy h1,.screen-copy h1,.dashboard-title h1,.dashboard-title h2,.today-card h2{margin:0;color:var(--color-ink);font-weight:800;line-height:1.12;letter-spacing:0}.visit-copy h1{font-size:clamp(30px,8.2vw,40px)}.visit-copy p,.screen-copy p,.dashboard-title p,.today-status span,.dashboard-card p,.privacy-note,.privacy-banner small,.profile-row small,.step-text small{margin:0;color:var(--color-muted);line-height:1.55}.visit-copy p{max-width:280px;font-size:16px;font-weight:500}.flow-form{display:grid;width:100%;max-width:100%;min-width:0;gap:14px}.register-form{align-self:end}.profile-preview,.setup-card,.today-card,.dashboard-card,.person-card,.privacy-banner,.invite-strip{border:1px solid var(--color-border);background:var(--color-surface);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.profile-preview{display:grid;width:100%;max-width:100%;min-width:0;justify-self:center;overflow:hidden;border-radius:var(--radius-lg)}.profile-card-head,.profile-row{display:grid;min-width:0;padding:13px 16px}.profile-card-head{grid-template-columns:1fr auto;align-items:center}.profile-card-head strong{font-size:15px}.profile-row+.profile-row,.profile-row.with-avatar{border-top:1px solid var(--color-border)}.profile-row.with-avatar{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px}.profile-row span{min-width:0}.profile-row strong{display:block;min-width:0;overflow:hidden;color:var(--color-ink);font-size:14px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.line-badge{display:inline-grid;width:34px;height:34px;place-items:center;border-radius:10px;color:#fff;background:var(--color-line);font-size:9px;font-weight:800}.avatar{display:grid;width:42px;height:42px;flex:0 0 auto;place-items:center;border:2px solid #ffffff;border-radius:999px;color:#fff;background:radial-gradient(circle at 35% 28%,#f7d0a1 0 18%,transparent 19%),linear-gradient(145deg,#1b5d45,#0d352b);box-shadow:0 8px 18px #13503a2e;font-weight:800}.privacy-note{display:inline-flex;align-items:center;justify-content:center;gap:8px;max-width:300px;text-align:center;font-size:13px}.privacy-note svg{width:16px;height:16px;color:var(--color-brand-strong)}label{display:grid;gap:8px;color:var(--color-ink);font-size:13px;font-weight:700}input{width:100%;min-height:48px;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:11px 14px;outline:none;color:var(--color-ink);background:#ffffffe6;font-weight:600}input::placeholder{color:#95a39e}input:focus{border-color:#06c755ad;box-shadow:0 0 0 4px #06c7551f}input:disabled{color:#8b9995;background:#eef4f0}.primary-button,.secondary-button,.text-button,.header-status button,.step-tab,.side-nav button{cursor:pointer;border:0;font-weight:800}.primary-button{min-height:54px;width:100%;border-radius:999px;padding:13px 20px;color:#fff;background:linear-gradient(135deg,#0f8f58,#074f3b);box-shadow:0 16px 28px #0c5c413d;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}.primary-button:hover:not(:disabled){transform:translateY(-1px);filter:saturate(1.05);box-shadow:0 18px 32px #0c5c4147}.primary-button:active:not(:disabled){transform:translateY(0)}.primary-button.inline{width:auto;min-height:46px;padding-inline:24px}.primary-button:disabled{cursor:not-allowed;color:#7f8d87;background:#d9e1dc;box-shadow:none}.secondary-button{min-height:46px;border:1px solid rgba(15,143,88,.34);border-radius:12px;padding:11px 18px;color:var(--color-brand-strong);background:#ffffffb8}.text-button{color:var(--color-muted);background:transparent}.notice{width:100%;border-radius:var(--radius-sm);padding:11px 13px;color:var(--color-brand-strong);background:#24645214;font-size:12px;font-weight:700;line-height:1.45;text-align:center}.notice.success{color:#1e654c;background:#2f8d681f}.notice.error{color:var(--color-danger);background:#bd4b3f1f}.setup-notice{align-self:start;justify-self:center;max-width:560px}.app-frame-shell{display:grid;place-items:center;padding:clamp(12px,2vw,24px)}.workspace-frame{display:grid;grid-template-columns:264px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"header header" "rail panel";width:min(100%,1120px);min-width:0;min-height:min(780px,calc(100svh - 48px));overflow:visible;border:1px solid var(--color-border);border-radius:24px;background:#fffffab8;box-shadow:var(--shadow-soft)}.management-frame{display:flex;flex-direction:column;width:min(100%,1120px);min-width:0;min-height:min(780px,calc(100svh - 48px));overflow:hidden;border:1px solid var(--color-border);border-radius:24px;background:#fffffabd;box-shadow:var(--shadow-soft)}.management-panel{flex:1 1 auto;min-width:0;min-height:0;overflow:auto;padding:clamp(20px,3.4vw,38px)}.app-header{grid-area:header;display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0;border-bottom:1px solid var(--color-border);padding:16px 22px;background:#ffffffc7}.header-status{display:inline-grid;grid-template-columns:auto minmax(0,auto) auto;align-items:center;min-width:0;gap:10px}.header-status span{min-width:0}.header-status strong{max-width:160px;overflow:hidden;color:var(--color-ink);font-size:13px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.header-status small{color:var(--color-muted);font-size:11px}.header-status button{display:grid;width:32px;height:32px;place-items:center;border-radius:999px;color:var(--color-ink);background:transparent}.step-rail{grid-area:rail;display:grid;align-content:start;gap:12px;min-height:0;padding:28px 20px;background:#f6faf1c2}.step-rail h2{margin:0 0 10px;color:var(--color-brand-strong);font-size:18px;font-weight:800}.step-tab{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;min-height:58px;border-radius:16px;padding:8px 10px;color:var(--color-ink);background:transparent;text-align:left}.step-tab:before{position:absolute;left:23px;top:44px;width:2px;height:30px;border-radius:999px;background:#d7ded8;content:""}.step-tab:nth-of-type(5):before{display:none}.step-rail>.step-tab:nth-of-type(4){display:none}.step-rail>.step-tab:nth-of-type(3):before{display:none}.step-tab.active,.step-tab.done{background:#ffffff8f}.step-dot{display:grid;width:32px;height:32px;place-items:center;border-radius:999px;color:var(--color-muted);background:#dfe5df;font-size:14px;font-weight:800}.step-tab.done .step-dot,.step-tab.active .step-dot{color:#fff;background:var(--color-success)}.step-tab.locked .step-dot{color:#7d8884}.step-text{display:grid;min-width:0;gap:2px}.step-text strong{overflow:hidden;font-size:13px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.step-tab.active .step-text small,.step-tab.done .step-text small{color:var(--color-brand)}.step-tab:disabled{cursor:not-allowed}.side-nav{display:grid;gap:8px;margin-top:30px}.side-nav button{display:flex;align-items:center;gap:10px;min-height:46px;border-radius:12px;padding:10px 12px;color:var(--color-ink);background:transparent;text-align:left}.side-nav button.selected{background:#11945c1c}.side-nav svg,.dashboard-card svg,.privacy-banner svg{width:22px;height:22px;color:var(--color-brand)}.active-panel{grid-area:panel;display:grid;min-height:0;overflow:visible;padding:clamp(24px,4vw,42px);background:linear-gradient(180deg,#ffffff5c,#f5faf29e),radial-gradient(circle at 86% 18%,rgba(245,182,75,.14),transparent 30%)}.mobile-stepper{display:none}.setup-card{display:grid;align-self:center;justify-self:center;width:min(100%,560px);gap:18px;border-radius:var(--radius-lg);padding:clamp(22px,5vw,38px);text-align:center;position:relative;overflow:hidden}.setup-card:before{position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--color-brand),var(--color-warm));content:""}.round-icon{display:grid;width:96px;height:96px;place-items:center;justify-self:center;border-radius:999px;color:var(--color-brand);background:#e8f3df}.round-icon svg{width:52px;height:52px}.screen-copy{display:grid;justify-items:center;gap:8px}.screen-copy h1{font-size:clamp(30px,5vw,40px)}.screen-copy p{max-width:360px;font-size:16px}.compact-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;text-align:left}.dashboard-panel{display:grid;grid-template-rows:auto auto auto auto;align-content:start;min-width:0;gap:14px;min-height:0;overflow:hidden}.management-dashboard{grid-template-rows:auto;gap:16px;width:100%;min-width:0;overflow:visible}.management-title{display:flex;width:100%;min-width:0;align-items:center;justify-content:space-between;gap:14px}.management-title h1,.history-panel h2,.empty-management h2{margin:0;color:var(--color-ink);font-weight:800;line-height:1.18;letter-spacing:0}.management-title h1{font-size:clamp(28px,4vw,40px)}.management-title p,.history-panel p,.empty-management p,.managed-person small,.history-empty{margin:0;color:var(--color-muted);line-height:1.5}.management-stats{display:grid;width:100%;min-width:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.management-stats article,.managed-person,.empty-management,.history-panel{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-card)}.management-stats article{display:grid;gap:4px;min-height:92px;align-content:center;padding:18px}.management-stats strong{color:var(--color-brand-strong);font-size:30px;font-weight:800}.management-stats span{color:var(--color-muted);font-size:13px;font-weight:700}.managed-list{display:grid;width:100%;min-width:0;gap:12px}.managed-person{display:grid;width:100%;min-width:0;gap:14px;padding:16px}.managed-person-main{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px}.managed-person-main span,.managed-fields span{min-width:0}.managed-person h2{margin:0;color:var(--color-ink);font-size:19px;font-weight:800}.managed-fields{display:grid;grid-template-columns:110px 130px minmax(0,1fr);gap:10px}.managed-fields span{display:grid;gap:4px;border-radius:var(--radius-sm);padding:10px 12px;background:#f7f9f1db}.managed-fields strong{min-width:0;overflow-wrap:anywhere;color:var(--color-ink);font-size:14px;font-weight:800}.status-text.success{color:var(--color-success)}.status-text.warning{color:#916021}.status-text.muted{color:var(--color-muted)}.copy-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px}.copy-row code{min-width:0;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:12px;color:var(--color-brand-strong);background:#ffffffc2;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.danger-button{min-height:46px;border:1px solid rgba(189,75,63,.28);border-radius:12px;padding:11px 16px;color:var(--color-danger);background:#ffffffbf;cursor:pointer;font-weight:800}.empty-management{display:grid;justify-items:start;gap:10px;padding:22px}.empty-management svg{width:34px;height:34px;color:var(--color-brand)}.history-panel{display:grid;width:100%;min-width:0;gap:12px;padding:18px;box-shadow:none}.history-list{display:grid;gap:8px}.history-list article{display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:var(--radius-sm);padding:11px 12px;background:#f7f9f1db}.history-list span{display:grid;min-width:0;gap:2px}.history-list strong,.history-list b{color:var(--color-ink);font-size:13px}.history-list small{color:var(--color-muted);font-size:12px}.history-list b{flex:0 0 auto;color:var(--color-brand-strong)}.dashboard-title{display:grid;gap:8px}.dashboard-title h1{font-size:clamp(28px,4vw,40px)}.today-card{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(190px,.7fr);gap:18px;align-items:center;min-height:220px;border-radius:var(--radius-lg);padding:24px}.today-card>svg{align-self:start;width:34px;height:34px;color:var(--color-warm)}.today-text{display:grid;gap:18px}.today-card h2{font-size:24px}.today-status{display:grid;gap:10px;max-width:250px;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:18px;background:#f7f9f1d1}.dashboard-art{width:100%;height:auto;min-width:180px;max-height:170px;justify-self:end}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.dashboard-card{display:grid;align-content:start;gap:12px;min-height:178px;border-radius:var(--radius-lg);padding:20px}.dashboard-card h2{margin:0;font-size:18px;font-weight:800}.dashboard-card p{font-size:14px}.invite-strip{display:grid;gap:6px;overflow:hidden;border-radius:var(--radius-sm);padding:11px 12px;box-shadow:none}.invite-strip span{color:var(--color-brand-strong);font-size:12px;font-weight:800}.invite-strip small{color:var(--color-muted);font-size:12px;line-height:1.45}.invite-strip code{min-width:0;overflow:hidden;color:var(--color-brand-strong);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.person-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-height:0}.person-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;border-radius:var(--radius-md);padding:14px}.person-card h2{margin:0;font-size:18px}.person-card p{margin:5px 0 0;color:var(--color-muted);font-size:13px;line-height:1.45}.person-card strong{align-self:end;color:var(--color-brand-strong);font-size:20px}.status-pill{align-self:start;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800}.status-pill.success{color:#1d6b4f;background:#2f8d6824}.status-pill.warning{color:#8b5a18;background:#f1b86a47}.status-pill.muted{color:var(--color-muted);background:#68797124}.privacy-banner{display:grid;width:100%;min-width:0;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;border-color:#f5b64b47;border-radius:var(--radius-md);padding:14px 18px;background:#fff5dad1;box-shadow:none}.privacy-banner span{display:grid;gap:2px;min-width:0}.privacy-banner strong{font-size:14px}@media(max-width:900px){.workspace-frame{grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr);grid-template-areas:"header" "rail" "panel";width:min(100%,760px);min-height:auto;border-radius:22px}.management-frame{width:min(100%,760px);min-height:auto;border-radius:22px}.step-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:16px 26px 12px;background:#ffffff7a}.step-rail h2,.side-nav,.step-text small{display:none}.step-tab{justify-items:center;grid-template-columns:1fr;gap:8px;min-height:74px;padding:0;background:transparent;text-align:center}.step-tab:before{left:calc(50% + 20px);top:16px;width:calc(100% - 40px);height:2px}.step-dot{width:42px;height:42px;font-size:16px}.step-text strong{font-size:12px;white-space:normal}.active-panel{padding:26px}.today-card{grid-template-columns:auto minmax(0,1fr)}.dashboard-art{display:none}.managed-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.managed-fields span:last-child{grid-column:1 / -1}}@media(max-width:640px){.app-shell{min-height:100svh}.compact-shell,.app-frame-shell{padding:12px}.app-frame-shell{display:block;width:100vw;place-items:stretch}.visit-screen{width:calc(100vw - 28px);max-width:380px;height:100%;gap:14px}.visit-screen .register-form,.visit-screen .profile-preview,.visit-screen .primary-button,.visit-screen .notice{width:100%;max-width:380px}.visit-copy h1{font-size:32px}.visit-copy p{font-size:15px}.profile-card-head,.profile-row{padding:12px 14px}.privacy-note{font-size:12px}.workspace-frame{min-height:calc(100svh - 24px);border-radius:20px;background:#fffffadb}.management-frame{width:calc(100vw - 24px);max-width:none;min-height:calc(100svh - 24px);overflow:visible;border-radius:18px}.app-header{padding:10px 14px;background:#ffffffe6}.app-header .brand-logo{width:92px;height:54px}.header-status span{display:none}.header-status{grid-template-columns:auto auto}.step-rail{display:none}.active-panel{grid-template-rows:auto auto;align-content:start;gap:18px;padding:20px 18px 22px}.management-panel{width:100%;min-width:0;overflow:visible;padding:14px}.mobile-stepper{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;gap:10px;padding:2px}.mobile-stepper button{display:grid;min-width:0;height:34px;border:0;place-items:center;border-radius:12px;color:var(--color-muted);background:#dde6e0c7;cursor:pointer;font-size:13px;font-weight:800}.mobile-stepper button.active,.mobile-stepper button.done{color:#fff;background:linear-gradient(135deg,var(--color-success),var(--color-brand-strong));box-shadow:0 8px 18px #0f8f5833}.mobile-stepper button:disabled{cursor:not-allowed;opacity:.58}.mobile-stepper svg{width:18px;height:18px}.setup-card{width:100%;align-self:start;align-content:start;gap:16px;border-radius:18px;padding:24px 18px 22px}.round-icon{width:72px;height:72px;box-shadow:inset 0 0 0 8px #ffffff94}.round-icon svg{width:38px;height:38px}.screen-copy h1,.dashboard-title h1{font-size:26px}.screen-copy p,.dashboard-title p{font-size:14px}.setup-card label{text-align:left}.setup-card input{min-height:50px;border-radius:14px;background:#fff}.setup-card .primary-button{min-height:52px}.compact-fields,.dashboard-grid,.management-stats,.managed-fields,.person-list{grid-template-columns:1fr}.management-title{align-items:stretch;flex-direction:column}.management-title .primary-button.inline{width:auto;justify-self:start;min-height:42px;padding-inline:18px}.management-dashboard{gap:12px}.management-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.management-stats article{min-height:78px;padding:12px 10px}.management-stats strong{font-size:24px}.management-stats span{font-size:11px;line-height:1.35}.managed-list{padding:0;background:transparent}.managed-person{gap:12px;padding:14px}.managed-person h2{font-size:17px}.managed-fields{grid-template-columns:1fr;gap:8px}.managed-fields span:last-child{grid-column:1}.managed-fields span{padding:9px 8px}.managed-fields small{font-size:10px}.managed-fields strong{font-size:12px}.copy-row{grid-template-columns:1fr}.copy-row .secondary-button,.copy-row .danger-button{width:100%}.copy-row .danger-button{grid-column:1;min-height:40px}.copy-row code{padding:10px;font-size:11px;overflow-wrap:anywhere;text-overflow:clip;white-space:normal}.history-list article{align-items:stretch;flex-direction:column}.today-card{grid-template-columns:1fr;min-height:0;padding:18px}.today-card>svg{width:28px;height:28px}.today-status{max-width:none}.dashboard-panel{overflow:hidden;gap:12px}.dashboard-grid{gap:12px}.dashboard-card{min-height:0;padding:16px}.privacy-banner{padding:12px 14px}.primary-button.inline,.secondary-button{width:100%}}@media(max-height:700px){.visit-screen{gap:8px}.brand-logo{width:108px;height:64px}.visit-copy h1{font-size:30px}.visit-copy p,.profile-row strong,.privacy-note{font-size:12px}.profile-card-head,.profile-row{padding-block:9px}.primary-button{min-height:46px}.visit-screen .notice{display:none}}