/* Shared charcoal product UI. DESIGN_VARIANCE 3, MOTION_INTENSITY 1, VISUAL_DENSITY 6. */
@font-face{font-family:SUIT;src:url('/static/ui/SUIT-Variable.woff2') format('woff2');font-weight:100 900;font-display:swap}
@media screen{
html:root[data-ui=charcoal]{color-scheme:dark;--ui-bg:#111214;--ui-panel:#1a1b1f;--ui-raised:#26282d;--ui-input:#15161a;--ui-line:#383b43;--ui-control:#6b707c;--ui-text:#f1f2f5;--ui-muted:#b9bdc7;--ui-dim:#a1a7b3;--ui-accent:#9eb9f3;--ui-soft:#283249;--ui-on-accent:#111c32;--ui-danger:#f4a7ad;--ui-danger-bg:#38252b;--ui-warn:#e6c28d;--ui-warn-bg:#352b1d;--ui-shadow:0 18px 48px #05050855;--ui-font:SUIT,'Malgun Gothic',sans-serif;--ui-rail:220px}
html:root[data-ui=charcoal][data-mode=light]{color-scheme:light;--ui-bg:#f3f4f6;--ui-panel:#fff;--ui-raised:#e8ebf0;--ui-input:#f7f8fa;--ui-line:#ccd1db;--ui-control:#7e8797;--ui-text:#21242c;--ui-muted:#505967;--ui-dim:#586272;--ui-accent:#355ca8;--ui-soft:#e7eefb;--ui-on-accent:#fff;--ui-danger:#ae3040;--ui-danger-bg:#fce7eb;--ui-warn:#79541d;--ui-warn-bg:#fff2d9;--ui-shadow:0 18px 48px #1820331a}
html:root[data-ui=charcoal]{
 --bg:var(--ui-bg);
 --xp-face:var(--ui-bg);
 --bg2:var(--ui-panel);
 --card:var(--ui-panel);
 --panel:var(--ui-panel);
 --s1:var(--ui-panel);
 --top-bg:var(--ui-panel);
 --xp-face-hi:var(--ui-panel);
 --xp-box:var(--ui-panel);
 --xp-pane1:var(--ui-panel);
 --xp-pane2:var(--ui-panel);
 --xp-title:var(--ui-panel);
 --xp-taskbar:var(--ui-panel);
 --xp-tray:var(--ui-panel);
 --xp-btn:var(--ui-panel);
 --xp-green:var(--ui-panel);
 --xp-tab:var(--ui-panel);
 --list:var(--ui-panel);
 --pbox-head:var(--ui-panel);
 --pbox-body:var(--ui-panel);
 --balloon:var(--ui-panel);
 --bg3:var(--ui-raised);
 --card2:var(--ui-raised);
 --panel2:var(--ui-raised);
 --s2:var(--ui-raised);
 --chip:var(--ui-raised);
 --xp-btn-down:var(--ui-raised);
 --xp-head:var(--ui-raised);
 --line:var(--ui-line);
 --bd:var(--ui-line);
 --bd2:var(--ui-line);
 --s3:var(--ui-line);
 --xp-etch:var(--ui-line);
 --xp-shadow:var(--ui-line);
 --xp-tab-bd:var(--ui-line);
 --row-line:var(--ui-line);
 --head-line:var(--ui-line);
 --head-sep:var(--ui-line);
 --grid:var(--ui-line);
 --line2:var(--ui-control);
 --bd3:var(--ui-control);
 --s4:var(--ui-control);
 --fg4:var(--ui-control);
 --xp-field:var(--ui-control);
 --xp-btn-bd:var(--ui-control);
 --axis:var(--ui-control);
 --balloon-bd:var(--ui-control);
 --fg:var(--ui-text);
 --ink:var(--ui-text);
 --tx:var(--ui-text);
 --xp-ink:var(--ui-text);
 --xp-group:var(--ui-text);
 --pbox-ink:var(--ui-text);
 --fg2:var(--ui-muted);
 --ink2:var(--ui-muted);
 --xp-ink2:var(--ui-muted);
 --fg3:var(--ui-dim);
 --ink3:var(--ui-dim);
 --dim:var(--ui-dim);
 --s5:var(--ui-dim);
 --xp-ink3:var(--ui-dim);
 --ink-muted:var(--ui-dim);
 --lcd-dim:var(--ui-dim);
 --accent:var(--ui-accent);
 --ac:var(--ui-accent);
 --ac-ink:var(--ui-accent);
 --xp-link:var(--ui-accent);
 --xp-sel:var(--ui-accent);
 --blu:var(--ui-accent);
 --lcd-green:var(--ui-accent);
 --green:var(--ui-accent);
 --grn:var(--ui-accent);
 --gr:var(--ui-accent);
 --ok:var(--ui-accent);
 --ok-ink:var(--ui-accent);
 --accent-bg:var(--ui-soft);
 --accent-soft:var(--ui-soft);
 --ac-soft:var(--ui-soft);
 --hl:var(--ui-soft);
 --xp-hot:var(--ui-soft);
 --green-bg:var(--ui-soft);
 --ok-bg:var(--ui-soft);
 --err:var(--ui-danger);
 --bad:var(--ui-danger);
 --danger:var(--ui-danger);
 --rd:var(--ui-danger);
 --bad-ink:var(--ui-danger);
 --lcd-red:var(--ui-danger);
 --red-bg:var(--ui-danger-bg);
 --bad-bg:var(--ui-danger-bg);
 --warn:var(--ui-warn);
 --amb:var(--ui-warn);
 --yellow:var(--ui-warn);
 --warn-ink:var(--ui-warn);
 --lcd-yellow:var(--ui-warn);
 --yellow-bg:var(--ui-warn-bg);
 --warn-bg:var(--ui-warn-bg);
 --xp-font:var(--ui-font);
 --xp-title-font:var(--ui-font);
 --lcd:var(--ui-input);
 --shadow:var(--ui-shadow);
 --overlay:#08090dcc;--row-odd:var(--ui-panel);--xp-hover-ring:none;--lcd-grid:var(--ui-line);
}
html:root[data-ui=charcoal]{font-size:14px;scrollbar-color:var(--ui-control) var(--ui-bg)}
html:root[data-ui=charcoal] body{font-family:var(--ui-font)!important;color:var(--ui-text);background:var(--ui-bg);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100dvh}
html:root[data-ui=charcoal] :is(button,input,select,textarea,output,h1,h2,h3){font-family:var(--ui-font)!important}
html:root[data-ui=charcoal] :is(h1,h2,h3){letter-spacing:-.35px}
html:root[data-ui=charcoal] :is(button,.btn){background:var(--ui-panel)!important;background-image:none!important;color:var(--ui-text)!important;border:1px solid var(--ui-control);border-radius:7px!important;box-shadow:none!important;text-shadow:none!important;min-height:36px;font-size:13px;font-weight:600;line-height:1.4;padding:8px 12px;cursor:pointer}
html:root[data-ui=charcoal] :is(button,.btn):hover{background:var(--ui-raised)!important;border-color:var(--ui-dim)}
html:root[data-ui=charcoal] :is(button,.btn):disabled{opacity:.5;cursor:not-allowed}
html:root[data-ui=charcoal] :is(button,.btn):is(.primary,.on,.active,.selected,.btn-primary,[aria-pressed=true],[aria-selected=true]){background:var(--ui-accent)!important;color:var(--ui-on-accent)!important;border-color:var(--ui-accent)!important}
html:root[data-ui=charcoal] :is(button,.btn):is(.danger,.btn-danger,.red,.del){color:var(--ui-danger)!important;background:var(--ui-danger-bg)!important;border-color:var(--ui-danger)!important}
html:root[data-ui=charcoal] :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea){color:var(--ui-text)!important;background:var(--ui-input)!important;border:1px solid var(--ui-control)!important;border-radius:7px!important;box-shadow:none!important;min-height:36px;padding:8px 11px;font-size:13px}
html:root[data-ui=charcoal] :is(input,textarea)::placeholder{color:var(--ui-dim);opacity:1}
html:root[data-ui=charcoal] :is(input[type=checkbox],input[type=radio],input[type=range]){accent-color:var(--ui-accent)}
html:root[data-ui=charcoal] :focus-visible{outline:2px solid var(--ui-accent)!important;outline-offset:3px}
html:root[data-ui=charcoal] a{color:var(--ui-accent)}
html:root[data-ui=charcoal] :is(.card,.panel,.sheet,.groupbox,.group-box,.pbox,.metric,.kpi,.summary .s){background:var(--ui-panel);border-color:var(--ui-line);border-radius:10px;box-shadow:none;text-shadow:none}
html:root[data-ui=charcoal] :is(.muted,.hint,.sub,.dim,.desc,.help){color:var(--ui-muted)}
html:root[data-ui=charcoal] :is(.top,.appbar,header:not(.rf-header)){background:var(--ui-panel);color:var(--ui-text);border-bottom:1px solid var(--ui-line);box-shadow:none;text-shadow:none;min-height:68px}
html:root[data-ui=charcoal] :is(.top,.appbar) :is(h1,strong,.window-title){color:var(--ui-text);text-shadow:none;font-family:var(--ui-font);font-style:normal}
html:root[data-ui=charcoal] :is(.top,.appbar) h1{font-size:19px;font-weight:800}
html:root[data-ui=charcoal] :is(.tabs,.subtabs,.tab-bar){background:transparent;border-color:var(--ui-line);box-shadow:none;padding:4px 0 12px;gap:6px}
html:root[data-ui=charcoal] :is(.tabs,.subtabs,.tab-bar) button{border-color:transparent;background:transparent!important;color:var(--ui-muted)!important}
html:root[data-ui=charcoal] :is(.tabs,.subtabs,.tab-bar) button:is(.on,.active,[aria-selected=true]){background:var(--ui-soft)!important;color:var(--ui-accent)!important;border-color:var(--ui-accent)}
html:root[data-ui=charcoal] table{color:var(--ui-text);font-family:var(--ui-font)!important;font-size:13px;border-color:var(--ui-line)}
html:root[data-ui=charcoal] :is(th,thead td){background:var(--ui-raised)!important;color:var(--ui-muted)!important;border-color:var(--ui-line)!important;text-shadow:none;font-size:12px;font-weight:650;padding:12px}
html:root[data-ui=charcoal] td{border-color:var(--ui-line);padding-top:11px;padding-bottom:11px}
html:root[data-ui=charcoal] tbody tr{background:var(--ui-panel)}
html:root[data-ui=charcoal] tbody tr:hover{background:var(--ui-raised)}
html:root[data-ui=charcoal] :is(dialog,.modal-box,.modal-content){color:var(--ui-text);background:var(--ui-panel);border-color:var(--ui-line);border-radius:12px;box-shadow:var(--ui-shadow)}
html:root[data-ui=charcoal] dialog::backdrop{background:#08090dd0}
html:root[data-ui=charcoal] :is(.footer,.statusbar,.status-bar){background:var(--ui-panel);border-color:var(--ui-line);color:var(--ui-muted);box-shadow:none;text-shadow:none}
html:root[data-ui=charcoal] :is(.wrap,main.content){max-width:1800px;padding:26px 28px 40px}
html:root[data-ui=charcoal][data-page=main] #app>.top{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;padding:15px 28px;gap:16px;z-index:20}
html:root[data-ui=charcoal][data-page=main] .top-l{display:flex;align-items:center;gap:14px;min-width:0}
html:root[data-ui=charcoal][data-page=main].rf-layout .top-l nav{display:none!important}
html:root[data-ui=charcoal][data-page=main] .top-r{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
html:root[data-ui=charcoal][data-page=main] .top-r #nn{color:var(--ui-muted)}
html:root[data-ui=charcoal][data-page=main] #app>[id^=view-]{padding:24px 28px 40px}
html:root[data-ui=charcoal][data-page=main] :is(.search-bar,.controls,.filter-bar,.toolbar){background:var(--ui-panel);border-color:var(--ui-line);border-radius:10px;padding:14px;gap:10px;flex-wrap:wrap}
html:root[data-ui=charcoal][data-page=main] .summary{gap:12px}
html:root[data-ui=charcoal][data-page=main] .summary .s{padding:18px;border:1px solid var(--ui-line)}
html:root[data-ui=charcoal][data-page=main] #gate{color:var(--ui-text);background:var(--ui-bg)}
html:root[data-ui=charcoal] .rf-page-heading{margin:0 0 20px}
html:root[data-ui=charcoal] .rf-page-heading h2{font-size:24px;font-weight:800;margin:0}
html:root[data-ui=charcoal] .rf-page-heading p{font-size:12px;color:var(--ui-muted);margin-top:5px}
html:root[data-ui=charcoal] .appbar .brand{background:none;border:0;border-radius:0;color:var(--ui-text);width:auto;min-width:0;padding:0 20px}
html:root[data-ui=charcoal] .appbar .brand span{color:var(--ui-muted)}
html:root[data-ui=charcoal] .window-title{padding-left:16px;color:var(--ui-text);text-shadow:none}
html:root[data-ui=charcoal] .appbar-end{gap:10px;padding:0 20px}
html:root[data-ui=charcoal] .appbar .preview-label{background:var(--ui-soft);color:var(--ui-accent);border-color:var(--ui-line)}
html:root[data-ui=charcoal] .sidebar{background:var(--ui-panel);border-color:var(--ui-line);color:var(--ui-text)}
html:root[data-ui=charcoal] .pbox{background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:8px;overflow:hidden}
html:root[data-ui=charcoal] .pbox :is(h2,h3,summary,.pbox-title){background:var(--ui-panel);color:var(--ui-text);text-shadow:none;border-color:var(--ui-line)}
html:root[data-ui=charcoal] .pbox a{color:var(--ui-muted)}
html:root[data-ui=charcoal] .pbox a:is(.selected,[aria-current=page]){background:var(--ui-soft);color:var(--ui-accent);box-shadow:none}
html:root[data-ui=charcoal] .app-layout:has([data-real-feature-host]){display:block}
html:root[data-ui=charcoal] .app-layout>.sidebar:has([data-real-feature-host]){display:none}
html:root[data-ui=charcoal] #workspace>.appbar .brand{display:none}
html:root[data-ui=charcoal] #workspace>.appbar{padding-left:12px}
html:root[data-ui=charcoal] :is(.lcd,.lcd-card,.lcd-panel,.lcd-value){background:var(--ui-input);color:var(--ui-text);text-shadow:none;border-color:var(--ui-line);box-shadow:none}
html:root[data-ui=charcoal] :is(.kpi-value,.metric-value,.amount,.total-value){font-variant-numeric:tabular-nums;letter-spacing:-.5px}
html:root[data-ui=charcoal] [hidden]{display:none!important}
html:root[data-ui=charcoal][data-page=admin] body{padding:26px 28px 40px}
html:root[data-ui=charcoal][data-page=admin] body>h1{font-size:24px}
html:root[data-ui=charcoal][data-page=admin] section{padding:22px;background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:10px;margin-top:22px}
@media(max-width:1099px){html:root[data-ui=charcoal]{--ui-rail:0px}html:root[data-ui=charcoal] :is(.wrap,main.content){padding:22px 20px}html:root[data-ui=charcoal][data-page=main] #app>.top{top:48px;padding:12px 20px}html:root[data-ui=charcoal] .appbar{flex-wrap:wrap;height:auto;padding-block:10px;gap:8px}}
@media(max-width:767px){html:root[data-ui=charcoal] :is(.wrap,main.content){padding:22px 16px}html:root[data-ui=charcoal][data-page=main] #app>[id^=view-]{padding:20px 16px}html:root[data-ui=charcoal][data-page=main] #app>.top{padding:12px 16px;flex-wrap:wrap}html:root[data-ui=charcoal][data-page=main] .top-r{justify-content:flex-start}html:root[data-ui=charcoal] :is(button,.btn){min-height:40px}html:root[data-ui=charcoal] input:not([type=checkbox]):not([type=radio]),html:root[data-ui=charcoal] select,html:root[data-ui=charcoal] textarea{font-size:16px}html:root[data-ui=charcoal] .appbar-end{padding-inline:16px;flex-wrap:wrap}html:root[data-ui=charcoal] .window-title{padding-left:16px}html:root[data-ui=charcoal][data-page=admin] body{padding:20px 16px}html:root[data-ui=charcoal] .rf-page-heading h2{font-size:22px}}
html:root[data-ui=charcoal]{--hl:var(--ui-text)}
html:root[data-ui=charcoal][data-page=creator_mgmt]{--hl:var(--ui-soft)}
html:root[data-ui=charcoal][data-page=main] :is(.summary label,.ht-mode-label,.th,.tbl-head,.table-head,.pt-label,.pb-label,.pb-head,.prof-dim,.disc-hint,.pt-type){font-size:12px!important;color:var(--ui-muted)}
html:root[data-ui=charcoal][data-page=main] :is(.th,.tbl-head,.table-head) :is(span,div){font-size:12px}
html:root[data-ui=charcoal][data-page=main] :is(label,.co-d,.co-off,.co-ic,.c-sub,.c-bio,.c-found,.c-metric .met-label,.empty,.top-r #nn){font-size:12px!important}
html:root[data-ui=charcoal][data-page=main] :is(.c-sub .tag,.c-sub .email-dim,.card-tag){font-size:11px}
html:root[data-ui=charcoal][data-page=main] .panel-close{font-size:13px!important}
html:root[data-ui=charcoal][data-page=main] :is(.settings-hint-inline,.profile-section-title,.profile-display){font-size:12px!important}
html:root[data-ui=charcoal] :is(.cell-sub,.chip,.stamp,.statusbar,.section-note){font-size:11px}
html:root[data-ui=charcoal] .tabs a{padding:10px 14px;border-radius:7px;color:var(--ui-muted);border:1px solid transparent;background:transparent;box-shadow:none;font-size:13px}
html:root[data-ui=charcoal] .tabs a[aria-current=page]{color:var(--ui-accent);background:var(--ui-soft);border-color:var(--ui-accent);box-shadow:none}
html:root[data-ui=charcoal] :is(.page-content,.summary){border-radius:10px;border-color:var(--ui-line);box-shadow:none}
html:root[data-ui=charcoal] :is(.summary .summary-item,.summary .metric){border-color:var(--ui-line)}
html:root[data-ui=charcoal] :is(.aside-card,.side-card){border-color:var(--ui-line);border-radius:8px;overflow:hidden}
html:root[data-ui=charcoal][data-page=studio] :is(.top,.timecol,.cal .dow,.cell.out){background:var(--ui-panel);box-shadow:none}
html:root[data-ui=charcoal][data-page=studio] .cell.out{background:var(--ui-input);color:var(--ui-dim)}
html:root[data-ui=charcoal][data-page=studio] .cell.out .day{opacity:.75}
html:root[data-ui=charcoal][data-page=studio] .slot.empty .slotinner{background:var(--ui-input);color:var(--ui-muted)}
html:root[data-ui=charcoal][data-page=studio] :is(.ctrlbtn,.brand .ic){background:var(--ui-soft);color:var(--ui-accent);box-shadow:none;border:1px solid var(--ui-line)}
html:root[data-ui=charcoal][data-page=studio] .ctrlbtn .sub{color:var(--ui-muted)}
html:root[data-ui=charcoal][data-page=studio] .cell.today .day{color:var(--ui-on-accent)}
@media(prefers-reduced-motion:reduce){html:root[data-ui=charcoal] *{scroll-behavior:auto!important;transition:none!important}}
}