@font-face{font-family:Sarabun;src:url('assets/Sarabun-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Sarabun;src:url('assets/Sarabun-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--ink:#173d43;--text:#253d42;--muted:#637578;--paper:#f6f7f3;--line:#dce4dc;--accent:#dcefaa;--green:#22654c;--white:#fff;--error:#a32f3c}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--text);font-family:Sarabun,system-ui,sans-serif;font-size:16px;line-height:1.65}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #649f99;outline-offset:4px}input:focus,select:focus,textarea:focus{outline:2px solid #357e70;outline-offset:1px}a{color:var(--green)}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1{font-size:34px;line-height:1.45;color:var(--ink)}h2{font-size:24px;line-height:1.55;color:var(--ink)}h3{font-size:18px;line-height:1.6}p+p{margin-top:12px}small{font-size:13px}fieldset{margin:20px 0;border:1px solid var(--line);border-radius:12px;padding:12px 15px 16px}legend{padding:0 6px;font-size:14px;font-weight:700}label{display:block;font-size:14px;font-weight:700;margin:0 0 16px}input:not([type=checkbox]),select,textarea{display:block;width:100%;min-height:48px;margin-top:7px;padding:10px 12px;border:1px solid #bfcec8;border-radius:10px;background:var(--white);color:var(--text);font-weight:400;font-size:16px}input[readonly]{background:#f4f7f3}input[type=checkbox]{width:19px;height:19px;accent-color:var(--green);flex-shrink:0}textarea{resize:vertical}button{border:0;background:none;color:inherit}.skip{position:absolute;top:-70px;left:12px;background:var(--white);padding:10px;z-index:10}.skip:focus{top:10px}.site-header{max-width:1280px;margin:0 auto;min-height:98px;display:flex;align-items:center;justify-content:space-between;padding:22px 36px;gap:20px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:19px;font-weight:700;color:var(--ink);line-height:1.5}.brand small{display:block;color:var(--muted);font-size:12px;font-weight:400}.header-actions,.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.version-label{font-size:12px;padding:5px 10px;border-radius:20px;background:#e9eee5;color:#566744}.page{max-width:1210px;padding:32px 36px 60px;margin:0 auto;min-height:calc(100vh - 180px)}.card{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:28px}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:11px 20px;background:var(--ink);color:var(--white);border:1px solid var(--ink);border-radius:10px;font-weight:700;font-size:15px;text-decoration:none}.button:hover{background:#25545a}.button.secondary{background:#fff;color:var(--ink);border-color:#cbd8cf}.button.secondary:hover{background:#f0f5ed}.button.danger{background:#a32f3c;border-color:#a32f3c}.button.small{font-size:14px;min-height:44px;padding:8px 14px}.button.full{width:100%}.text-button{color:var(--green);font-size:14px;font-weight:700;padding:9px 2px;min-height:44px;text-decoration:underline;text-underline-offset:4px}.muted{color:var(--muted)}.small-text{font-size:14px;line-height:1.7}.eyebrow{font-size:12px;font-weight:700;color:var(--green);letter-spacing:.02em;display:block;margin-bottom:10px}.notice{padding:14px 16px;border-radius:12px;background:#f1f5df;border:1px solid #dfe7ba;color:#4c5e2e;font-size:14px;line-height:1.75}.notice.subtle{background:#f4f6f3;border-color:var(--line);color:var(--muted);margin-top:20px}.message{border:1px solid #b4d5c3;background:#e8f4ed;color:#22543e;padding:14px 18px;border-radius:12px;margin:0 0 24px;overflow-wrap:anywhere}.message.error{border-color:#e7b7bb;background:#fff0f1;color:#8d2632}.loading{text-align:center;padding:60px}.spinner{display:inline-block;width:26px;height:26px;border:3px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:spin .9s linear infinite;margin-bottom:12px}@keyframes spin{to{transform:rotate(360deg)}}.auth-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,430px);gap:70px;align-items:center;padding:35px 0}.intro h1{font-size:43px;line-height:1.45;letter-spacing:-.015em;margin:10px 0 20px}.intro>p{color:var(--muted);font-size:17px;line-height:1.9}.intro-notes{display:flex;gap:24px;margin-top:30px;font-size:12px;color:var(--green)}.intro-notes strong{display:block;color:var(--ink);font-size:14px;margin-top:5px}.workspace-sketch{max-width:350px;border:1px solid #d1ddd0;border-radius:16px;padding:18px;background:#ebf0e6;margin-top:36px;transform:rotate(-2deg)}.sketch-label{font-size:12px;color:var(--muted);padding:0 6px 10px}.sketch-row{display:flex;align-items:center;gap:12px;background:#fff;padding:12px 14px;border-radius:11px;margin-top:7px;box-shadow:0 3px 10px #173d4305}.sketch-row strong{font-size:14px}.sketch-row small{display:block;color:var(--muted);font-size:11px}.shop-icon{display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--ink);color:#fff;width:37px;height:37px;font-size:18px}.shop-icon.pale{background:#e0eadb;color:var(--ink)}.green-dot{width:7px;height:7px;background:#80a84e;border-radius:50%;margin-left:auto}.auth-card{padding:32px;box-shadow:0 20px 60px #173d4306}.auth-card h2{margin-top:25px}.auth-card #authDescription{font-size:14px;margin:6px 0 24px}.tabs{display:flex;background:#f0f3ed;padding:4px;border-radius:12px;gap:4px}.tabs button{flex:1;min-height:44px;border-radius:9px;font-size:14px;color:var(--muted)}.tabs button.selected{background:#fff;color:var(--ink);font-weight:700;box-shadow:0 2px 4px #173d4309}.auth-links{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px}.auth-links button{font-size:12px}.auth-footnote{font-size:12px;color:var(--muted);margin-top:24px;padding-top:18px;border-top:1px solid var(--line);line-height:1.8}.auth-card>.notice{margin-bottom:20px}.narrow{max-width:510px;margin:50px auto}.section-title{font-size:30px;margin-bottom:12px}.narrow>p{margin-bottom:22px}.narrow form{margin-top:24px}.dashboard-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:8px 0 30px}.dashboard-heading .eyebrow{margin-bottom:4px}.dashboard-heading p{margin-top:6px;overflow-wrap:anywhere}.dashboard-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:26px;align-items:start}.sidebar{position:sticky;top:22px;padding:22px 18px}.sidebar label{margin:0 2px 24px}.sidebar select{font-size:15px}.workspace-nav{display:grid;gap:5px}.nav-button{padding:12px 15px;min-height:46px;text-align:left;font-size:15px;border-radius:10px;color:var(--muted)}.nav-button.selected{background:#edf3e7;color:var(--ink);font-weight:700}.nav-button:hover{background:#f4f6f1}.sidebar-bottom{margin-top:30px;padding:20px 5px 0;border-top:1px solid var(--line)}.sidebar-bottom .text-button{margin-top:5px}.workspace-content{min-width:0}.workspace-content section>.card+.card{margin-top:20px}.section-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.section-header .eyebrow{margin-bottom:4px}.shop-summary .section-header{margin-bottom:12px}.shop-summary h2{font-size:28px;overflow-wrap:anywhere}.shop-summary .notice{margin-top:18px}.badge{display:inline-flex;padding:5px 12px;align-items:center;border-radius:30px;font-size:12px;white-space:nowrap;background:#f3edda;color:#856326}.badge.active{background:#e4f1e7;color:#28603b}.badge.suspended,.badge.rejected{background:#ffebed;color:#95323c}.next-step{padding-bottom:26px}.next-step h2{font-size:23px;margin-bottom:12px}.next-step>p{font-size:15px;line-height:1.9;color:var(--muted)}.empty-state{text-align:center;padding:45px 25px}.empty-state p{margin:14px 0 24px}.empty-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:0 auto 20px;border-radius:20px;background:#edf3e4;font-size:36px;color:var(--green)}.form-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px}.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}.checkbox-label{display:flex;align-items:flex-start;gap:9px;font-size:13px;font-weight:400;line-height:1.7;margin:4px 0;min-height:33px;cursor:pointer}.checkbox-label input{margin:2px 0 0}.stack{display:grid;gap:15px}.list-heading{margin:28px 0 14px}.member-card{padding:22px}.member-card .member-email{font-size:16px;font-weight:700;overflow-wrap:anywhere}.member-meta{font-size:12px;color:var(--muted);margin:5px 0 15px}.member-card details{margin:4px 0 18px}.member-card summary{cursor:pointer;font-size:14px;font-weight:700;min-height:44px;line-height:44px}.member-card .form-grid{margin-top:15px}.member-card .form-grid label{margin-bottom:8px}.empty-list{font-size:14px;color:var(--muted);padding:18px;background:#edf1e9;border-radius:12px}.invite-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:18px 22px}.invite-row p{font-size:14px;overflow-wrap:anywhere}.invite-row small{color:var(--muted)}.invite-result h3{margin-bottom:8px}.invite-result label{margin-top:15px}.invite-result .button{margin-bottom:12px}.admin-filter{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;margin-bottom:20px}.admin-filter label{margin:0;min-width:180px}.admin-shop{padding:24px}.admin-shop .section-header{margin-bottom:10px}.admin-shop h3{font-size:20px;overflow-wrap:anywhere}.admin-shop .owner-email{font-size:14px;color:var(--muted);overflow-wrap:anywhere;margin-bottom:14px}.admin-shop .notice{margin-bottom:16px}.admin-shop .actions{margin-top:20px}.admin-shop .text-button{font-size:13px}.pagination{display:flex;gap:15px;align-items:center;justify-content:flex-end;margin-top:22px}.section-busy{opacity:.6;pointer-events:none}dialog{width:min(510px,calc(100vw - 28px));max-height:calc(100dvh - 40px);border:1px solid var(--line);border-radius:20px;padding:0;color:var(--text);box-shadow:0 24px 100px #153a3d30}dialog::backdrop{background:#142e3566;backdrop-filter:blur(2px)}.dialog-body{padding:28px}.dialog-body>p{margin:10px 0 22px}.dialog-body .actions{margin-top:24px}.dialog-body textarea{margin-top:7px}.dialog-body>.checkbox-label{margin-top:15px}.dialog-body .notice{margin-top:14px}footer{max-width:1210px;margin:0 auto;padding:22px 36px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
@media(max-width:950px){.auth-layout{gap:35px;grid-template-columns:minmax(0,1fr) minmax(320px,400px)}.intro h1{font-size:35px}.intro-notes{gap:15px}.page{padding:28px 24px 45px}.site-header{padding:20px 24px}.dashboard-layout{grid-template-columns:210px minmax(0,1fr);gap:20px}.permission-grid{grid-template-columns:1fr}}
@media(max-width:720px){.site-header{min-height:84px;padding:17px 18px;align-items:center}.brand{font-size:16px;gap:9px}.brand img{width:36px;height:36px}.brand small{font-size:11px}.version-label{display:none}.header-actions{gap:5px}.page{padding:22px 16px 40px}.auth-layout{grid-template-columns:1fr;gap:26px;padding:3px 0}.intro h1{font-size:31px;line-height:1.45;margin-bottom:12px}.intro h1 br{display:none}.intro>p{font-size:15px}.intro-notes,.workspace-sketch{display:none}.intro>.eyebrow{font-size:11px;margin-bottom:4px}.auth-card{padding:24px 22px}.auth-card h2{font-size:23px}.card{border-radius:16px}.narrow{margin:20px auto;padding:24px}.dashboard-heading{margin:0 0 22px;align-items:flex-start;gap:10px}.dashboard-heading h1{font-size:28px}.dashboard-heading .muted{font-size:13px}.dashboard-heading>.button{font-size:12px;min-height:44px;padding:9px 12px;white-space:nowrap}.dashboard-layout{grid-template-columns:1fr;gap:20px}.sidebar{position:static;padding:18px}.sidebar label{margin:0 0 12px}.workspace-nav{display:flex;flex-wrap:wrap;gap:5px}.nav-button{font-size:13px;padding:10px 12px;text-align:center;flex:1;white-space:nowrap}.sidebar-bottom{margin-top:14px;padding-top:12px;display:flex;justify-content:space-between;gap:10px;align-items:center}.sidebar-bottom .text-button{margin:0;font-size:13px}.sidebar-bottom p{font-size:12px}.shop-summary{padding:22px}.shop-summary h2{font-size:24px}.section-header{align-items:flex-start;gap:12px}.section-header h2{font-size:23px}.next-step{padding:22px}.permission-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid{grid-template-columns:1fr;gap:0}.invite-row{align-items:flex-start;flex-wrap:wrap}.member-card{padding:20px}.admin-filter{padding:16px}.admin-filter label{min-width:140px}.admin-filter p{font-size:12px}.admin-shop{padding:21px}.admin-shop .actions>.button{flex:1;white-space:nowrap}.dialog-body{padding:24px}.actions>.button{flex-grow:1}.desktop-only{display:none}footer{padding:20px 18px;font-size:11px;gap:5px}footer span{font-size:10px}}
@media(max-width:390px){.permission-grid{grid-template-columns:1fr}.brand small{display:none}.auth-links{gap:0}.header-actions>.button{font-size:12px;padding:8px 10px}.nav-button{font-size:12px;padding:10px 8px}.badge{font-size:11px;padding:5px 9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.spinner{animation:none}}