/* #52: only the work timer; the existing right HUD keeps its layout. */
.bolha-hud #work-panel.timer-card.compact-work{
 --work-top:max(18px,env(safe-area-inset-top));
 position:fixed;inset:var(--work-top) calc(var(--bolha-hud-right) + var(--bolha-phone-width) + 16px) auto auto;
 width:min(620px,calc(100vw - var(--bolha-phone-width) - var(--bolha-hud-right) - 48px));max-width:none;min-width:0;
 height:auto;max-height:calc(100dvh - var(--work-top) - 18px);display:flex;flex-direction:column;overflow:hidden;padding:0;
 color:#ecf3fc;background:linear-gradient(135deg,#1a3047f5,#0c1c2eF5);border:1px solid #52718e;border-radius:16px;box-shadow:0 10px 30px #06132150;
 font:14px/1.4 system-ui,sans-serif;z-index:40;transform:none;
}
.bolha-hud #work-panel.timer-card.compact-work[hidden]{display:none}
.bolha-hud #work-panel.timer-card.compact-work.work-expanded{height:calc(100dvh - var(--work-top) - 18px);max-height:820px}
.bolha-hud #work-panel.timer-card.compact-work header{position:static;display:flex;flex-shrink:0;gap:8px;padding:12px 16px;background:#263b5140;border-bottom:1px solid #7190ad30}
.bolha-hud #work-panel.timer-card.compact-work header strong{display:flex;align-items:center;gap:10px;flex:1;margin:0;color:#edf4fd;font:650 19px/1.2 system-ui;text-transform:none;text-shadow:none;letter-spacing:0}
.work-icon{width:23px;height:23px;flex:none;color:#ffc25b}
.bolha-hud #work-panel.timer-card.compact-work button{font:600 13px/1.3 system-ui;color:#ecf3fc;background:#28415e;border:1px solid #668bb955;border-radius:8px;box-shadow:none;text-shadow:none;padding:8px 12px;min-height:34px;cursor:pointer}
.bolha-hud #work-panel.timer-card.compact-work header button{padding:6px 9px!important;min-width:32px;font-size:13px!important;background:#2f4a68}
.bolha-hud #work-panel.timer-card.compact-work button:focus-visible,.bolha-hud #work-panel.timer-card.compact-work summary:focus-visible,.bolha-hud #work-panel.timer-card.compact-work a:focus-visible{outline:2px solid #9bc6ff;outline-offset:2px}
.bolha-hud #work-panel.timer-card.compact-work #work-body{display:flex;flex-direction:column;min-height:0;flex:1;padding:0!important;overflow:hidden}
.bolha-hud #work-panel.timer-card.compact-work .work-live{flex-shrink:0;padding:14px 18px}
.bolha-hud #work-panel.timer-card.compact-work p{margin:0;line-height:1.4}
.bolha-hud #work-panel.timer-card.compact-work #work-message:empty{display:none}
.bolha-hud #work-panel.timer-card.compact-work #work-message{color:#ffb8b5;margin-bottom:8px}
.work-overview{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,1.2fr);gap:20px;align-items:center}
.bolha-hud #work-panel.timer-card.compact-work .work-state{display:flex;align-items:center;gap:7px;font-size:12px;color:#add9d0;margin-bottom:5px}
.work-state:before{content:'';width:7px;height:7px;border-radius:50%;background:#27d99d;flex:none}.work-state.paused:before{background:#ffc568}.work-state.idle:before{background:#9ab1c7}
.bolha-hud #work-panel.timer-card.compact-work .work-clock{font:600 clamp(32px,3.5vw,44px)/1.15 system-ui;font-variant-numeric:tabular-nums;letter-spacing:-1px;margin:0;text-align:left;white-space:nowrap}
.work-task{display:grid;gap:9px;min-width:0;border-left:1px solid #7190ad40;padding-left:18px}
.work-task div{min-width:0}.work-task b,.work-task span{display:block;font-size:13px;overflow-wrap:anywhere;font-weight:500}
.bolha-hud #work-panel.timer-card.compact-work small{display:block;font-size:11px;color:#a6bed6;opacity:1}
.bolha-hud #work-panel.timer-card.compact-work .work-current-note{max-height:3.9em;overflow:auto;white-space:normal;color:#ecf3fc;line-height:1.3}
.bolha-hud #work-panel.timer-card.compact-work .work-actions{display:flex;gap:10px;margin:14px 0 12px}
.bolha-hud #work-panel.timer-card.compact-work .work-actions button{flex:1;padding:10px;min-height:40px;background:linear-gradient(#365d8c,#264775);border-color:#5b8ac555;font-size:14px}
.bolha-hud #work-panel.timer-card.compact-work .work-actions [data-action=stop]{background:linear-gradient(#78434f,#5c2e3e);border-color:#ad596455}
.work-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.bolha-hud #work-panel.timer-card.compact-work .work-share{display:flex;align-items:center;gap:7px;margin:0;font-size:11px;color:#c7d8eb}
.work-share input{accent-color:#4d97f5;width:16px;height:16px;margin:0;flex:none}
.bolha-hud #work-panel.timer-card.compact-work #work-toggl{font-size:10px;color:#99d6c2;max-width:100%;overflow-wrap:anywhere}
.bolha-hud #work-panel.timer-card.compact-work #work-toggl[hidden]{display:none}
.bolha-hud #work-panel.timer-card.compact-work #work-toggl.sync-warning{color:#ffcd76}
.bolha-hud #work-panel.timer-card.compact-work .work-warning{font-size:11px;color:#ffcd76;margin-top:8px}
.bolha-hud #work-panel.timer-card.compact-work .work-details{min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 18px 16px;scrollbar-width:thin;scrollbar-color:#7490ab transparent;border-top:1px solid #7190ad40}
.bolha-hud #work-panel.timer-card.compact-work:not(.work-expanded) .work-details{display:none}
.bolha-hud #work-panel.timer-card.compact-work summary{padding:12px 0;cursor:pointer;font-weight:600}
.bolha-hud #work-panel.timer-card.compact-work h3{font:650 18px/1.3 system-ui;margin:16px 0 12px}
.work-summary{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:15px}.work-summary b{display:block;font:600 22px/1.3 system-ui;font-variant-numeric:tabular-nums}
.work-summary>div+div{border-left:1px solid #7190ad40;padding-left:16px}
.work-table-wrap{overflow-x:auto}.work-table-wrap table{border-collapse:collapse;width:100%;font-size:12px;font-variant-numeric:tabular-nums}
.work-table-wrap th,.work-table-wrap td{padding:7px 6px;border-bottom:1px solid #7190ad30;text-align:left;font-weight:450}
.work-table-wrap thead{background:#3e608033;color:#bbd3ec}.work-table-wrap td{white-space:nowrap}.work-table-wrap tbody th{min-width:90px;overflow-wrap:anywhere}
.bolha-hud #work-panel.timer-card.compact-work .work-entry{display:grid;grid-template-columns:minmax(40px,1fr) 1.3fr auto auto;align-items:center;gap:10px;padding:9px 10px;margin:6px 0;border:1px solid #7190ad30;border-radius:8px;background:#192f4530;font-size:12px}
.bolha-hud #work-panel.timer-card.compact-work .work-entry>*{min-width:0;overflow-wrap:anywhere}.bolha-hud #work-panel.timer-card.compact-work .work-entry b{font-weight:550}.work-entry span{font-variant-numeric:tabular-nums}
.bolha-hud #work-panel.timer-card.compact-work a{color:#a2caff}.bolha-hud #work-panel.timer-card.compact-work .work-entry button{font-size:11px;padding:6px;min-height:30px}
.bolha-hud #work-panel.timer-card.compact-work #work-body label:not(.work-share){margin:6px 0;font-size:12px}
.bolha-hud #work-panel.timer-card.compact-work :is(input:not([type=checkbox]),select){background:#0e2236;color:#ecf3fc;border:1px solid #587596;border-radius:7px;padding:7px;font:13px system-ui;width:100%;box-sizing:border-box;margin-top:3px}
@media(max-width:1000px) and (orientation:portrait){
 .bolha-hud #work-panel.timer-card.compact-work{--work-top:calc(max(12px,env(safe-area-inset-top)) + var(--bolha-profile-height,170px) + 12px);inset:var(--work-top) 12px auto 12px;width:auto;max-width:none;max-height:calc(100dvh - var(--work-top) - 12px);border-radius:14px}
 .bolha-hud:has(#minimap:not([hidden])) #work-panel.timer-card.compact-work{--work-top:calc(max(12px,env(safe-area-inset-top)) + var(--bolha-profile-height,170px) + var(--bolha-minimap) + 24px)}
 .bolha-hud #work-panel.timer-card.compact-work.work-expanded{height:calc(100dvh - var(--work-top) - 12px);max-height:none}
 .bolha-hud #work-panel.timer-card.compact-work header{padding:9px 12px}.bolha-hud #work-panel.timer-card.compact-work header strong{font-size:17px;gap:7px}
 .bolha-hud #work-panel.timer-card.compact-work .work-live{padding:12px;max-height:100%;overflow:auto}
 .work-overview{grid-template-columns:1fr;gap:10px}.work-task{grid-template-columns:.45fr 1fr;gap:10px;border-left:0;border-top:1px solid #7190ad30;padding:9px 0 0}
 .bolha-hud #work-panel.timer-card.compact-work .work-clock{font-size:40px;text-align:center}.bolha-hud #work-panel.timer-card.compact-work .work-state{font-size:11px}
 .bolha-hud #work-panel.timer-card.compact-work .work-actions{margin:10px 0}.bolha-hud #work-panel.timer-card.compact-work .work-actions button{min-height:44px;font-size:14px}
 .bolha-hud #work-panel.timer-card.compact-work .work-details{padding:0 12px 12px;flex:1}
 .bolha-hud #work-panel.timer-card.compact-work .work-entry{grid-template-columns:1fr 1fr;gap:6px}
 .work-summary b{font-size:20px}.work-meta{gap:6px}.bolha-hud #work-panel.timer-card.compact-work .work-share{font-size:10px}
}
@media(max-width:1000px) and (orientation:portrait) and (max-height:700px){
 .bolha-hud #work-panel.timer-card.compact-work .work-live{padding:8px 10px}.bolha-hud #work-panel.timer-card.compact-work .work-clock{font-size:32px}
 .work-overview{gap:6px}.work-task{padding-top:6px;gap:7px}.bolha-hud #work-panel.timer-card.compact-work .work-actions{margin:7px 0}
 .bolha-hud #work-panel.timer-card.compact-work header{padding:7px 10px}.bolha-hud #work-panel.timer-card.compact-work .work-details{min-height:70px}
 .bolha-hud #work-panel.timer-card.compact-work.work-expanded .work-live{flex-shrink:1;min-height:100px}
}
@media(orientation:landscape) and (max-height:500px){
 .bolha-hud #work-panel.timer-card.compact-work{--work-top:12px;inset:var(--work-top) calc(var(--bolha-phone-width) + var(--bolha-hud-right) + 12px) auto 12px;width:auto;max-height:calc(100dvh - 24px)}
 .bolha-hud #work-panel.timer-card.compact-work.work-expanded{height:calc(100dvh - 24px)}
 .bolha-hud #work-panel.timer-card.compact-work .work-live{padding:9px 12px;flex-shrink:1;min-height:110px;overflow:auto}
 .bolha-hud #work-panel.timer-card.compact-work .work-details{min-height:80px}.bolha-hud #work-panel.timer-card.compact-work .work-clock{font-size:32px}
}

.bolha-hud #work-panel.timer-card.compact-work.work-ranking #work-body{display:block;overflow:auto;padding:16px!important}
/* Подтверждение остаётся в прокручиваемой части таймера на узком экране. */
.bolha-hud #work-panel.timer-card.compact-work.work-reviewing .work-live{flex-shrink:1;overflow:auto;min-height:0}
.work-card-picker{grid-column:1/-1}
.work-card-switch{margin:10px 0;line-height:1.5}
.work-card-switch summary{cursor:pointer;padding:6px 0}
.work-card-switch label{display:block;margin:9px 0}
.work-card-switch select{display:block;width:100%;min-width:0;box-sizing:border-box}
.work-card-switch button{margin-top:6px}
.work-confirmation{margin:10px 0;padding:12px;border:1px solid #d8aa66;border-radius:10px;background:#c08a2918;color:#ffe3b5}
.work-confirmation p{margin:8px 0;font-size:14px;line-height:1.4}
.work-confirmation button{width:100%;white-space:normal}
.work-confirmation details{margin-top:10px}
.work-confirmation summary{cursor:pointer}
.work-confirmation input{display:block;width:100%;min-width:0;box-sizing:border-box;margin:8px 0}
.work-confirmation a{color:#ffe3b5;text-decoration:underline}
