/* Shared Komari surfaces and controls across every workspace module. */
:root{--surface-hover:rgb(255 255 255 / .86);--overlay:rgb(246 251 248 / .97);--control-radius:6px;--panel-radius:9px;--panel-shadow:0 4px 18px #173c2910;--overlay-shadow:0 16px 55px #102b2826}
:root[data-theme=dark]{--surface-hover:rgb(32 53 45 / .9);--overlay:rgb(16 29 24 / .97);--panel-shadow:0 4px 18px #0002;--overlay-shadow:0 16px 55px #0006}
button{border-radius:var(--control-radius);min-height:36px;padding:7px 12px;font-size:13px;font-weight:500;box-shadow:none}
button:hover:not(:disabled){background:var(--surface-hover);border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}
button.primary{background:var(--accent);color:var(--paper);font-weight:600}button.primary:hover:not(:disabled){background:var(--accent);filter:brightness(1.08)}button:disabled{opacity:.5;cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.topbar{height:62px;background:var(--glass);backdrop-filter:blur(12px);border-color:var(--line);gap:16px}.brand{gap:12px}.brand-mark{width:32px;height:34px;border-radius:8px}.brand b{font-size:20px}.brand>span:last-child{font-size:13px}.top-actions{gap:12px}#theme{width:36px;height:36px;padding:0;font-size:19px;background:transparent}
.heading-actions button{min-height:36px}.page-heading{min-height:40px}.page-heading h1{font-size:21px}.summary{border-radius:var(--panel-radius);box-shadow:var(--panel-shadow)}.summary>button{font-weight:400}.summary>button:first-child{border-radius:9px 0 0 9px}.summary>button:last-child{border-radius:0 9px 9px 0}
.tabs{gap:4px}.tabs button{font-size:14px;border:1px solid transparent;border-radius:6px;min-height:36px;padding:6px 12px}.tabs button.active{background:var(--soft);color:var(--accent);border-color:var(--line)}.tabs span{display:inline-block;margin-left:6px;padding:0 5px;border-radius:4px;background:var(--glass);font-size:11px;line-height:18px}
.layout-switch{border:1px solid var(--line);border-radius:6px;padding:2px;background:var(--soft);gap:2px}.layout-switch button{border:0;min-height:28px;padding:2px 9px;border-radius:4px;font-size:16px}.layout-switch button.active{box-shadow:0 1px 4px #10302412;background:var(--paper)}
.search{border-radius:6px;background:var(--glass)}input[type=search]{font-size:13px;padding:8px 0}.filters>button{min-height:36px}.card,.incident,.sub-choice{border-radius:var(--panel-radius);box-shadow:var(--panel-shadow);background:var(--glass);backdrop-filter:blur(10px)}.card:hover{background:var(--surface-hover)}.card.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.service-card{display:flex;flex-direction:column;gap:0;padding:16px;min-height:0!important;align-self:stretch}.service-card .monitor-head{width:100%;margin-bottom:5px}.service-card .monitor-head h3{font-size:14px}.service-sub{font-size:11px;line-height:1.6;color:var(--muted);margin-bottom:13px;overflow-wrap:anywhere}.service-card .path{margin:0 0 14px}.service-card .path span{padding:3px 7px;border:1px solid var(--line);border-radius:5px;font-size:11px}.service-card .monitor-facts{margin:0 0 14px;width:100%;gap:7px}.service-card .monitor-line{font-size:12px}.service-card .card-foot{margin-top:auto;font-size:11px;width:100%;padding-top:10px}.service-card .status{font-size:11px}.monitor-dot.warn{background:var(--amber)}
.inspector.has-detail,dialog{background:var(--overlay);border:1px solid var(--line);border-radius:var(--panel-radius);backdrop-filter:blur(18px);box-shadow:var(--overlay-shadow)}
.inspector.has-detail{width:420px;padding:18px;top:78px;bottom:auto;max-height:calc(100dvh - var(--dock-height,54px) - 94px);scroll-padding:58px 0 75px}.inspector.has-detail>.aside-head{position:sticky;top:-18px;z-index:2;margin:-18px -18px 16px;padding:12px 18px;border-bottom:1px solid var(--line);background:var(--overlay);backdrop-filter:blur(12px)}
.aside-head>span{font-size:12px}.aside-head button,dialog header>button{width:30px;height:30px;min-height:30px;padding:0;font-size:20px;line-height:1;background:transparent;border:1px solid var(--line);border-radius:6px}
.detail-identity{gap:10px;margin-bottom:14px}.detail-identity .avatar{height:34px;width:34px;border-radius:6px;font-size:11px;background:var(--soft)}.detail-identity h2{font-size:18px;font-weight:650}.detail-identity p{font-size:12px}.detail-tabs{gap:6px;margin:12px 0 16px;padding-bottom:8px}.detail-tabs button{padding:5px 12px;border-radius:5px;min-height:32px;font-size:13px}.detail-tabs .active{background:var(--soft);box-shadow:none;color:var(--accent)}
.detail-block{margin:16px 0}.detail-block h3{font-size:12px;font-weight:600;margin-bottom:9px}.inspector .metrics{gap:12px;background:var(--glass);border:1px solid var(--line);border-radius:7px;padding:12px}.inspector .metric-head b{font-size:19px}.kv{padding:8px 0;font-size:13px;border-bottom:1px dotted var(--line)}.kv:last-child{border-bottom:0}
.notice{border-radius:7px;padding:11px 12px;margin:14px 0;font-size:12px;line-height:1.75}.notice.good{background:var(--soft)}.path{gap:6px}.path span{border-radius:5px;padding:4px 8px;font-size:12px}.path i{font-size:12px}.link-button{border-radius:6px;text-align:left;font-size:13px;padding:8px 10px;min-height:36px}.link-button:hover{color:var(--accent)}
.detail-actions{position:sticky;bottom:-18px;z-index:1;margin:18px -18px 0;padding:12px 18px;border-top:1px solid var(--line);background:var(--overlay);backdrop-filter:blur(12px);gap:8px}.detail-actions button{min-height:36px;font-size:13px}
dialog{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 32px)}dialog::backdrop{background:#10271c38;backdrop-filter:blur(4px)}dialog header{padding:16px 18px;background:var(--glass);gap:12px}dialog h2{font-size:18px;font-weight:650}dialog .eyebrow{font-size:11px;letter-spacing:0;font-weight:400;margin-bottom:3px}#modal-body{padding:18px;max-height:calc(100dvh - 230px)}dialog footer{padding:12px 18px;background:var(--glass);gap:8px}dialog footer>span{font-size:11px}.field{gap:6px!important;margin-bottom:14px!important}.field input,.field select,.inline-select{border-radius:6px!important;padding:8px 10px!important;min-height:38px;background:var(--glass)!important;border:1px solid var(--line);font-size:14px}.field>input:invalid:not(:placeholder-shown){border-color:var(--line)}.field input[readonly]{color:var(--muted);font-size:12px}.sub-choice{padding:13px 14px;margin:10px 0;min-height:0}.sub-choice b{font-size:14px;font-weight:600}.sub-choice small{font-size:12px;margin-top:4px}.steps{margin:12px 0;padding-left:22px;font-size:13px;line-height:2.2}.log{font-size:12px;border-radius:7px;background:var(--bg);padding:12px}
.task-dock{background:var(--overlay);backdrop-filter:blur(14px);border-color:var(--line);box-shadow:0 -3px 15px #142e2310}#task-toggle{font-size:13px;border-radius:0;min-height:44px;background:transparent}.dock-symbol{font-size:18px}.task-row{padding:10px 0;gap:12px}.task-row b{font-size:13px;font-weight:600}.task-row small{font-size:12px;margin-top:2px}.task-row button{font-size:12px;min-height:32px}.task-state{font-size:11px;border-radius:4px;padding:3px 7px;background:var(--soft)}.task-state.failed{background:var(--warn)}#toast{font-size:13px;padding:10px 15px;border-radius:7px;bottom:calc(var(--dock-height,54px) + 12px);pointer-events:none}
@media(max-width:900px){.inspector.has-detail{top:12px;right:12px;left:12px;bottom:auto;width:auto;padding:18px;box-shadow:0 0 0 100vmax #10271c55;max-width:none;max-height:calc(100dvh - 82px)}.inspector.has-detail>.aside-head{margin:-18px -18px 16px}.detail-actions{bottom:-18px}}
@media(max-width:600px){.topbar{height:56px;gap:8px}.brand{gap:8px}.brand b{font-size:18px}.brand-mark{width:28px;height:30px;font-size:20px}.top-actions{gap:6px}.demo{font-size:10px}#theme{width:32px;min-height:32px;height:32px}.tabs button{padding:6px 8px;font-size:13px}.tabs span{display:none}.heading-actions button{font-size:12px;padding:7px 9px}.summary>button:first-child{border-radius:9px 0 0 0}.summary>button:last-child{border-radius:0 0 9px 0}.service-card{padding:16px}.field input,.field select,.inline-select,input[type=search]{font-size:16px}.field input[readonly]{font-size:13px}dialog header,#modal-body{padding:16px}dialog footer{padding:12px 16px}dialog footer>span{width:100%}#modal-body{max-height:calc(100dvh - 250px)}.task-row button{min-height:36px}.layout-switch button{padding:2px 7px}}
@media(prefers-reduced-transparency:reduce){.topbar,.card,.sub-choice,.inspector.has-detail,dialog,.task-dock,.detail-actions{background:var(--paper);backdrop-filter:none}}