/* Per-page structure for the native environment and persistent storage surfaces. */
html[data-product=sandock][data-refinement=on] #app [data-sandock-detail]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;padding:8px;align-items:stretch}
html[data-product=sandock][data-refinement=on] #app [data-sandock-detail-heading]{grid-column:1/-1;gap:12px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-detail-heading] h2,html[data-product=sandock][data-refinement=on] #app [data-sandock-volumes] h1{font-size:var(--sd-type-title);font-weight:500;line-height:28px;letter-spacing:-.025em}
html[data-product=sandock][data-refinement=on] #app [data-sandock-detail-heading]>button,html[data-product=sandock][data-refinement=on] #app [data-sandock-detail-heading]>a{font-size:12px;color:var(--muted-foreground);height:24px;padding:0;margin:0;gap:4px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel]{border:0;border-radius:8px;box-shadow:var(--sd-panel-edge),var(--sd-panel-shadow);background:var(--surface);overflow:hidden;min-width:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel]>div:first-child{padding:20px 24px 16px;gap:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel]>div:first-child>div{font-size:13px;font-weight:500;line-height:20px;letter-spacing:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel]>div:last-child{padding:0 24px 20px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]{grid-column:1/-1;background:var(--surface);border:0;border-radius:8px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div{padding-inline:24px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:first-child{padding-top:20px;padding-bottom:16px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:first-child>div{font-size:18px;line-height:24px;letter-spacing:-.02em}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 24px;padding-bottom:20px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child>*{margin:0;line-height:20px;font-size:12px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child>div{grid-column:1/-1;gap:10px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child>div:first-child{gap:8px 20px;padding-bottom:8px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child>div:first-child>span{background:transparent;border:0;border-radius:0;padding:0;color:var(--muted-foreground);font-size:12px;font-weight:400;line-height:20px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity] [data-sandock-status=RUNNING]{color:#80cda7}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel] button{height:30px;font-size:12px;font-weight:500;border-radius:6px;box-shadow:none}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=events] time{font-size:11px;color:var(--subtle-foreground);font-variant-numeric:tabular-nums}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=events] [class*=divide-y]>div{padding-block:14px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=events] span{font-size:12px;font-weight:400}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=events] span[class*=rounded]{border:0;background:transparent;color:var(--subtle-foreground);padding:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal]{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 24px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal]>div{padding:0!important}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal]>div:last-child{display:flex;align-items:center;gap:24px;flex-direction:row-reverse}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal] [role=none]{display:none}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal] p{max-width:440px;font-size:12px;line-height:20px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal] [data-orientation=horizontal]{display:none}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volumes]{padding:8px;gap:24px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volumes]>div:first-child{gap:24px;align-items:center}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volumes]>div:first-child p{margin-top:8px;font-size:13px;color:var(--muted-foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volumes] button{font-size:12px;box-shadow:none;height:32px;border-radius:6px;font-weight:500}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table]{border:0;border-radius:8px;background:var(--surface);box-shadow:var(--sd-panel-edge),var(--sd-panel-shadow);overflow:hidden}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] table{min-width:820px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] thead tr{border-top:0;border-bottom:1px solid var(--border-subtle)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] th{height:38px;padding:8px 12px;font-size:12px;font-weight:400;color:var(--subtle-foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td{height:72px;padding:14px 12px;border-color:var(--border-subtle);font-size:12px;color:var(--muted-foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td:first-child{min-width:200px;font-size:13px;font-weight:500;color:var(--foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td:first-child svg{stroke-width:1.5;width:16px;height:16px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td:nth-child(2){font-family:SFMono-Regular,Consolas,monospace;font-size:11px;color:var(--subtle-foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td:nth-child(4)>span{border:0;background:transparent;font-size:11px;font-weight:400;color:var(--subtle-foreground);padding:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-status]{background:transparent;padding:0;border:0;font-size:11px;font-weight:500;color:#80cda7;gap:7px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-status]::before{content:'';height:5px;width:5px;border-radius:50%;background:currentColor}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-status=error]{color:#ec9494}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td:last-child button{color:var(--subtle-foreground);height:28px;width:28px;padding:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td:last-child button:hover{color:#ec9494;background:#ec949410}
@media(max-width:1023px){html[data-product=sandock][data-refinement=on] #app [data-sandock-detail]{grid-template-columns:1fr;padding:0}html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child{grid-template-columns:1fr}html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal]{display:block}html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal]>div:last-child{display:block;margin-top:12px}html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal] p{margin-top:12px}html[data-product=sandock][data-refinement=on] #app [data-sandock-volumes]{padding:0}html[data-product=sandock][data-refinement=on] #app [data-sandock-volumes]>div:first-child{align-items:start;flex-direction:column;gap:16px}}

html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=terminal]{display:none}
/* KUI Badge renders a div: keep metadata neutral, with color reserved for state. */
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child>div:first-child>:is(span,div){background:transparent;border:0;border-radius:0;padding:0;color:var(--muted-foreground);font-size:12px;font-weight:400;line-height:20px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity]>div:last-child>div:first-child>[data-sandock-status=RUNNING]{color:#80cda7}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=events] :is(span,div)[class*=rounded]{border:0;background:transparent;color:var(--subtle-foreground);padding:0;font-size:11px;font-weight:400}
html[data-product=sandock][data-refinement=on] #app [data-sandock-volume-table] td:nth-child(4)>:is(span,div){border:0;background:transparent;font-size:11px;font-weight:400;color:var(--subtle-foreground);padding:0}
/* Original archive p27 Overview: keep guides, five counters, activity and usage. */
html[data-product=sandock][data-refinement=on].dark{
 --background:#202124;--surface:#2a2b2f;--card:#2a2b2f;--sidebar:#1c1d20;--sidebar-bg:#1c1d20;
 --popover:#303136;--muted:#34353b;--accent:#303136;--accent-hover:#38393f;
 --foreground:#f1f1f3;--card-foreground:#f1f1f3;--popover-foreground:#f1f1f3;
 --muted-foreground:#b5b6be;--subtle-foreground:#9699a2;
 --border:#3b3d43;--border-subtle:#32343a;--input:#292a2e;--input-border:#46484f;
 --sd-accent-action:#a6b7ed;--sd-accent-running:#8bcab2;--sd-accent-running-wash:#8bcab212;
 --primary:var(--sd-accent-action);--primary-foreground:#202124;--ring:var(--sd-accent-action);
 --secondary:#858b99;--secondary-foreground:#f1f1f3;
 --sidebar-foreground:#b5b6be;--sidebar-accent:#303136;--sidebar-accent-foreground:#f1f1f3;--sidebar-border:#34353a;
 --sd-panel-edge:inset 0 0 0 1px #ffffff09,inset 0 1px 0 #ffffff04;
 --sd-panel-shadow:0 2px 5px #00000012;
}
/* Match Kapps' components layer: its important rule beats unlayered CSS. */
@layer components{
 html[data-product=sandock][data-refinement=on] #app main{background-color:var(--background)!important}
}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview]{gap:24px;padding:28px 32px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] h1{font-size:26px;line-height:34px;letter-spacing:-.025em;font-weight:500}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview]>div:first-child p{font-size:13px;line-height:20px;color:var(--muted-foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [class*=rounded]{box-shadow:none}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [class*=bg-gradient]{background-image:none;background-color:var(--surface)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-panel]{background:var(--surface);border:0;border-radius:8px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-panel] h3{font-size:13px;font-weight:500;line-height:20px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-stats]{gap:16px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-sandock-stat]>div:first-child{border:0;border-radius:8px;background:var(--surface)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-stats] [class*=text-2xl]{font-size:28px;font-weight:500;line-height:36px;font-variant-numeric:tabular-nums}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-stats] p{font-size:12px;font-weight:400;color:var(--muted-foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview]>[class*=grid]>div{transform:none!important;transition:none}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] button{font-size:12px;font-weight:400;height:32px;border-radius:6px;box-shadow:none}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-used] [class*=font-semibold]{font-weight:400}
/* Visible primary surfaces; rows and actions remain open inside them. */
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] :is([data-sandock-overview-panel],[data-sandock-overview-guides],[data-sandock-stat]>div:first-child){box-shadow:var(--sd-panel-edge),var(--sd-panel-shadow)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-stats] [class*=p-5]{padding:16px 20px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-stats] [class*=w-10]{background:transparent;border-radius:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-stat="Running"] :is(svg,[class*=text-2xl]){color:var(--sd-accent-running)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-stats] [data-sandock-stat="Running"] [class*=w-10]{background:var(--sd-accent-running-wash);border-radius:6px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview]>div:first-child a{color:var(--sd-accent-action)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview-guides]{border:0;background:var(--surface);border-radius:8px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-sandock-guide]{border:0;background:transparent;padding:12px;transition:background-color 120ms ease}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-sandock-guide]:hover{background:var(--accent)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-sandock-guide]:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
html[data-product=sandock][data-refinement=on] #app [data-sandock-guide] [class*=w-7]{background:transparent}
html[data-product=sandock][data-refinement=on] #app [data-sandock-guide]:first-child [class*=w-7] svg{color:var(--sd-accent-action)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-sandock-activity-row]{border:0;background:transparent;padding:12px 8px;transition:background-color 120ms ease}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-sandock-activity-row]:hover{background:var(--muted)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-activity-row="created"]>div:first-child{background:#ffffff06;color:var(--muted-foreground)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-activity-row="created"] div[class*=rounded-full]{border:0;background:transparent;color:var(--subtle-foreground);padding-left:0;padding-right:0;font-weight:400}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-used] [class*=bg-primary]{background:var(--primary)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-overview] [data-used]:nth-child(2) [class*=bg-primary]{background:#8c95a6}
@media(max-width:767px){html[data-product=sandock][data-refinement=on] #app [data-sandock-overview]{padding:20px}}
/* All workbench pages share the approved Overview surface and accent system. */
html[data-product=sandock][data-refinement=on] #app [data-sandock-list-table],
html[data-product=sandock][data-refinement=on] #app [data-sandock-list-card]{background:var(--surface);border:0;border-radius:8px;box-shadow:var(--sd-panel-edge),var(--sd-panel-shadow)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-list-table]{overflow:hidden}
html[data-product=sandock][data-refinement=on] #app [data-sandock-list] thead tr{border-top:0;border-bottom-color:var(--border-subtle)}
html[data-product=sandock][data-refinement=on] #app :is([data-sandock-list],[data-sandock-volume-table]) tbody tr:last-child{border-bottom:0}
html[data-product=sandock][data-refinement=on] #app :is([data-sandock-list],[data-sandock-volume-table]) tbody tr:hover{background:var(--accent)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-toolbar] input{background:var(--surface);border-color:transparent;box-shadow:var(--sd-panel-edge)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-list-header]>div:first-child>div:first-child>span{border:0;background:var(--muted);color:var(--muted-foreground)}
html[data-product=sandock][data-refinement=on] #app :is([data-sandock-status=RUNNING],[data-sandock-volume-status=ready]){color:var(--sd-accent-running)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=identity] [data-sandock-status=RUNNING]{color:var(--sd-accent-running)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=storage]>div:first-child svg{color:var(--sd-accent-action)}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=events] [class*=divide-y]>div{border:0}
html[data-product=sandock][data-refinement=on] #app [data-sandock-panel=storage] [class*=bg-muted]{background:var(--accent)}
html[data-product=sandock][data-refinement=on] #app :is([data-sandock-panel=storage],[data-sandock-list-card]) div[class*=rounded-full]:not([data-sandock-status]){background:transparent;border:0;color:var(--muted-foreground);font-weight:400;padding-inline:0}
html[data-product=sandock][data-refinement=on] #app :is([data-sandock-detail],[data-sandock-volumes]) button[class*=bg-primary]{background:#a6b7ed16;color:var(--sd-accent-action);border:0;box-shadow:none}
html[data-product=sandock][data-refinement=on] #app :is([data-sandock-detail],[data-sandock-volumes]) button[class*=bg-primary]:hover{background:#a6b7ed24}
html[data-product=sandock][data-refinement=on] #app [role=dialog]{background:var(--surface);border-color:var(--border-subtle)}
