@import"https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@500;600;700&family=IBM+Plex+Sans+Thai:wght@400;500;600&display=swap";:root{--color-paper: oklch(98% .006 250);--color-paper-raised: oklch(100% .004 250);--color-paper-muted: oklch(95% .01 250);--color-paper-accent: oklch(95% .035 252);--color-ink: oklch(22% .018 252);--color-ink-muted: oklch(48% .018 252);--color-rule: oklch(89% .014 252);--color-rule-strong: oklch(79% .03 252);--color-accent: oklch(55% .2 255);--color-accent-strong: oklch(47% .2 255);--color-accent-ink: oklch(99% .004 252);--color-success: oklch(52% .13 150);--color-success-soft: oklch(95% .035 150);--color-danger: oklch(56% .2 25);--color-danger-soft: oklch(95% .035 25);--color-warning: oklch(67% .13 78);--color-warning-soft: oklch(95% .045 78);--color-video: oklch(18% .012 252);--color-overlay: oklch(16% .018 252 / .5);--font-display: "Bai Jamjuree", ui-sans-serif, sans-serif;--font-body: "IBM Plex Sans Thai", ui-sans-serif, sans-serif;--font-mono: ui-monospace, "SFMono-Regular", monospace;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-md: 1.125rem;--text-lg: 1.375rem;--text-xl: 1.75rem;--radius-sm: .375rem;--radius-md: .625rem;--radius-lg: .875rem;--radius-pill: 999px;--rule-thin: 1px;--shadow-raised: 0 1px 2px oklch(22% .018 252 / .06);--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-in: cubic-bezier(.7, 0, .84, 0);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--dur-micro: .12s;--dur-short: .22s;--dur-long: .42s;--z-base: 1;--z-sticky: 200;--z-modal: 400}:root{--bg: var(--color-paper);--card: var(--color-paper-raised);--border: var(--color-rule);--fb: var(--color-accent);--fb-dark: var(--color-accent-strong);--text: var(--color-ink);--muted: var(--color-ink-muted);--green: var(--color-success);--red: var(--color-danger);--amber: var(--color-warning)}*{box-sizing:border-box}html,body{overflow-x:clip}body{margin:0;min-width:320px;font-family:var(--font-body);font-size:var(--text-base);line-height:1.55;background:var(--bg);color:var(--text)}.app{max-width:1280px;margin:0 auto;padding:var(--space-5)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);background:var(--card);border:var(--rule-thin) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-raised)}.topbar h1{margin:0;font-family:var(--font-display);font-size:var(--text-md);line-height:1.2;letter-spacing:-.015em}.brand-lockup,.account-actions,.user-chip{display:flex;align-items:center}.brand-lockup{gap:var(--space-3);min-width:0}.brand-lockup>div{min-width:0}.brand-lockup>div>span{display:block;color:var(--muted);font-size:var(--text-xs)}.brand-mark{display:grid;flex:0 0 auto;place-items:center;width:2.25rem;height:2.25rem;border-radius:var(--radius-md);background:var(--fb);color:var(--color-accent-ink);font-family:var(--font-display);font-size:var(--text-sm);font-weight:700}.account-actions{gap:var(--space-3)}.user-chip{align-items:flex-end;flex-direction:column;line-height:1.25}.user-chip strong{max-width:24ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm)}.user-chip span{color:var(--muted);font-family:var(--font-mono);font-size:var(--text-xs)}.workspace{display:grid;grid-template-columns:208px minmax(0,1fr);gap:var(--space-4);align-items:start}.tabs{position:sticky;top:var(--space-4);display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-3);background:var(--card);border:var(--rule-thin) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-raised)}.nav-section-label{margin:var(--space-3) var(--space-2) var(--space-1);color:var(--muted);font-size:var(--text-xs);font-weight:600}.nav-section-label:first-child{margin-top:var(--space-1)}.tab{width:100%;padding:var(--space-2) var(--space-3);border:var(--rule-thin) solid transparent;background:transparent;border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);color:var(--text);font-weight:500;text-align:left;white-space:nowrap}.tab:hover{background:var(--color-paper-muted)}.tab.active{background:var(--color-paper-accent);color:var(--fb-dark);border-color:var(--color-rule-strong)}.nav-count{float:right;min-width:1.5rem;margin-left:var(--space-2);padding:0 var(--space-1);border-radius:var(--radius-pill);background:var(--color-danger-soft);color:var(--color-danger);font-variant-numeric:tabular-nums;text-align:center}.main-content{min-width:0}.page-context{display:flex;gap:var(--space-2);align-items:baseline;margin:0 0 var(--space-3) var(--space-1)}.page-context-label{color:var(--muted);font-size:var(--text-xs)}.page-context-label:after{content:"/";margin-left:var(--space-2);color:var(--color-rule-strong)}.page-context strong{font-family:var(--font-display);font-size:var(--text-sm)}.card{background:var(--card);border:var(--rule-thin) solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-4);box-shadow:var(--shadow-raised)}.card.compact{padding:var(--space-3)}h1,h2,h3,h4{font-family:var(--font-display);font-style:normal;overflow-wrap:anywhere;min-width:0}h2{letter-spacing:-.02em}label{display:block;font-size:var(--text-sm);color:var(--text);font-weight:500;margin:var(--space-4) 0 var(--space-2)}textarea,input[type=text],input[type=url],input[type=datetime-local],input[type=email],input[type=password],select{width:100%;padding:var(--space-3);border:var(--rule-thin) solid var(--color-rule-strong);border-radius:var(--radius-md);min-height:44px;outline:2px solid transparent;font-size:var(--text-base);font-family:inherit;background:var(--card);color:var(--text)}textarea{min-height:90px;resize:vertical}select{cursor:pointer}button{background:var(--fb);color:var(--color-accent-ink);border:var(--rule-thin) solid transparent;padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);cursor:pointer;min-height:44px;font-family:var(--font-body);font-size:var(--text-sm);font-weight:600;white-space:nowrap;transition:background-color var(--dur-micro) var(--ease-out),transform var(--dur-micro) var(--ease-out)}button:hover{background:var(--fb-dark)}button:active{transform:translateY(1px)}button.secondary{background:var(--color-paper-muted);color:var(--text);border-color:var(--border)}button.secondary:hover{background:var(--color-paper-accent)}button.danger{background:var(--red)}button.ghost{background:transparent;color:var(--fb)}button.icon-button{padding:4px 10px;font-size:18px;line-height:1}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.page-pill{display:flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--border);border-radius:var(--radius-pill);cursor:pointer;font-size:var(--text-sm);background:var(--card);color:var(--text);font-weight:400}.page-pill:hover{background:var(--color-paper-muted)}.page-pill.selected{background:var(--color-paper-accent);border-color:var(--fb);color:var(--fb-dark)}.badge{padding:2px 8px;border-radius:10px;font-size:12px;font-weight:600}.badge.draft{background:var(--color-paper-muted);color:var(--muted)}.badge.pending_review,.badge.publishing,.badge.pending{background:var(--color-warning-soft);color:var(--color-ink)}.badge.approved{background:var(--color-paper-accent);color:var(--fb-dark)}.badge.published,.badge.scheduled{background:var(--color-success-soft);color:var(--green)}.badge.failed{background:var(--color-danger-soft);color:var(--red)}.muted{color:var(--muted);font-size:var(--text-sm)}.err,.ok{padding:var(--space-3);border-radius:var(--radius-md);font-size:var(--text-sm);margin-top:var(--space-2)}.err{color:var(--red);background:var(--color-danger-soft)}.ok{color:var(--green);background:var(--color-success-soft)}table{width:100%;border-collapse:collapse;font-size:var(--text-sm);font-variant-numeric:tabular-nums}th,td{text-align:left;padding:8px;border-bottom:1px solid var(--border)}.thumb{width:60px;height:60px;object-fit:cover;border-radius:6px}.video-placeholder{display:grid;place-items:center;background:var(--color-video);color:var(--color-accent-ink);font-size:var(--text-xs);font-weight:600}.login-wrap{max-width:360px;margin:80px auto}.spacer{flex:1}small.hint{color:var(--muted);display:block;margin-top:4px}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}.search-input{max-width:360px}.pagination{justify-content:center;margin:16px 0}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:16px;background:var(--color-overlay)}.modal-card{width:min(640px,100%);max-height:min(720px,calc(100vh - 32px));overflow:auto;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-raised)}.page-select-list{display:grid;gap:8px;margin-top:12px}.page-select-row{display:flex;align-items:center;gap:10px;margin:0;padding:10px 12px;border:1px solid var(--border);border-radius:6px;color:var(--text);background:var(--card);cursor:pointer}.page-select-row.selected{border-color:var(--fb);background:var(--color-paper-accent)}.page-select-row input{width:auto;margin:0}.page-select-row span:first-of-type{flex:1;min-width:0;overflow-wrap:anywhere}@media (max-width: 700px){.app{padding:var(--space-3)}.topbar{align-items:stretch;flex-direction:column}.account-actions{justify-content:space-between}.user-chip{align-items:flex-start}.workspace{display:block}.tabs{position:sticky;top:0;z-index:var(--z-sticky);flex-direction:row;overflow-x:auto;margin-bottom:var(--space-3);padding:var(--space-2);border-radius:var(--radius-md);scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tabs .nav-section-label{display:none}.tab{width:auto;flex:0 0 auto;text-align:center}.page-context{margin-top:var(--space-4)}.grid-2{grid-template-columns:1fr}.search-input{max-width:none}table{display:block;max-width:100%;overflow-x:auto}.card{padding:var(--space-4)}.row>button{max-width:100%}}@media (max-width: 420px){.brand-lockup>div>span{display:none}.signout-button{padding-inline:var(--space-3)}.card{padding:var(--space-3)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.15s!important;animation-iteration-count:1!important;transition-duration:.15s!important}}