:root { --unavailable-indicator: #ef3030; }
/* Shared borderless surfaces. Selection and keyboard focus use an edge marker. */
body.reworkUi :is(.card,.layerRow,.imageItem,.elementItem,.signalGroup,.signalPhoto,.projectGroup,.cloudProjectRow,.modeTile,.filePicker,.themePicker,.btn,.input,.select,textarea,dialog) {
  border-color:transparent!important;
}
body.reworkUi :is(.card,.layerRow,.imageItem,.elementItem,.signalGroup,.signalPhoto,.projectGroup,.cloudProjectRow) { box-shadow:none; }
body.reworkUi :is(.btn,.input,.select,textarea,.filePicker,.themePicker):not(:focus-visible):not([aria-pressed="true"]) { box-shadow:none; }
@media(hover:hover) and (pointer:fine){
  body.reworkUi #taskCommon .colorBtn:hover:not(:disabled) { background-color:var(--bg-elevated); }
}

body.reworkUi :is(.usageGuide details,.usageGuide details[open] summary,.taskTooltip) { border-color:transparent!important; }
body.reworkUi .paletteGroup .colorBtn { border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;box-shadow:none; }
/* Fields remain recognizable through a neutral surface instead of an outline. */
body.reworkUi :is(.input,.select,textarea) { background-color:var(--bg-elevated); }
body.reworkUi input[type="color"] { border-color:transparent!important;box-shadow:none; }
body.reworkUi input[type="color"]::-webkit-color-swatch { border:0;border-radius:4px; }
body.reworkUi input[type="color"]::-moz-color-swatch { border:0;border-radius:4px; }

/* Short semantic ticks inside content; navigation keeps its edge indicators. */
body.reworkUi :is(.presetBtn,.thermalQuickBtn,.colorBtn,.saveState,.recoveryBar) {
  border-color:transparent!important;box-shadow:none!important;
}
body.reworkUi :is(.presetBtn.componentPreset,.paletteGroup .colorBtn) { border-width:1px; }
body.reworkUi :is(.presetBtn,.presetBtn.componentPreset,.thermalQuickBtn,.paletteGroup .colorBtn) { padding-left:22px; }
body.reworkUi :is(.presetBtn,.thermalQuickBtn,.paletteGroup .colorBtn),
body.reworkUi :is(.imageItem.active,.elementItem.selected,.cloudProjectRow.active,.modeTile.active,.layerRow.activeLayer,.btn[aria-pressed="true"],.btn.active,.signalMemberButton[aria-current="true"],.signalMemberButton[aria-pressed="true"]),
body.reworkUi :is(button,a[href],summary,[role="button"],input,select,textarea,.filePicker,.themePicker):focus-visible,
body.reworkUi .themePicker:focus-within {
  --tick-color:var(--marker-color,var(--task-color,var(--layer-icon-color,var(--accent-border))));
  background-image:linear-gradient(var(--tick-color),var(--tick-color))!important;
  background-size:4px 16px!important;background-position:8px center!important;background-repeat:no-repeat!important;
  border-color:transparent!important;box-shadow:none!important;outline:none!important;
}
body.reworkUi :is(.taskButton,#taskCommon .colorBtn,.railButton,.projectFileAction,.btn.icon):is([aria-pressed="true"],.active,:focus-visible) { background-position:3px center!important; }
body.reworkUi :is(.imageItem.active,.elementItem.selected,.cloudProjectRow.active,.modeTile.active,.layerRow.activeLayer,.btn[aria-pressed="true"],.btn.active,.signalMemberButton[aria-current="true"],.signalMemberButton[aria-pressed="true"],.presetBtn.active,.thermalQuickBtn.active,.paletteGroup .colorBtn.active) { background-color:var(--bg-elevated);color:var(--text-main); }
body.reworkUi :is(.imageItem,.elementItem,.cloudProjectRow,.modeTile,.signalMemberButton) { padding-left:22px; }
body.reworkUi .layerRow { padding-left:14px; }
body.reworkUi .themePicker:focus-within select:focus-visible { background-image:none!important; }
body.reworkUi :is(button,a[href],summary,[role="button"]):focus-visible { background-color:var(--bg-elevated)!important; }
body.reworkUi :is(.input,.select,textarea) { background-color:var(--bg-elevated); }
body.reworkUi :is(.input,.select,textarea):focus-visible { --tick-color:var(--accent-border);background-color:color-mix(in srgb,var(--bg-elevated) 92%,var(--text-main)); }
body.reworkUi #canvas:focus-visible { outline:none;box-shadow:none; }
body.reworkUi #taskContextPanel { background:transparent;border:0;padding:0;border-radius:0;box-shadow:none; }
body.reworkUi .inspectorHeader h2:empty { display:none; }
body.reworkUi .inspectorHeader .sidebarEyebrow { font-size:12px;line-height:1.5; }
body.reworkUi .recoveryBar { border:0;padding:12px; }
body.reworkUi .saveState { border:0; }
body.reworkUi .saveState::before { width:3px;height:12px;border-radius:1px; }
body.reworkUi .traceKinds button { padding-left:22px; }
@media(hover:hover) and (pointer:fine) {
  body.reworkUi :is(.presetBtn,.thermalQuickBtn,.paletteGroup .colorBtn):hover:not(:disabled) { background-color:var(--bg-elevated); }
}

:root { --route-tool-color:#e884b3; }
:root[data-theme="light"] { --route-tool-color:#b73570; }
/* Location communicates purpose: left rail / bottom toolbar / inline presets. */
body.reworkUi .appRail .railButton:is(.active,[aria-pressed="true"],:focus-visible) {
  background-image:none!important;box-shadow:inset 3px 0 var(--accent)!important;
}
body.reworkUi .taskBar :is(.taskButton,#taskCommon .colorBtn):is([aria-pressed="true"],:focus-visible),
body.reworkUi .projectFileAction:focus-visible {
  background-image:none!important;box-shadow:inset 0 -3px var(--task-color,var(--marker-color,var(--accent)))!important;
}

/* Reserve the focus marker gutter even at rest: text/caret never overlap it. */
body.reworkUi :is(input.input,textarea,select.select) { padding-left:22px; }
body.reworkUi #elementSearch { padding-left:22px;appearance:none; }
body.reworkUi #elementSearch::-webkit-search-cancel-button,
body.reworkUi #elementSearch::-webkit-search-decoration { appearance:none;display:none; }
:root { --field-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23778395' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
body.reworkUi select.select { background-image:var(--field-chevron);background-position:right 8px center;background-size:17px;background-repeat:no-repeat; }
/* A select has two decorations; focusing must not move its disclosure arrow. */
body.reworkUi select.select:focus-visible {
  background-image:var(--field-chevron),linear-gradient(var(--accent-border),var(--accent-border))!important;
  background-position:right 8px center,left 8px center!important;background-size:17px,4px 16px!important;background-repeat:no-repeat!important;
}
body.reworkUi #recoveryBar > .btn { background-color:var(--bg-panel);color:var(--text-main);translate:none!important; }
@media(hover:hover) and (pointer:fine) {
  body.reworkUi #recoveryBar > .btn:hover { background-color:var(--bg-elevated); }
}
body.reworkUi :is(button,input,select,textarea,[role="button"]):is(:disabled,[aria-disabled="true"]) { cursor:default!important;pointer-events:auto; }
body.reworkUi.taskContextUi :is(#taskCommon,button,input,select,textarea,[role="button"]):is(:disabled,[aria-disabled="true"]):is(:hover,.unavailableFeedback) {
  cursor:default!important;background-color:var(--bg-elevated)!important;background-image:none!important;
  box-shadow:inset 0 -3px var(--unavailable-indicator)!important;opacity:1!important;color:var(--text-secondary)!important;filter:none;
}
body.reworkUi .unavailableFeedback { animation:unavailableNudge 360ms ease-in-out; }
@keyframes unavailableNudge { 0%,100% { transform:translateX(0); } 25%,75% { transform:translateX(-3px); } 50% { transform:translateX(3px); } }
@media(prefers-reduced-motion:reduce) { body.reworkUi .unavailableFeedback { animation:none; } }

body.reworkUi .editorActions { border:0;background:transparent;padding:0;box-shadow:none; }
body.reworkUi .imageListEmpty { border-color:transparent; }

/* Multiline text has no fixed center marker; the focused surface remains visible. */
body.reworkUi :is(textarea,textarea.input):focus-visible { background-image:none!important;background-color:color-mix(in srgb,var(--bg-elevated) 85%,var(--text-main))!important; }

/* Compact icon controls keep focus outside the glyph; no inner blue tick. */
body.reworkUi :is(.btn.icon,.toolbarAction,.phoneViewerIconButton,.themeToggle,.portalReturnButton,.betaStatusButton):is(:focus,:focus-visible,:focus-within,[aria-pressed="true"]) {
  background-image:none!important;outline:none!important;box-shadow:none!important;
}
body.reworkUi :is(.btn.icon,.toolbarAction,.phoneViewerIconButton,.themeToggle,.portalReturnButton,.betaStatusButton):focus-visible {
  background-color:var(--bg-elevated)!important;box-shadow:inset 0 -3px currentColor!important;
}
body.reworkUi .themeToggle[aria-pressed="true"] {background-color:transparent;}
body.reworkUi .betaStatusButton {flex:0 0 auto;border:0;border-radius:8px;padding:8px 10px;background:var(--bg-elevated);color:var(--text-secondary);font-size:10px;font-weight:800;letter-spacing:.06em;cursor:pointer;}
body.reworkUi .betaStatusButton:hover {color:var(--text-main);background:var(--borderless-active);}
body.reworkUi .phoneBetaStatus {margin:0 0 12px;}

/* At most two notifications sit beside the sidebar, inside the canvas area. */
body.reworkUi #toast.notificationRegion {
 position:fixed;inset:auto auto var(--notification-bottom,4px) var(--notification-left,8px);margin:0;
 width:var(--notification-width,360px);max-width:calc(100vw - 24px);max-height:var(--notification-height,70dvh);
 padding:0;border:0;background:transparent;color:var(--text-main);box-shadow:none;
 overflow:auto;z-index:10000;pointer-events:none;
}
body.reworkUi #toast.notificationRegion:popover-open {display:block;}
body.reworkUi .notification {
 display:flex;align-items:flex-start;gap:12px;padding:14px 12px 14px 16px;margin-bottom:8px;
 background:var(--bg-elevated);color:var(--text-main);border:0;border-radius:var(--radius-sm);
 box-shadow:0 6px 24px rgb(0 0 0 / .2);pointer-events:auto;animation:notification-enter 160ms ease-out;
 font-size:13px;line-height:1.5;text-align:left;
}
body.reworkUi .notification > div {flex:1;min-width:0;overflow-wrap:anywhere;}
body.reworkUi .notification strong {display:block;font-size:13px;margin-bottom:4px;}
body.reworkUi .notification p {margin:0;color:var(--text-main);}
body.reworkUi .notificationClose {flex:none;width:28px;height:28px;min-width:28px;font-size:22px;padding:0;}
body.reworkUi .notification[data-type=loading] strong::before {
 content:'';display:inline-block;width:10px;height:10px;margin-right:8px;vertical-align:-1px;
 border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:notification-spin 800ms linear infinite;
}
@keyframes notification-enter {from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes notification-spin {to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce) {body.reworkUi .notification,body.reworkUi .notification[data-type=loading] strong::before {animation:none;}}


/* Always-visible export presets reuse neutral buttons and the shared selection tick. */
body.reworkUi .exportBackgroundChoices {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
body.reworkUi .exportBackgroundChoice {display:flex;align-items:center;justify-content:flex-start;gap:8px;min-width:0;padding:10px 10px 10px 18px;font-size:12px;min-height:42px;background-color:var(--bg-elevated);}
body.reworkUi .exportBackgroundSwatch {width:16px;height:16px;border-radius:50%;flex:none;}
body.reworkUi [data-export-background=transparent] .exportBackgroundSwatch {background:conic-gradient(#aaa 25%,#eee 0 50%,#aaa 0 75%,#eee 0) 0 0 / 8px 8px;}
body.reworkUi #exportBrandPreview {display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 8px;border-radius:var(--radius-sm);}
body.reworkUi #exportBrandPreview small {color:inherit;font-size:12px;}
body.reworkUi #exportBackground[hidden] {display:none!important;}

body.reworkUi .exportBackgroundChoices [data-export-background=transparent] {grid-column:1 / -1;}

@media print {body.serverExportRestricted > * {display:none!important;} body.serverExportRestricted::before {content:"Печать серверного проекта доступна только суперадминистратору.";display:block;color:black;background:white;}}

/* Window resizing must shrink the grid tracks, not leave an oversized canvas row. */
body.reworkUi:not(.phoneViewerMode) {height:100dvh;min-height:0;}
body.reworkUi:not(.phoneViewerMode) .app {min-height:0;grid-template-rows:minmax(0,1fr);}
body.reworkUi .appRail {overflow-y:auto;scrollbar-width:thin;}
/* Compact desktop windows keep the same editing tools; only touch phones use the viewer. */
@media(max-width:1000px) {
 body.reworkUi:not(.phoneViewerMode) .appToolbar {overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;scrollbar-width:thin;}
 body.reworkUi:not(.phoneViewerMode) .appToolbar > * {flex-shrink:0;}
 body.reworkUi:not(.phoneViewerMode) .taskBar {flex:0 0 auto;max-width:none;}
}
@media(max-width:767px) {
 body.reworkUi:not(.phoneViewerMode) {--toolbar-height:60px;grid-template-rows:var(--toolbar-height) minmax(0,1fr);}
 body.reworkUi:not(.phoneViewerMode) .app {grid-template-columns:56px minmax(0,1fr);grid-template-rows:minmax(0,1fr);}
 body.reworkUi:not(.phoneViewerMode) .appRail {display:flex;padding:4px;gap:2px;}
 body.reworkUi:not(.phoneViewerMode) .railButton {min-height:48px;flex-shrink:0;padding:4px 0;font-size:9px;}
 body.reworkUi:not(.phoneViewerMode) .mobileNav {display:none;}
 body.reworkUi:not(.phoneViewerMode) .sidebar {left:56px;bottom:0;width:min(330px,calc(100vw - 56px));}
 body.reworkUi:not(.phoneViewerMode) .reworkInspector {bottom:0;width:min(370px,calc(100vw - 56px));}
 body.reworkUi:not(.phoneViewerMode) .appToolbar {display:flex;gap:4px;padding:6px;}
 body.reworkUi:not(.phoneViewerMode) .appToolbar .toolbarGroup {display:flex;flex:0 0 auto;}
 body.reworkUi:not(.phoneViewerMode) .appToolbar :is(#newProjectBtn,#loadProjectBtn,#loadImageBtn,#rotateLeftBtn,#rotateRightBtn,#fitImageBtn,#openExportDialogBtn) {display:inline-flex;}
 body.reworkUi:not(.phoneViewerMode) .taskBar {display:flex!important;}
 body.reworkUi:not(.phoneViewerMode) .appToolbar > * {order:0;}
 body.reworkUi:not(.phoneViewerMode) .workspaceBottomControls {bottom:12px;}
 body.reworkUi:not(.phoneViewerMode) .appRail .railButton span {display:none;}
 body.reworkUi:not(.phoneViewerMode) .canvasSaveHint {display:none;}
}

.markerGeometryGrid .markerAngleField{grid-column:1/-1;}

body.reworkUi .notification:last-child {margin-bottom:0;}

/* Temporary photo inspection uses the full toolbar bottom edge. */
body.reworkUi :is(#hideAnnotationsBtn,#phoneHideAnnotationsBtn)[aria-pressed="true"] {box-shadow:inset 0 -3px var(--accent)!important;}