@font-face{font-family:Inter;font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/inter-latin.woff2') format('woff2')}
:root{--bg-primary:var(--color-background);--bg-secondary:var(--color-surface);--bg-tertiary:var(--color-elevated);--font-display:Inter,system-ui,sans-serif;--font-mono:ui-monospace,SFMono-Regular,monospace;--color-error:var(--color-text-primary);--green-primary:var(--color-accent)}
body{font-family:Inter,system-ui,sans-serif;background:var(--color-background);color:var(--color-text-primary)}
.sidebar,.topbar,.header,.admin-header,.login-page-wrapper,.dashboard-layout{background:var(--color-background)!important;box-shadow:none!important;backdrop-filter:none!important}
.panel-card,.welcome-card,.stat-card,.modal-content,.confirm-dialog,.login-card,.form-section,.sidebar-footer,.detail-card{background:var(--color-surface)!important;border:1px solid var(--color-border)!important;box-shadow:none!important;backdrop-filter:none!important;border-radius:8px!important}
.login-bg-orbs,.login-grid-bg,.sidebar::before,.welcome-card::before,.welcome-card::after{display:none!important}
.btn{border-radius:5px!important;box-shadow:none!important;min-height:42px;transition:background .15s,border-color .15s,transform .15s}
.btn-primary,.nav-item.active,.nav-item.active a{background:var(--color-accent)!important;color:var(--color-on-accent)!important;border-color:var(--color-accent)!important}
.btn-secondary,.btn-danger,.btn-ghost{color:var(--color-text-primary)!important;background:transparent!important;border:1px solid var(--color-input-border)!important}
.btn:hover{box-shadow:none!important}.btn:disabled{opacity:.5;cursor:not-allowed}
.form-input,.form-textarea,.form-select{background:var(--color-background)!important;color:var(--color-text-primary)!important;border:1px solid var(--color-input-border)!important;border-radius:5px!important;min-height:44px}
.form-label{color:var(--color-text-secondary)!important;font-size:12px;font-weight:500;letter-spacing:.02em}
.form-input::placeholder,.form-textarea::placeholder{color:var(--color-text-muted)!important;opacity:1}
input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid var(--color-focus)!important;outline-offset:3px;box-shadow:none!important}
h1,h2,h3,.panel-title,.stat-value{color:var(--color-text-primary)!important;letter-spacing:-.035em;font-weight:600!important}
.sidebar a,.sidebar .nav-icon{color:inherit}.sidebar .nav-item{color:var(--color-text-secondary)}.nav-item.active .nav-icon{color:var(--color-on-accent)!important}
.sidebar-footer .username,.user-role,.header-breadcrumb,.panel-desc,.empty-desc,.stat-label,.collection-count{color:var(--color-text-secondary)!important}
.brand-monogram,.user-avatar,.sidebar .logo-mark{background:transparent!important;box-shadow:none!important;border:0!important;color:var(--color-text-primary)}
.sidebar .p-brand-symbol{width:32px;height:32px}.user-avatar .p-brand-symbol{width:26px;height:26px}
.table-container,.table-wrapper,.table-responsive{overflow-x:auto;max-width:100%;border:1px solid var(--color-border);border-radius:6px}
.data-table{width:100%;border-collapse:collapse}.data-table th{background:var(--color-elevated)!important;color:var(--color-text-secondary)!important;font:500 11px/1.5 Inter,system-ui;text-transform:uppercase;letter-spacing:.06em;text-align:left;white-space:nowrap}
.data-table td{color:var(--color-text-primary)!important;border-bottom:1px solid var(--color-border)!important;font-size:13px;line-height:1.6;vertical-align:middle}.data-table tr:hover td{background:var(--color-hover)!important}
.collection-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:20px 24px;border-bottom:1px solid var(--color-border)}.collection-search{max-width:340px;flex:1 1 180px}.collection-count{font-size:12px;margin-left:auto}.collection-error{padding:18px 24px;border-block:1px solid var(--color-border)}.collection-error p{margin:0 0 12px}
.modal-overlay{background:rgb(0 0 0/.65)!important;backdrop-filter:none!important}.modal-content{max-height:90svh!important;overflow-y:auto!important}.modal-footer{position:sticky;bottom:0;background:var(--color-surface);border-top:1px solid var(--color-border);z-index:2}.modal-header{border-bottom:1px solid var(--color-border)}
.unsaved-indicator{font-size:11px;color:var(--color-text-muted);margin-left:12px}.toast{background:var(--color-elevated)!important;color:var(--color-text-primary)!important;border:1px solid var(--color-input-border)!important;box-shadow:none!important}
@media(max-width:768px){.main-content,.dashboard-main,.content-area{min-width:0!important}.panel-header{gap:14px;flex-wrap:wrap}.panel-header-actions{flex-wrap:wrap}.collection-controls{padding:16px}.collection-count{margin-left:0;flex:1 1 100%}.form-grid,.form-row{grid-template-columns:1fr!important}.modal-content{width:calc(100% - 24px)!important;max-width:none!important;margin:12px}.data-table{min-width:600px}.sidebar{z-index:200}.sidebar-overlay{z-index:199}.header-actions{gap:8px}.welcome-card{padding:24px!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.dashboard-header{background:var(--color-background)!important;border-bottom:1px solid var(--color-border);box-shadow:none!important;backdrop-filter:none!important}.sidebar-item{color:var(--color-text-secondary)}.sidebar-item.active,.sidebar-item.active a{color:var(--color-on-accent)!important;background:var(--color-accent)!important;box-shadow:none!important}.sidebar-item.active :is(.nav-icon,.nav-arrow){color:var(--color-on-accent)!important}.status-pill{color:var(--color-text-secondary)!important;background:var(--color-surface)!important;border:1px solid var(--color-border)!important}.header-clock{color:var(--color-text-muted)!important}.header-right{gap:12px}.login-logo-badge{background:transparent!important;border:0!important;box-shadow:none!important}.login-logo-badge .p-brand-symbol{width:44px;height:44px}
.publication-status{display:inline-block;margin-left:10px;padding:3px 8px;border:1px solid var(--color-input-border);border-radius:4px;color:var(--color-text-secondary);font:10px/1.5 Inter,system-ui;text-transform:uppercase;letter-spacing:.04em}

/* Premium workspace refinements, using the same public neutral tokens. */
:root { --sidebar-width: 252px; --header-height: 76px; --ui-ease: cubic-bezier(.22,1,.36,1); }
body { -webkit-font-smoothing: antialiased; }
:root .dashboard-container { background: var(--color-surface); }
:root .sidebar { padding: 16px 12px; background: var(--color-background)!important; }
:root .sidebar::after { display: none; }
:root .sidebar-brand { height: 70px; padding: 0 12px 18px; }
:root .brand-name { font-size: 13px; letter-spacing: .12em; }
:root .brand-subtitle { color: var(--color-text-muted); font-size: 10px; letter-spacing: .04em; }
:root .sidebar-menu { gap: 4px; padding-block: 22px; }
:root .sidebar-section-label { font: 500 10px/1.6 Inter,system-ui; letter-spacing: .08em; color: var(--color-text-muted); padding-bottom: 10px; }
:root .sidebar-item a { min-height: 44px; padding: 8px 12px; border-radius: 8px; font: 500 12px/1.5 Inter,system-ui; }
:root .sidebar-item.active, :root .sidebar-item.active a { color: var(--color-text-primary)!important; background: var(--color-elevated)!important; border-color: transparent; }
:root .sidebar-item.active :is(.nav-icon,.nav-arrow) { color: var(--color-text-primary)!important; }
:root .sidebar-item.active a::before { display: none; }
:root .nav-icon { border: 0; width: 22px; height: 22px; background: transparent!important; }
:root .nav-arrow { font-size: 11px; }
:root .sidebar-footer { background: transparent!important; border: 0!important; border-top: 1px solid var(--color-border)!important; padding: 18px 8px 2px; border-radius: 0!important; }
:root .sidebar-footer .logout-button { min-height: 40px; font: 500 11px/1.5 Inter,system-ui; letter-spacing: 0; }
:root .dashboard-header { padding-inline: clamp(20px,3vw,40px); }
:root .header-title { font-size: 18px; letter-spacing: -.03em; }
:root .header-breadcrumb { font: 11px/1.6 Inter,system-ui; letter-spacing: 0; color: var(--color-text-muted)!important; }
:root :is(.status-pill,.view-site-link) { font: 500 11px/1.5 Inter,system-ui; min-height: 34px; padding: 7px 10px; border-radius: 7px; }
:root .page-body { max-width: 1440px; padding: clamp(20px,3vw,40px); margin-inline: auto; }
:root .page-body > div { animation: studio-enter 250ms var(--ui-ease) both; }
:root :is(.panel-card,.welcome-card,.stat-card,.form-section,.detail-card,.ai-log-card,.media-card) { background: var(--color-background)!important; border: 1px solid var(--color-border)!important; border-radius: 12px!important; }
:root .welcome-card { min-height: 180px; padding: 30px!important; gap: 28px; margin-bottom: 24px; align-items: center; }
:root .welcome-kicker { color: var(--color-text-muted); font: 500 10px/1.6 Inter,system-ui; letter-spacing: .1em; margin-bottom: 16px; }
:root .welcome-text h3 { font-size: clamp(25px,2.8vw,36px); line-height: 1.2; max-width: 24ch; }
:root .welcome-text p { font-size: 13px; max-width: 62ch; line-height: 1.8; }
:root .sync-label { font: 11px/1.6 Inter,system-ui; color: var(--color-text-muted); }
:root .stats-grid { gap: 16px; border: 0; grid-template-columns: repeat(3,minmax(0,1fr)); }
:root .stat-card { min-height: 180px; padding: 24px; gap: 12px; transition: border-color 160ms ease; }
:root .stat-card:hover { border-color: var(--color-input-border)!important; }
:root .stat-icon { color: var(--color-text-muted); font-size: 10px; }
:root .stat-label { font: 500 12px/1.5 Inter,system-ui; text-transform: none; letter-spacing: 0; }
:root .stat-value { font: 500 42px/1.1 Inter,system-ui; letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
:root .stat-footer { color: var(--color-text-muted); font: 11px/1.6 Inter,system-ui; }
:root .panel-header { padding: 22px 24px; background: transparent; }
:root .panel-title { font-size: 16px; }
:root .panel-subtitle { font-size: 12px; color: var(--color-text-muted); }
:root .collection-controls { padding: 16px 24px; gap: 12px; }
:root .collection-count { font: 11px/1.6 Inter,system-ui; }
:root :is(.form-control,.form-input,.form-textarea,.form-select,.search-input,.editor-textarea) { border: 1px solid var(--color-input-border)!important; background: var(--color-background)!important; color: var(--color-text-primary)!important; border-radius: 8px!important; box-shadow: none!important; font: 14px/1.6 Inter,system-ui; min-height: 46px; padding: 11px 14px; }
:root select.form-control { color-scheme: inherit; }
:root .form-label { font: 500 12px/1.5 Inter,system-ui; letter-spacing: 0; text-transform: none; margin-bottom: 8px; }
:root .form-group { margin-bottom: 24px; }
:root .form-hint { font: 11px/1.7 Inter,system-ui; color: var(--color-text-muted); }
:root .btn { font: 500 12px/1.4 Inter,system-ui; min-height: 42px; border-radius: 8px!important; padding: 11px 16px; letter-spacing: 0; }
:root .btn-sm { min-height: 38px; font-size: 11px; padding: 9px 12px; }
:root .btn:active { transform: scale(.98); }
:root .btn-danger { border-style: dashed!important; }
:root .data-table th { background: var(--color-surface)!important; font-size: 10px; padding: 14px 20px; }
:root .data-table td { padding: 18px 20px; font-size: 12px; }
:root .data-table td:first-child { font-weight: 500; }
:root .data-table :is(.mono,.badge) { font: 11px/1.6 Inter,system-ui; }
:root .badge { color: var(--color-text-secondary); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 5px; padding: 4px 7px; }
:root .publication-status { margin: 8px 0 0; font-size: 9px; }
:root .action-btns { gap: 8px; flex-wrap: nowrap; }
:root :is(.table-responsive,.table-container) { border: 0; border-radius: 0 0 12px 12px; }
:root :is(.modal-content,.confirm-dialog) { background: var(--color-background)!important; border-radius: 16px!important; border: 1px solid var(--color-border)!important; }
:root .modal-content { display: flex; flex-direction: column; max-height: calc(100svh - 48px)!important; }
:root .modal-content > form { min-height: 0; overflow: auto; }
:root .modal-header { padding: 24px 28px; align-items: center; }
:root .modal-header h3 { font-size: 20px; }
:root :is(.close-modal,.modal-close,.modal-close-btn) { width: 40px; height: 40px; color: var(--color-text-secondary); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 8px; cursor: pointer; }
:root .modal-body { padding: 28px; }
:root .modal-footer { padding: 18px 28px; gap: 10px; background: var(--color-background); }
:root .blog-title-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; }
:root .editor-layout { border: 1px solid var(--color-border); border-radius: 10px; overflow: hidden; }
:root .editor-toolbar { background: var(--color-surface); border-bottom: 1px solid var(--color-border); gap: 6px; padding: 8px; }
:root .editor-tab { min-height: 40px; border-radius: 6px; font: 500 12px/1.5 Inter,system-ui; padding: 10px 16px; color: var(--color-text-secondary); }
:root .editor-tab.active { background: var(--color-background); color: var(--color-text-primary); box-shadow: 0 1px 3px rgb(0 0 0/.08); }
:root .editor-textarea { min-height: 360px; border: 0!important; border-radius: 0!important; padding: 24px; font: 13px/1.9 ui-monospace,SFMono-Regular,Consolas,monospace; resize: vertical; }
:root .preview-container { min-height: 360px; padding: 24px; background: var(--color-background); color: var(--color-text-primary); line-height: 1.8; overflow-wrap: anywhere; }
:root .preview-container pre { overflow-x: auto; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 8px; padding: 16px; }
:root .confirm-dialog { padding: 30px; gap: 20px; max-width: min(480px,calc(100% - 32px)); }
:root .confirm-title { font-size: 24px; line-height: 1.25; }
:root .confirm-message { color: var(--color-text-secondary); font-size: 13px; line-height: 1.8; }
:root .confirm-note { color: var(--color-text-muted); font: 10px/1.6 Inter,system-ui; letter-spacing: .05em; }
:root .confirm-marker { background: var(--color-surface); border-color: var(--color-border); color: var(--color-text-primary); box-shadow: none; }
:root .confirm-actions { gap: 10px; }
:root .toast { border-radius: 10px; font: 13px/1.6 Inter,system-ui; }
body:has(.modal-overlay) { overflow: hidden; }
@keyframes studio-enter { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media(max-width:1100px) { :root .welcome-card { align-items: flex-start; flex-direction: column; } :root .welcome-actions { align-items: flex-start; } }
@media(max-width:768px) {
  :root { --header-height: 68px; }
  :root .page-body { padding: 20px 16px; }
  :root .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  :root .stat-card { min-height: 160px; padding: 20px; }
  :root .welcome-card { padding: 24px!important; }
  :root .header-clock { display: none; }
  :root .status-pill { display: none; }
  :root .dashboard-header { padding: 12px 16px; }
  :root .panel-header { padding: 20px; }
  :root .collection-controls { padding: 16px 20px; }
  :root .modal-content { width: calc(100% - 24px)!important; max-height: calc(100svh - 24px)!important; }
  :root .modal-header { padding: 18px 20px; }
  :root .modal-body { padding: 20px; }
  :root .modal-footer { padding: 16px 20px; flex-wrap: wrap; }
  :root .blog-title-grid { grid-template-columns: 1fr; gap: 0; }
  :root .confirm-actions { flex-wrap: wrap; }
  :root .confirm-actions .btn { flex: 1 1 150px; }
}
@media(max-width:380px) { :root .stats-grid { grid-template-columns: 1fr; } :root .view-site-link { padding: 7px; font-size: 10px; } }
@media(prefers-reduced-motion:reduce) { :root *, :root *::before, :root *::after { animation: none!important; transition: none!important; scroll-behavior: auto!important; } }
:root .sidebar-item { border-radius: 8px; }
:root .login-card { border-radius: 16px!important; background: var(--color-background)!important; padding: clamp(28px,4vw,48px); }
:root .login-story h2 { letter-spacing: -.045em; line-height: 1.15; }
:root .login-field-label { font: 500 12px/1.5 Inter,system-ui; letter-spacing: 0; }
:root .skeleton { background: var(--color-elevated)!important; background-image: none!important; animation: studio-skeleton 1.5s ease-in-out infinite; }
:root .skeleton::after { display: none; }
@keyframes studio-skeleton { 50% { opacity: .55; } }
@media(prefers-reduced-motion:reduce) { :root .skeleton { animation: none!important; } }