/* Only explicitly classified client actions opt in. Context previews stay docked. */
dialog[data-client-surface]{background:var(--base);color:var(--ink);padding:0;overflow:hidden;box-sizing:border-box}
dialog[data-client-surface][open]{display:flex;flex-direction:column}
dialog[data-client-surface] .csurface-frame{display:flex;flex-direction:column;min-height:0;max-height:inherit;height:100%;width:100%;margin:0}
dialog[data-client-surface] .csurface-head{display:flex;align-items:center;gap:16px;height:auto;min-height:72px;padding:16px 24px;border-bottom:1px solid var(--line);flex:none}
dialog[data-client-surface] .csurface-head h2{flex:1;min-width:0;margin:0;font-size:20px;line-height:1.35;overflow-wrap:anywhere}
dialog[data-client-surface] .csurface-close{width:44px;min-width:44px;height:44px;flex:none}
dialog[data-client-surface] .csurface-body{min-width:0;min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain;padding:24px;flex:1;line-height:1.5}
dialog[data-client-surface] .csurface-foot{padding:16px 24px;display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);flex:none;background:var(--base)}
dialog[data-client-surface] .csurface-foot .btn{min-height:40px;white-space:normal;max-width:100%;height:auto;padding-top:8px;padding-bottom:8px}
dialog[data-client-surface] .csurface-body .field{min-width:0}
dialog[data-client-surface] .csurface-body input:not([type=checkbox]):not([type=radio]),dialog[data-client-surface] .csurface-body select,dialog[data-client-surface] .csurface-body textarea{max-width:100%}
dialog[data-client-surface] .csurface-body pre{overflow:auto;max-width:100%}
dialog[data-client-surface] .csurface-body:focus-visible{outline-offset:-3px}
dialog#drawer[data-client-surface=compact],dialog[data-client-surface=compact]{inset:0!important;margin:auto!important;width:600px!important;max-width:calc(100vw - 32px)!important;height:fit-content!important;max-height:calc(100dvh - 48px)!important;border:1px solid var(--line)!important;border-radius:12px!important;box-shadow:0 20px 70px #0003}
dialog[data-client-surface=compact]::backdrop{background:#0006}
dialog#drawer[data-client-surface=workspace],dialog[data-client-surface=workspace]{inset:var(--cs-top,36px) 0 0 var(--cs-left,233px)!important;margin:0!important;width:calc(100vw - var(--cs-left,233px))!important;max-width:none!important;height:calc(100dvh - var(--cs-top,36px))!important;max-height:none!important;border:0!important;border-left:1px solid var(--line)!important;border-radius:0!important;box-shadow:none}
dialog[data-client-surface=workspace]::backdrop{background:#0003}
dialog[data-client-surface=workspace] .csurface-head{min-height:80px;padding:16px 32px}
dialog[data-client-surface=workspace] .csurface-head h2{font-size:24px}
dialog[data-client-surface=workspace] .csurface-close{order:-1;width:auto;min-width:92px;gap:8px;font-size:13px;border:1px solid var(--line);color:var(--ink);padding:0 12px;border-radius:8px}
dialog[data-client-surface=workspace] .csurface-body{padding:32px;scrollbar-gutter:stable;width:100%;max-width:1240px;margin-inline:auto}
dialog[data-client-surface=workspace] .csurface-body>form{max-width:none;margin-inline:0}
dialog[data-client-surface=workspace] .csurface-foot{padding:16px 32px}
dialog[data-client-surface=workspace] .csurface-body>p{max-width:90ch}
dialog[data-client-surface=workspace] .csurface-body textarea{min-height:160px}
dialog[data-client-surface=workspace] .csurface-body .table-wrap{width:100%;overflow:auto}
dialog#drawer[data-client-surface=menu],dialog[data-client-surface=menu]{inset:var(--cs-menu-top,80px) auto auto var(--cs-menu-left,250px)!important;margin:0!important;width:360px!important;max-width:calc(100vw - 16px)!important;height:fit-content!important;max-height:calc(100dvh - 24px)!important;border:1px solid var(--line)!important;border-radius:12px!important;box-shadow:0 12px 40px #0002}
dialog[data-client-surface=menu]::backdrop{background:#0001}
dialog[data-client-surface=menu] .csurface-head{min-height:60px;padding:8px 12px;gap:8px}
dialog[data-client-surface=menu] .csurface-head h2{font-size:14px}
dialog[data-client-surface=menu] .csurface-body{padding:8px 12px 16px}
dialog[data-client-surface=menu] .csurface-body .btn{white-space:normal;text-align:left;justify-content:flex-start;min-height:40px;height:auto}
dialog[data-client-surface=menu] .csurface-foot{padding:12px}
dialog[data-client-surface=menu] .csurface-empty-foot{display:none}
@media(max-width:768px){
 dialog[data-client-surface] .csurface-head{padding:12px 16px;min-height:68px;gap:12px}
 dialog[data-client-surface] .csurface-head h2{font-size:20px}
 dialog[data-client-surface] .csurface-body{padding:20px 16px}
 dialog[data-client-surface] .csurface-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom));gap:8px;max-height:40dvh;overflow:auto}
 dialog[data-client-surface] .csurface-foot .btn{min-height:44px}
 dialog[data-client-surface] .csurface-body input:not([type=checkbox]):not([type=radio]),dialog[data-client-surface] .csurface-body select,dialog[data-client-surface] .csurface-body textarea{font-size:16px;min-height:44px}
 dialog#drawer[data-client-surface=workspace],dialog[data-client-surface=workspace]{inset:0!important;width:100vw!important;max-width:100vw!important;height:100dvh!important;max-height:100dvh!important;border:0!important}
 dialog[data-client-surface=workspace] .csurface-close{width:44px;min-width:44px;padding:0}
 dialog[data-client-surface=workspace] .csurface-close span{display:none}
 dialog[data-client-surface=workspace] .csurface-head h2{font-size:20px}
 dialog#drawer[data-client-surface=compact],dialog[data-client-surface=compact]{max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px)!important}
 dialog#drawer[data-client-surface=menu],dialog[data-client-surface=menu]{inset:auto 0 0!important;width:100vw!important;max-width:100vw!important;max-height:80dvh!important;border-radius:16px 16px 0 0!important;border-bottom:0!important}
 dialog[data-client-surface=menu] .csurface-head h2{font-size:16px}
 dialog[data-client-surface=menu] .csurface-body{padding-bottom:calc(16px + env(safe-area-inset-bottom))}
 dialog[data-client-surface=menu] .csurface-body .btn{min-height:44px}
}
