/* DAYFLOW 5.0: original cascade, scope and animation namespace only. */
#dayflow-app #dayflowZeroDurationDialog {
        border: 2px solid #d92a40!important;
      }
      #dayflow-app #dayflowZeroDurationDialog .dialog-actions {
        flex-wrap: wrap;
      }
      #dayflow-app #dayflowZeroDurationDialog .dialog-actions button {
        flex: 1;
        min-width: 155px;
      }
      #dayflow-app.dayflow-app {
        color-scheme: dark;
        --bg: #050608;
        --panel: #0c0e12;
        --line: #343944;
        --accent: #e3293b;
        --blue: #0060ce;
        --text: #fff;
        --muted: #aeb5c2;
      }
      #dayflow-app * {
        box-sizing: border-box;
      }
      div#dayflow-app {
        margin: 0;
        font: 15px system-ui,Segoe UI,Arial,sans-serif;
        min-height: 0;
      }
      #dayflow-app .wrap {
        max-width: 1120px;
        margin: auto;
        padding: 28px 18px 60px;
      }
      #dayflow-app header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 15px;
        flex-wrap: wrap;
        margin-bottom: 24px;
      }
      #dayflow-app h1 {
        font-size: clamp(25px,4vw,36px);
        margin: 0;
      }
      #dayflow-app h2 {
        font-size: 19px;
        margin: 0 0 12px;
      }
      #dayflow-app p {
        color: var(--muted);
        margin: 7px 0;
      }
      #dayflow-app .brand {
        color: #f13e4d;
      }
      #dayflow-app .layout {
        display: grid;
        gap: 18px;
      }
      @media(max-width:800px) {
      }
      #dayflow-app .panel {
        border: 1px solid var(--line);
        border-radius: 15px;
        padding: 18px;
        min-width: 0;
      }
      #dayflow-app button,#dayflow-app input {
        font: inherit;
      }
      #dayflow-app button {
        background: #182b43;
        color: #fff;
        border: 1px solid #285386;
        padding: 10px 14px;
        border-radius: 9px;
        cursor: pointer;
        font-weight: 700;
      }
      #dayflow-app button:hover {
        background: #224775;
      }
      #dayflow-app button:focus-visible,#dayflow-app input:focus-visible {
        outline: 2px solid #fff;
        outline-offset: 2px;
      }
      #dayflow-app button.primary {
        background: #c91c30;
        border-color: #ec5060;
      }
      #dayflow-app button.primary:hover {
        background: #e3293b;
      }
      #dayflow-app button.danger {
        background: #4b1823;
        border-color: #8d3849;
      }
      #dayflow-app button.small {
        padding: 6px 9px;
        font-size: 13px;
      }
      #dayflow-app .help {
        font-size: 13px;
        color: var(--muted);
      }
      #dayflow-app kbd {
        display: inline-block;
        padding: 3px 7px;
        background: #1c2637;
        border: 1px solid #54627a;
        border-radius: 5px;
        color: #fff;
      }
      #dayflow-app .timer {
        --bar: #e3293b;
        --glow: #e3293b55;
        --successGlow: rgba(145,255,128,.32);
        position: relative;
        overflow: hidden;
        border: 1px solid #303947;
        background: linear-gradient(180deg,#0c1017,#0a0d12 72%);
        border-radius: 11px;
        padding: 14px;
        margin: 0 0 11px;
        transition: opacity .22s,border-color .22s,box-shadow .22s,transform .22s;
      }
      #dayflow-app .timer>* {
        position: relative;
        z-index: 1;
      }
      #dayflow-app .timer.active {
        border-color: #78ff6c;
        transform: translateY(-1px);
      }
      #dayflow-app .timer.active::before {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: inherit;
        pointer-events: none;
        background: radial-gradient(70% 40% at 50% 100%,rgba(98,255,130,.34),transparent 70%),radial-gradient(26% 22% at 15% 100%,rgba(149,255,117,.26),transparent 70%),radial-gradient(26% 24% at 85% 100%,rgba(90,255,168,.24),transparent 72%),radial-gradient(18% 30% at 30% 0%,rgba(112,255,112,.18),transparent 70%),radial-gradient(18% 26% at 70% 0%,rgba(170,255,92,.16),transparent 72%);
        filter: blur(9px) saturate(1.15);
        opacity: .95;
        animation: dayflow5-activeFlame 1.6s ease-in-out infinite alternate;
      }
      #dayflow-app .timer.active::after {
        content: "";
        position: absolute;
        inset: 1px;
        border-radius: inherit;
        pointer-events: none;
        border: 1px solid rgba(157,255,137,.65);
      }
      #dayflow-app .timer.frozen {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        border-color: rgba(163,225,255,.80);
        background: linear-gradient(120deg,rgba(144,213,255,.115),rgba(15,30,46,.86) 48%,rgba(174,226,255,.12));
      }
      #dayflow-app .timer.frozen::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 1;
        background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20620%20155%22%20preserveAspectRatio%3D%22none%22%3E%0A%3Cdefs%3E%3ClinearGradient%20id%3D%22ice%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23efffff%22%20stop-opacity%3D%22.9%22%2F%3E%3Cstop%20offset%3D%22.55%22%20stop-color%3D%22%2380d6ff%22%20stop-opacity%3D%22.67%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f5ffff%22%20stop-opacity%3D%22.75%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%3Cg%20fill%3D%22none%22%20stroke%3D%22url%28%23ice%29%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%3Cpath%20stroke-width%3D%222%22%20d%3D%22M4%2075L52%2026L100%207%20M52%2026L41%208%20M52%2026L74%2025%20M30%2048L12%2041%20M30%2048L34%2067%20M18%2061L5%2057%20M86%2011L89%2032%22%2F%3E%0A%3Cpath%20stroke-width%3D%221.4%22%20d%3D%22M6%2012L48%2042L92%2047%20M48%2042L50%2019%20M48%2042L37%2065%20M70%2045L66%2028%20M70%2045L78%2059%20M21%2023L27%205%20M21%2023L3%2029%22%2F%3E%0A%3Cpath%20stroke-width%3D%222%22%20d%3D%22M617%2092L567%2039L520%209%20M567%2039L588%2018%20M567%2039L551%2054%20M592%2065L616%2050%20M592%2065L584%2086%20M542%2025L539%206%22%2F%3E%0A%3Cpath%20stroke-width%3D%221.35%22%20d%3D%22M617%2015L583%2031L546%2048%20M583%2031L580%2012%20M583%2031L597%2049%20M559%2042L551%2025%20M559%2042L554%2062%22%2F%3E%0A%3Cpath%20stroke-width%3D%221.8%22%20d%3D%22M7%20123L35%20143L74%20150%20M35%20143L39%20123%20M35%20143L23%20153%20M14%20132L3%20140%20M68%20148L70%20135%22%2F%3E%0A%3Cpath%20stroke-width%3D%221.8%22%20d%3D%22M617%20125L593%20142L552%20150%20M593%20142L589%20119%20M593%20142L609%20155%20M562%20146L559%20128%22%2F%3E%0A%3Cpath%20stroke-width%3D%221%22%20stroke-opacity%3D%22.65%22%20d%3D%22M108%204l16%209%2019-7M151%205l13%205M458%206l20%207%2016-8M4%2096l10%208-8%2012M615%20106l-14%2013M130%20153l17-8%2018%207M454%20152l19-9%2014%207%22%2F%3E%0A%3C%2Fg%3E%3Cg%20fill%3D%22%23d6f7ff%22%20opacity%3D%22.58%22%3E%3Ccircle%20cx%3D%2224%22%20cy%3D%2234%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%2267%22%20cy%3D%2230%22%20r%3D%221.7%22%2F%3E%3Ccircle%20cx%3D%22577%22%20cy%3D%2232%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%22557%22%20cy%3D%2255%22%20r%3D%221.4%22%2F%3E%3Ccircle%20cx%3D%2254%22%20cy%3D%22140%22%20r%3D%221.7%22%2F%3E%3Ccircle%20cx%3D%22584%22%20cy%3D%22137%22%20r%3D%222%22%2F%3E%3C%2Fg%3E%0A%3C%2Fsvg%3E");
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        opacity: .93;
      }
      #dayflow-app .timer.frozen::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 1;
        border-radius: inherit;
        background: radial-gradient(ellipse at 0% 0%,rgba(205,245,255,.23),transparent 28%),
             radial-gradient(ellipse at 100% 100%,rgba(165,220,255,.23),transparent 30%),
             linear-gradient(180deg,rgba(210,247,255,.095),transparent 38%,rgba(100,182,235,.065));
        box-shadow: inset 0 0 3px 1px rgba(235,252,255,.5),inset 0 0 15px rgba(153,226,255,.15);
      }
      #dayflow-app .timer.frozen .timer-name,#dayflow-app .timer.frozen .countdown {
        text-shadow: 0 0 7px rgba(156,220,255,.38);
      }
      #dayflow-app .timer.frozen .track {
        box-shadow: 0 0 8px rgba(152,218,255,.19);
      }
      #dayflow-app .timer.done {
        opacity: .62;
      }
      #dayflow-app .timer.success {
        opacity: .88;
        border-color: rgba(157,255,131,.7);
        background: linear-gradient(180deg,rgba(15,29,16,.96),rgba(9,18,10,.94) 72%);
      }
      #dayflow-app .timer.success::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        pointer-events: none;
        background: radial-gradient(70% 34% at 50% 0%,rgba(173,255,145,.12),transparent 70%),radial-gradient(80% 48% at 50% 100%,rgba(77,255,128,.08),transparent 72%);
        animation: dayflow5-successGlow 1.8s ease-in-out infinite;
      }
      #dayflow-app .timer-top {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        align-items: flex-start;
        margin-bottom: 5px;
      }
      #dayflow-app .timer-name {
        font-weight: 800;
        color: #fff;
        overflow-wrap: anywhere;
        line-height: 1.25;
      }
      #dayflow-app .timer-right {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-shrink: 0;
      }
      #dayflow-app .countdown {
        font-size: 25px;
        font-weight: 800;
        font-variant-numeric: tabular-nums;
        font-feature-settings: "tnum" 1;
        white-space: nowrap;
        width: max-content;
        min-width: 0;
        text-align: right;
        flex: none;
      }
      #dayflow-app .success-badge {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        font-weight: 900;
        color: #d9ffcf;
        border: 2px solid rgba(156,255,131,.95);
        background: radial-gradient(circle at 35% 30%,rgba(236,255,232,.3),rgba(87,232,95,.22) 45%,rgba(35,132,47,.3) 80%);
        box-shadow: 0 0 10px var(--successGlow),inset 0 0 10px rgba(235,255,238,.22);
        animation: dayflow5-badgeBeat 1.9s ease-in-out infinite;
      }
      #dayflow-app .meta {
        color: var(--muted);
        font-size: 12px;
        margin-bottom: 11px;
      }
      #dayflow-app .track {
        height: 16px;
        background: #242a35;
        border-radius: 30px;
        overflow: hidden;
        position: relative;
      }
      #dayflow-app .track::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        pointer-events: none;
        background: linear-gradient(180deg,rgba(255,255,255,.08),transparent 48%);
      }
      #dayflow-app .fill {
        height: 100%;
        background: var(--bar);
        border-radius: 30px;
        width: 100%;
        transition: width .2s linear,filter .22s,box-shadow .22s;
        box-shadow: 0 0 10px color-mix(in srgb,var(--bar) 55%, transparent);
      }
      #dayflow-app .timer.active .fill {
        filter: saturate(1.15) brightness(1.08);
        box-shadow: 0 0 14px rgba(102,255,116,.24);
      }
      #dayflow-app .timer.frozen .fill {
        filter: saturate(.72) brightness(1.05);
      }
      #dayflow-app .timer.success .fill {
        filter: saturate(1.05) brightness(1.06);
        box-shadow: 0 0 13px rgba(121,255,121,.24);
      }
      #dayflow-app .status {
        font-size: 13px;
        color: var(--muted);
        margin-top: 11px;
      }
      @keyframes dayflow5-activeFlame {
        0% {
          transform: translateY(1px) scale(1);
          opacity: .8;
        }
        50% {
          transform: translateY(-2px) scale(1.02);
          opacity: 1;
        }
        100% {
          transform: translateY(2px) scale(.985);
          opacity: .86;
        }
      }
      @keyframes dayflow5-borderPulse {
        0%,100% {
          opacity: .78;
        }
        50% {
          opacity: 1;
        }
      }
      @keyframes dayflow5-frostShift {
        0% {
          background-position: 0 0,0 0,0 0,0 0;
        }
        100% {
          background-position: 0 0,170px 0,0 0,0 0;
        }
      }
      @keyframes dayflow5-successGlow {
        0%,100% {
          opacity: .55;
        }
        50% {
          opacity: .98;
        }
      }
      @keyframes dayflow5-badgeBeat {
        0%,100% {
          transform: scale(1);
        }
        50% {
          transform: scale(1.08);
        }
      }
      #dayflow-app .field {
        display: grid;
        gap: 7px;
        margin-bottom: 15px;
      }
      #dayflow-app label {
        font-size: 13px;
        font-weight: 700;
        color: #e3e9f2;
      }
      #dayflow-app input {
        width: 100%;
        background: #07090d;
        color: white;
        border: 1px solid #4b5361;
        border-radius: 8px;
        padding: 10px;
        color-scheme: dark;
      }
      #dayflow-app input[type=color] {
        padding: 3px;
        height: 42px;
        cursor: pointer;
      }
      #dayflow-app input[type=checkbox] {
        width: auto;
        accent-color: var(--accent);
      }
      #dayflow-app .auto-options {
        display: grid;
        gap: 11px;
        margin: 17px 0 23px;
      }
      #dayflow-app .auto-option {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        cursor: pointer;
        font-size: 13px;
        line-height: 1.4;
      }
      #dayflow-app .auto-option input {
        width: 18px;
        height: 18px;
        flex: none;
        margin: 1px 0 0;
      }
      #dayflow-app .auto-option span {
        flex: 1;
      }
      #dayflow-app .settings-item {
        border: 1px solid #323d4d;
        border-radius: 10px;
        padding: 12px;
        margin: 10px 0;
      }
      #dayflow-app .settings-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
      }
      #dayflow-app .settings-name {
        font-weight: 700;
        overflow-wrap: anywhere;
      }
      #dayflow-app .setting-grid {
        display: grid;
        grid-template-columns: minmax(0,1fr) minmax(0,1fr) 70px;
        gap: 10px;
        margin-top: 11px;
      }
      #dayflow-app .setting-grid input {
        min-width: 0;
      }
      #dayflow-app .muted {
        color: var(--muted);
      }
      #dayflow-app dialog {
        border: 1px solid #9e3142;
        border-radius: 14px;
        background: #12151d;
        color: white;
        max-width: min(440px,calc(100vw - 28px));
        width: 100%;
        padding: 23px;
      }
      #dayflow-app dialog::backdrop {
        background: rgba(0,0,0,.8);
      }
      #dayflow-app dialog form {
        display: grid;
        gap: 13px;
      }
      #dayflow-app .dialog-actions {
        display: flex;
        justify-content: flex-end;
        gap: 8px;
      }
      #dayflow-app .sectionbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap;
      }
      #dayflow-app footer {
        font-size: 12px;
        color: var(--muted);
        margin-top: 18px;
      }
      #dayflow-app .confirmrow {
        display: flex;
        gap: 9px;
        align-items: center;
      }
      #dayflow-app .confirmrow input {
        flex: 1;
        min-width: 0;
      }
      #dayflow-app .confirmed {
        color: #8fbfff;
        font-size: 12px;
      }
      #dayflow-app .timehint {
        font-variant-numeric: tabular-nums;
      }
      #dayflow-app .settings-head .timer-actions {
        display: flex;
        align-items: center;
        gap: 3px;
        flex-shrink: 0;
      }
      #dayflow-app .settings-head .timer-action {
        width: 36px;
        height: 36px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        line-height: 1;
        transition: background .16s,border-color .16s,box-shadow .16s;
      }
      #dayflow-app .settings-head .timer-action.edit-action {
        background: #182b43;
        border-color: #285386;
        font-size: 19px;
      }
      #dayflow-app .settings-head .timer-action.edit-action:hover {
        background: #224775;
        border-color: #548cdb;
        box-shadow: 0 0 9px #2463aa66;
      }
      #dayflow-app .settings-head .timer-action.delete-action {
        background: #4b1823;
        border-color: #8d3849;
        color: #fff;
      }
      #dayflow-app .settings-head .timer-action.delete-action:hover {
        background: #d71f36;
        border-color: #ff6478;
        box-shadow: 0 0 10px #e3293b88;
      }
      #dayflow-app .settings-head .timer-action svg {
        display: block;
        width: 18px;
        height: 18px;
        flex: none;
      }
      #dayflow-app .timer.skipped {
        opacity: .88;
        border-color: rgba(255,98,108,.82);
        background: linear-gradient(180deg,rgba(37,12,17,.96),rgba(20,9,12,.94) 72%);
      }
      #dayflow-app .timer.skipped::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        border-radius: inherit;
        background: radial-gradient(65% 32% at 50% 0%,rgba(255,127,130,.13),transparent 75%);
        animation: none;
      }
      #dayflow-app .timer.skipped .fill {
        filter: saturate(1.1);
        box-shadow: 0 0 12px rgba(255,82,93,.34);
      }
      #dayflow-app .timer.skipped .meta {
        text-shadow: 0 0 7px rgba(255,98,108,.25);
      }
      #dayflow-app .skipped-badge {
        border-color: #ff7780;
        color: #ffdadb;
        background: radial-gradient(circle at 35% 30%,rgba(255,209,210,.25),rgba(231,65,77,.20) 50%,rgba(120,23,32,.32));
        box-shadow: 0 0 12px rgba(255,62,80,.36),inset 0 0 8px rgba(255,208,212,.12);
        animation: none;
      }
      #dayflow-app .expired-badge {
        border-color: #bc93ff;
        color: #ebdcff;
        background: radial-gradient(circle at 35% 30%,rgba(239,225,255,.28),rgba(155,94,230,.23) 50%,rgba(82,38,140,.35));
        box-shadow: 0 0 12px rgba(167,98,255,.38),inset 0 0 9px rgba(231,206,255,.18);
        animation: none;
      }
      #dayflow-app .expired-badge {
        display: grid;
        place-items: center;
        padding: 0;
        line-height: 0;
        text-align: center;
      }
      #dayflow-app .expired-badge svg {
        display: block;
        width: 20px;
        height: 20px;
        margin: 0;
        flex: none;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
        transform: none;
      }
      #dayflow-app .timer.expired {
        opacity: .9;
        border-color: rgba(190,139,255,.88);
        background: linear-gradient(180deg,rgba(32,17,48,.96),rgba(19,11,29,.96) 72%);
      }
      #dayflow-app .timer.expired::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        pointer-events: none;
        background: radial-gradient(70% 34% at 50% 0%,rgba(200,156,255,.15),transparent 70%),radial-gradient(80% 48% at 50% 100%,rgba(144,67,238,.12),transparent 72%);
        animation: dayflow5-successGlow 1.8s ease-in-out infinite;
      }
      #dayflow-app .timer.expired .fill {
        background: #ae72f8;
        filter: saturate(1.12) brightness(1.06);
        box-shadow: 0 0 15px rgba(169,101,255,.48);
      }
      #dayflow-app .timer.success .meta {
        text-shadow: 0 0 7px rgba(118,255,109,.20);
      }
      #dayflow-app .timer.paused-status {
        border-color: #FF0000;
        transform: translateY(-1px);
      }
      #dayflow-app .timer.paused-status::before {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: inherit;
        pointer-events: none;
        background: radial-gradient(70% 42% at 50% 100%,rgba(255,24,24,.22),transparent 75%),radial-gradient(55% 35% at 50% 0%,rgba(255,0,0,.13),transparent 76%);
        filter: blur(9px);
        opacity: .95;
      }
      #dayflow-app .timer.paused-status::after {
        content: "";
        position: absolute;
        inset: 1px;
        border-radius: inherit;
        pointer-events: none;
        border: 1px solid rgba(255,65,65,.73);
      }
      #dayflow-app .timer.paused-status .meta {
        font-weight: 750;
        text-shadow: 0 0 8px rgba(255,79,106,.34),0 0 15px rgba(255,55,85,.14);
      }
      #dayflow-app .timer.active .meta {
        font-weight: 750;
        text-shadow: 0 0 8px rgba(99,255,120,.43),0 0 17px rgba(67,255,111,.19);
      }
      #dayflow-app .play-badge,#dayflow-app .pause-badge {
        display: grid;
        place-items: center;
        padding: 0;
        line-height: 0;
        text-align: center;
        animation: none;
      }
      #dayflow-app .play-badge {
        border-color: #91ff82;
        color: #caffbf;
        background: radial-gradient(circle at 35% 30%,rgba(232,255,226,.28),rgba(83,225,92,.22) 50%,rgba(29,105,42,.30));
        box-shadow: 0 0 12px rgba(105,255,112,.35),inset 0 0 9px rgba(216,255,218,.14);
      }
      #dayflow-app .pause-badge {
        border-color: #ff6565;
        color: #ffcece;
        background: radial-gradient(circle at 35% 30%,rgba(255,226,226,.26),rgba(231,47,58,.20) 50%,rgba(116,18,29,.35));
        box-shadow: 0 0 12px rgba(255,30,42,.39),inset 0 0 9px rgba(255,207,207,.12);
      }
      #dayflow-app .play-badge svg,#dayflow-app .pause-badge svg {
        display: block;
        width: 20px;
        height: 20px;
        margin: 0;
        fill: currentColor;
        stroke: none;
      }
      #dayflow-app .play-badge .play-triangle {
        transition: opacity .18s ease-in-out;
      }
      #dayflow-app .timer.active .timer-right {
        position: relative;
      }
      #dayflow-app .timer.active .timer-right .play-badge {
        position: absolute;
        right: 78px;
        top: 50%;
        transform: translateY(-50%);
        flex: none;
      }
      #dayflow-app .timer.active .timer-right:has(.long-countdown) .play-badge {
        right: 119px;
      }
      #dayflow-app .frozen-badge {
        border-color: #a6e7ff;
        color: #e6faff;
        background: radial-gradient(circle at 35% 30%,rgba(244,254,255,.32),rgba(105,205,255,.26) 50%,rgba(35,114,168,.32));
        box-shadow: 0 0 12px rgba(128,216,255,.46),inset 0 0 9px rgba(235,254,255,.23);
        animation: none;
      }
      #dayflow-app .volume-console {
        display: flex;
        align-items: center;
        gap: 7px;
        padding: 12px 9px;
        background: linear-gradient(145deg,#09131a,#111b22);
        border: 1px solid #314b45;
        border-radius: 12px;
        min-width: 0;
      }
      #dayflow-app .speaker-symbol {
        width: 26px;
        flex: none;
        text-align: center;
        font-size: 22px;
        filter: drop-shadow(0 0 5px #80ff7866);
      }
      #dayflow-app .volume-console button {
        flex: none;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 35px;
        border-radius: 8px;
      }
      #dayflow-app .volume-step {
        width: 31px;
        font-size: 22px;
        background: #152a24;
        border: 1px solid #35644b;
        color: #b7ffaf;
      }
      #dayflow-app .volume-step:hover {
        background: #20543b;
        border-color: #6cff7d;
      }
      #dayflow-app .volume-step:disabled {
        opacity: .4;
        cursor: default;
      }
      #dayflow-app .volume-stairs {
        flex: 1;
        min-width: 48px;
        height: 36px;
        display: flex;
        align-items: flex-end;
        gap: 3px;
        padding: 3px 1px;
      }
      #dayflow-app .volume-bar {
        flex: 1;
        min-width: 3px;
        height: var(--step-height);
        border-radius: 3px 3px 1px 1px;
        background: #24352f;
        border: 1px solid #385344;
        transition: background .18s,box-shadow .18s,border-color .18s;
      }
      #dayflow-app .volume-bar.lit {
        background: linear-gradient(180deg,#a6ff6e 0%,#45f979 47%,#16b959 100%);
        border-color: #83ff8c;
        box-shadow: 0 0 8px #48ff7b77,0 0 3px #72ff8e88;
      }
      #dayflow-app .volume-mute {
        width: 46px;
        font-size: 11px;
        background: #263039;
        border: 1px solid #596571;
        color: #dce6ee;
      }
      #dayflow-app .volume-mute:hover {
        background: #3b4651;
      }
      #dayflow-app .volume-mute.is-muted {
        color: #ffd5d8;
        background: #50202b;
        border-color: #ff7482;
      }
      #dayflow-app .speaker-stack {
        display: flex;
        flex: none;
        min-width: 43px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 7px;
      }
      #dayflow-app .volume-readout {
        font-size: 11px;
        color: #a7ffb0;
        font-weight: 800;
        letter-spacing: .2px;
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
        text-align: center;
        text-shadow: 0 0 7px rgba(82,255,130,.24);
      }
      @media(max-width:400px) {
        #dayflow-app .volume-console {
          gap: 5px;
          padding: 9px 6px;
        }
        #dayflow-app .speaker-symbol {
          width: 21px;
          font-size: 18px;
        }
        #dayflow-app .speaker-stack {
          min-width: 39px;
          gap: 6px;
        }
        #dayflow-app .volume-readout {
          font-size: 10px;
        }
        #dayflow-app .volume-step {
          width: 26px;
        }
        #dayflow-app .volume-mute {
          width: 41px;
        }
        #dayflow-app .volume-stairs {
          gap: 2px;
        }
      }
      #dayflow-app [hidden] {
        display: none!important;
      }
      #dayflow-app .header-logo {
        display: block;
        max-width: min(330px,75vw);
        max-height: 105px;
        width: auto;
        height: auto;
        object-fit: contain;
        object-position: left center;
      }
      #dayflow-app .header-logo[hidden],#dayflow-app .logo-fallback[hidden] {
        display: none!important;
      }
      #dayflow-app .logo-fallback {
        font-size: clamp(25px,4vw,36px);
        margin: 0;
        color: #f13e4d;
      }
      #dayflow-app.dayflow-app {
        --timer-top-gap: 12px;
      }
      #dayflow-app .me-plan-summary {
        display: grid;
        gap: 8px;
        margin: 5px 0 15px;
        padding: 13px 15px;
        border: 1px solid rgba(122,145,177,.24);
        border-radius: 12px;
        background: linear-gradient(135deg,rgba(24,33,47,.94),rgba(13,19,29,.94));
        box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      }
      #dayflow-app .me-plan-line {
        display: grid;
        align-items: center;
        column-gap: 12px;
        line-height: 1.55;
      }
      #dayflow-app .me-plan-label {
        font-size: 12px;
        color: #bac7d9;
        font-weight: 650;
      }
      #dayflow-app .me-plan-value {
        font-size: 13px;
        color: #f5f8ff;
        font-weight: 800;
        font-variant-numeric: tabular-nums;
        text-align: right;
        overflow-wrap: anywhere;
      }
      #dayflow-app .me-plan-line:nth-child(2) {
        padding-top: 7px;
        border-top: 1px solid rgba(167,184,205,.12);
      }
      #dayflow-app .me-plan-subvalue {
        font-size: 11px;
        color: #aeb5c2;
        font-weight: 500;
      }
      @media(max-width:480px) {
        #dayflow-app .me-plan-summary {
          padding: 11px 12px;
        }
        #dayflow-app .me-plan-label {
          font-size: 11px;
        }
        #dayflow-app .me-plan-value {
          font-size: 12px;
        }
        #dayflow-app .me-plan-line {
          grid-template-columns: minmax(0,1fr) minmax(0,1.22fr);
          column-gap: 8px;
        }
      }
      #dayflow-app .timer-column {
        min-width: 0;
        display: flex;
        flex-direction: column;
      }
      #dayflow-app .timer-panel-head {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        flex-wrap: wrap;
        margin-bottom: 12px;
      }
      #dayflow-app .timer-panel-head h2 {
        margin: 0;
      }
      #dayflow-app .timer-file-actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 9px;
        flex-wrap: wrap;
      }
      #dayflow-app .timer-file-actions button {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 40px;
      }
      #dayflow-app .timer-file-actions .save-file {
        background: #183c2b;
        border-color: #398554;
      }
      #dayflow-app .timer-file-actions .save-file:hover {
        background: #225d3d;
      }
      #dayflow-app .timer-file-actions .load-file {
        background: #182b43;
        border-color: #285386;
      }
      #dayflow-app .timer-file-actions input[type=file] {
        display: none;
      }
      @media(max-width:440px) {
        #dayflow-app .timer-file-actions {
          justify-content: flex-start;
        }
        #dayflow-app .timer-file-actions button {
          font-size: 12px;
          padding: 8px 9px;
        }
      }
      #dayflow-app.dayflow-app {
        --custom-page: #050608;
        --custom-panel: #0c0e12;
        --custom-timer: #0c1017;
        --custom-button: #1f6fd1;
        --custom-button-border: #2b323b;
        --custom-text: #ffffff;
      }
      div#dayflow-app {
        color: var(--custom-text);
      }
      #dayflow-app .panel {
        background: var(--custom-panel);
      }
      #dayflow-app .settings-item {
        background: color-mix(in srgb,var(--custom-panel) 90%,white 10%);
      }
      #dayflow-app .timer:not(.active):not(.paused-status):not(.success):not(.expired):not(.skipped):not(.frozen) {
        background: linear-gradient(180deg,var(--custom-timer),color-mix(in srgb,var(--custom-timer) 80%,black 20%) 72%);
      }
      #dayflow-app button:not(.timer-action):not(.volume-step):not(.volume-mute) {
        background: var(--custom-button);
        border-color: var(--custom-button-border);
        color: var(--custom-text);
      }
      #dayflow-app button:not(.timer-action):not(.volume-step):not(.volume-mute):hover {
        background: color-mix(in srgb,var(--custom-button) 77%,white 23%);
        border-color: var(--custom-button-border);
      }
      #dayflow-app h2,#dayflow-app .sectionbar strong,#dayflow-app .settings-name,#dayflow-app .timer-name,#dayflow-app .countdown,#dayflow-app .me-plan-value,#dayflow-app .timer-file-actions button,#dayflow-app label {
        color: var(--custom-text);
      }
      #dayflow-app .timer.active .meta {
        color: #91FF82;
      }
      #dayflow-app .timer.paused-status .meta {
        color: #FF6565;
      }
      #dayflow-app .timer.frozen .meta {
        color: #aee4ff;
      }
      #dayflow-app .timer.skipped .meta {
        color: #ff626c;
      }
      #dayflow-app .timer.expired .meta {
        color: #d3b1ff;
      }
      #dayflow-app .timer.success .meta {
        color: #a5f79a;
      }
      #dayflow-app .theme-editor {
        border: 1px solid #344354;
        border-radius: 11px;
        background: color-mix(in srgb,var(--custom-panel) 80%,white 20%);
        margin: 16px 0 19px;
        overflow: hidden;
      }
      #dayflow-app .theme-editor summary {
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 9px;
        cursor: pointer;
        font-size: 14px;
        font-weight: 800;
        padding: 13px;
        color: var(--custom-text);
      }
      #dayflow-app .theme-editor summary::-webkit-details-marker {
        display: none;
      }
      #dayflow-app .theme-editor summary::after {
        content: "▾";
        color: #91b5ed;
        transition: transform .18s;
      }
      #dayflow-app .theme-editor[open] summary::after {
        transform: rotate(180deg);
      }
      #dayflow-app .theme-editor-body {
        padding: 0 13px 13px;
      }
      #dayflow-app .theme-editor-body p {
        font-size: 12px;
        margin: 1px 0 12px;
      }
      #dayflow-app .theme-color-grid {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 11px;
      }
      #dayflow-app .theme-color-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        border: 1px solid #354150;
        border-radius: 8px;
        padding: 9px;
        background: rgba(0,0,0,.15);
        font-size: 12px;
      }
      #dayflow-app .theme-color-item span {
        flex: 1;
        overflow-wrap: anywhere;
        color: var(--custom-text);
      }
      #dayflow-app .theme-color-item input[type=color] {
        width: 43px;
        height: 34px;
        min-width: 43px;
        padding: 2px;
        cursor: pointer;
      }
      #dayflow-app .theme-actions {
        display: flex;
        justify-content: flex-end;
        margin-top: 12px;
      }
      #dayflow-app .theme-actions button {
        font-size: 12px;
        padding: 8px 11px;
      }
      @media(max-width:440px) {
        #dayflow-app .theme-color-grid {
          grid-template-columns: 1fr;
        }
      }
      div#dayflow-app {
        padding-bottom: calc(var(--dayflow-dock-space) + env(safe-area-inset-bottom, 0px));
      }
      @media(min-width:651px) and (max-width:1100px) {
      }
      @media(max-width:650px) {
      }
      @media(max-width:350px) {
        #dayflow-app.dayflow-app {
          --dayflow-dock-space: 72px;
        }
      }
      #dayflow-app .mobile-settings-toggle {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
        border: 0;
      }
      #dayflow-app .mobile-settings-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: var(--custom-text);
        margin: 0 0 12px;
        cursor: default;
      }
      #dayflow-app .mobile-settings-chevron {
        display: none;
      }
      #dayflow-app .mobile-settings-content {
        display: block;
      }
      @media(max-width:800px) {
        #dayflow-app .mobile-settings-heading {
          margin: 0;
          cursor: pointer;
          user-select: none;
          touch-action: manipulation;
        }
        #dayflow-app .mobile-settings-toggle:focus-visible + .mobile-settings-heading {
          outline: 2px solid #12bce5;
          outline-offset: 5px;
          border-radius: 5px;
        }
        #dayflow-app .mobile-settings-content {
          display: block;
          overflow: hidden;
          max-height: 0;
          opacity: 0;
          visibility: hidden;
          padding-top: 0;
          transition: max-height .30s cubic-bezier(.22,.68,0,1),opacity .22s ease,padding-top .30s ease,visibility 0s linear .30s;
        }
        #dayflow-app .mobile-settings-toggle:checked ~ .mobile-settings-content {
          display: block;
          visibility: visible;
          max-height: var(--mobile-expand-height,1600px);
          opacity: 1;
          padding-top: 19px;
          transition: max-height .30s cubic-bezier(.22,.68,0,1),opacity .22s ease,padding-top .30s ease,visibility 0s;
        }
        @media(prefers-reduced-motion:reduce) {
          #dayflow-app .mobile-settings-content,#dayflow-app .mobile-settings-toggle:checked ~ .mobile-settings-content {
            transition: none;
          }
        }
      }
      @media(max-width:650px) {
      }
      @media(max-width:350px) {
      }
      #dayflow-app .mobile-settings-close {
        display: none;
      }
      @media(max-width:800px) {
        #dayflow-app .mobile-settings-heading {
          min-height: 44px;
        }
        #dayflow-app .mobile-settings-chevron {
          display: grid;
          place-items: center;
          flex: 0 0 38px;
          width: 38px;
          height: 38px;
          padding: 0;
          margin: 0;
          border-radius: 10px;
          background: #10253a;
          border: 1px solid #285078;
          color: #69b5ff;
          font-size: 0;
          line-height: 0;
          transition: background .2s ease,border-color .2s ease;
        }
        #dayflow-app .mobile-settings-chevron svg {
          display: block;
          width: 20px;
          height: 20px;
          overflow: visible;
          transform: rotate(0deg);
          transition: transform .2s ease;
        }
        #dayflow-app .mobile-settings-chevron svg path {
          fill: none;
          stroke: currentColor;
          stroke-width: 2.2;
          stroke-linecap: round;
          stroke-linejoin: round;
        }
        #dayflow-app .mobile-settings-toggle:checked + .mobile-settings-heading .mobile-settings-chevron {
          transform: none;
        }
        #dayflow-app .mobile-settings-toggle:checked + .mobile-settings-heading .mobile-settings-chevron svg {
          transform: rotate(180deg);
        }
        #dayflow-app .mobile-settings-close {
          align-items: center;
          justify-content: center;
          gap: 12px;
          width: 100%;
          min-height: 52px;
          margin: 15px 0 0;
          padding: 8px 2px;
          cursor: pointer;
          touch-action: manipulation;
          user-select: none;
          background: transparent;
          border: 0;
          color: #69b5ff;
        }
        #dayflow-app .mobile-settings-close-line {
          height: 1px;
          flex: 1;
          background: linear-gradient(90deg,transparent,#40618a);
        }
        #dayflow-app .mobile-settings-close-line:last-child {
          background: linear-gradient(90deg,#40618a,transparent);
        }
        #dayflow-app .mobile-settings-close-icon {
          display: grid;
          place-items: center;
          flex: none;
          width: 40px;
          height: 36px;
          border: 1px solid #285078;
          border-radius: 10px;
          background: #10253a;
        }
        #dayflow-app .mobile-settings-close-icon svg {
          display: block;
          width: 20px;
          height: 20px;
        }
        #dayflow-app .mobile-settings-close-icon path {
          fill: none;
          stroke: currentColor;
          stroke-width: 2.2;
          stroke-linecap: round;
          stroke-linejoin: round;
        }
        #dayflow-app .mobile-settings-close:hover .mobile-settings-close-icon {
          background: #193650;
        }
        #dayflow-app .mobile-settings-toggle:focus-visible ~ .mobile-settings-content .mobile-settings-close {
          outline: 2px solid #12bce5;
          outline-offset: 2px;
          border-radius: 8px;
        }
      }
      #dayflow-app .theme-mode-switch {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 5px;
        margin: 0 0 14px;
        padding: 4px;
        background: color-mix(in srgb,var(--custom-panel) 85%,#8997aa 15%);
        border: 1px solid #56616c;
        border-radius: 12px;
      }
      #dayflow-app .theme-mode-switch button {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 0;
        gap: 5px;
        border-radius: 9px;
        border: 1px solid transparent!important;
        background: transparent!important;
        color: var(--custom-text)!important;
        font-weight: 750;
        box-shadow: none!important;
        white-space: normal;
        text-align: center;
        line-height: 1.25;
        transition: background .15s,box-shadow .15s;
      }
      #dayflow-app .theme-mode-switch button[aria-pressed="true"] {
        background: var(--custom-button)!important;
        color: #fff!important;
        box-shadow: 0 2px 7px rgba(0,0,0,.22)!important;
      }
      #dayflow-app .theme-mode-switch button:hover:not([aria-pressed="true"]) {
        background: rgba(125,146,171,.15)!important;
      }
      #dayflow-app .theme-mode-switch button:focus-visible {
        outline: 2px solid #4a9dff;
        outline-offset: 2px;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] footer {
        color: #071f34;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] footer strong {
        color: #061a2a;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] {
        color-scheme: light;
        --muted: #576779;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .panel {
        border-color: #dfe6ee;
        box-shadow: 0 6px 22px rgba(24,45,76,.045);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-editor {
        border-color: #d8e1eb;
        background: #f5f7fa;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-mode-switch {
        background: #ebf0f5;
        border-color: #d4dee9;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-mode-switch button:not([aria-pressed="true"]) {
        color: #233247!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-editor summary::after {
        color: #396a9e;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-editor-body p {
        color: #526174;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-color-item {
        background: #fff;
        border-color: #dce4ec;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-summary {
        background: linear-gradient(135deg,#f6f9fc,#eef3f8);
        border-color: #d9e2ed;
        box-shadow: none;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-label {
        color: #526174;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-value {
        color: #1b2c42;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-line:nth-child(2) {
        border-top-color: #dce4ed;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] p,#dayflow-app.dayflow-app[data-theme-mode="light"] .help,#dayflow-app.dayflow-app[data-theme-mode="light"] footer {
        color: #566577;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] footer strong {
        color: #273448;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] label {
        color: var(--custom-text);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] input:not([type="color"]):not([type="checkbox"]):not([type="file"]) {
        background: #fff;
        color: #1e2d43;
        border-color: #c7d3df;
        color-scheme: light;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] input[type="color"] {
        background: #fff;
        border-color: #c7d3df;
        color-scheme: light;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] input[type="checkbox"] {
        accent-color: #1e6ac8;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer:not(.active):not(.paused-status):not(.success):not(.expired):not(.skipped):not(.frozen) {
        border-color: #d6dfea;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer:not(.active):not(.paused-status):not(.success):not(.expired):not(.skipped):not(.frozen) .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer:not(.active):not(.paused-status):not(.success):not(.expired):not(.skipped):not(.frozen) .countdown {
        color: var(--custom-text);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer:not(.active):not(.paused-status):not(.success):not(.expired):not(.skipped):not(.frozen) .meta {
        color: #526174;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer:not(.active):not(.paused-status):not(.success):not(.expired):not(.skipped):not(.frozen) .track {
        background: #dce5ed;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.active .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.paused-status .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.success .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.expired .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.skipped .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.active .countdown,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.paused-status .countdown,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.success .countdown,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.expired .countdown,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.skipped .countdown,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen .countdown {
        color: #fff;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-action.edit-action {
        background: #e9f1fc;
        border-color: #acc7ea;
        color: #22548b;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-action.delete-action {
        background: #fae8ec;
        border-color: #e6b7c2;
        color: #992f43;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] button:not(.timer-action):not(.volume-step):not(.volume-mute):not(.theme-mode-button) {
        color: #fff;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .mobile-settings-heading {
        color: var(--custom-text);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .mobile-settings-chevron,#dayflow-app.dayflow-app[data-theme-mode="light"] .mobile-settings-close-icon {
        background: #eaf2fa;
        border-color: #c9d9ed;
        color: #326ba6;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .mobile-settings-close-line {
        background: linear-gradient(90deg,transparent,#a3b5c8);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .mobile-settings-close-line:last-child {
        background: linear-gradient(90deg,#a3b5c8,transparent);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .volume-readout {
        color: #177245;
        text-shadow: none;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .volume-step {
        background: #dcece5;
        color: #155d38;
        border-color: #a0c3ad;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .volume-bar:not(.lit) {
        background: #cad8d4;
        border-color: #b1c6bd;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .volume-mute {
        background: #e6ecf2;
        color: #334256;
        border-color: #becbd8;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .auto-option span {
        color: #526174;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] kbd {
        background: #e5edf5;
        border-color: #c5d3e2;
        color: #273448;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] dialog {
        background: #fff;
        color: #1f2d43;
        border-color: #ccd9e8;
        color-scheme: light;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] dialog h2 {
        color: #1f2d43;
      }
      #dayflow-app .timer.active {
        box-shadow: 0 0 4px rgba(100,255,128,.26),0 0 9px rgba(83,255,134,.12),inset 0 0 5px rgba(100,255,128,.04);
      }
      #dayflow-app .timer.paused-status {
        box-shadow: 0 0 4px rgba(255,45,55,.29),0 0 9px rgba(255,0,0,.13),inset 0 0 5px rgba(255,0,0,.04);
      }
      #dayflow-app .timer.success {
        box-shadow: 0 0 4px rgba(145,255,128,.30),0 0 9px rgba(118,255,104,.13),inset 0 0 5px rgba(118,255,104,.04);
      }
      #dayflow-app .timer.frozen {
        box-shadow: 0 0 4px rgba(111,198,248,.28),0 0 9px rgba(65,158,231,.13),inset 0 0 5px rgba(151,219,255,.05);
      }
      #dayflow-app .timer.skipped {
        box-shadow: 0 0 4px rgba(255,78,93,.29),0 0 9px rgba(255,49,75,.13),inset 0 0 5px rgba(255,70,90,.04);
      }
      #dayflow-app .timer.expired {
        box-shadow: 0 0 4px rgba(186,123,255,.30),0 0 9px rgba(157,81,244,.14),inset 0 0 5px rgba(151,74,242,.05);
      }
      #dayflow-app .timer.active::before,#dayflow-app .timer.paused-status::before {
        opacity: .20;
        filter: blur(3px);
        animation: none;
      }
      #dayflow-app .timer.active::after {
        animation: none;
        border-color: rgba(157,255,137,.34);
        box-shadow: inset 0 0 5px rgba(116,255,102,.06);
      }
      #dayflow-app .timer.paused-status::after {
        border-color: rgba(255,65,65,.35);
        box-shadow: inset 0 0 5px rgba(255,0,0,.06);
      }
      #dayflow-app .timer.success::after,#dayflow-app .timer.expired::after {
        opacity: .30;
        animation: none;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-item {
        background: #ffffff;
        border-color: #d8e4f0;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-item input[type="number"] {
        background: #e9eef5;
        border-color: #c8d5e2;
        color: #1d2b40;
        color-scheme: light;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-item input[type="number"]:focus {
        background: #e3ebf4;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .volume-console {
        background: #ffffff;
        border-color: #d8e4f0;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen {
        opacity: 1;
        border-color: #367dad;
        background: linear-gradient(122deg,#396b91 0%,#234d73 34%,#143756 70%,#3d7196 100%);
        box-shadow: 0 0 4px rgba(35,103,159,.38),0 0 9px rgba(31,96,150,.17),
             inset 0 0 0 1px rgba(224,247,255,.30),inset 0 0 8px rgba(180,224,255,.09);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen::before {
        opacity: 1;
        filter: drop-shadow(0 0 1px rgba(226,250,255,.5));
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen::after {
        background: radial-gradient(ellipse at 0% 0%,rgba(214,245,255,.20),transparent 27%),
             radial-gradient(ellipse at 100% 100%,rgba(184,228,255,.15),transparent 29%),
             linear-gradient(180deg,rgba(226,247,255,.075),transparent 38%,rgba(102,169,221,.055));
        box-shadow: inset 0 0 2px 1px rgba(227,249,255,.55),inset 0 0 10px rgba(171,221,255,.10);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen .meta {
        color: #c2e9ff;
        text-shadow: none;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen .timer-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen .countdown {
        color: #fff;
        text-shadow: 0 1px 2px rgba(8,35,60,.32);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen .track {
        background: #173e61;
        box-shadow: inset 0 1px 3px rgba(6,29,47,.32);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer.frozen .frozen-badge {
        border-color: #b7e8ff;
        background: radial-gradient(circle at 35% 30%,rgba(233,252,255,.38),rgba(89,163,220,.33) 50%,rgba(21,74,126,.65));
        box-shadow: 0 0 5px rgba(105,190,243,.35),inset 0 0 7px rgba(230,249,255,.24);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer:not(.active):not(.paused-status):not(.success):not(.expired):not(.skipped):not(.frozen) {
        background: var(--custom-timer);
        border: 1px solid #a5bacd;
        box-shadow: none;
        transform: none;
      }
      #dayflow-app .me-plan-missed {
        padding-top: 7px;
        border-top: 1px solid rgba(167,184,205,.12);
      }
      #dayflow-app .me-plan-missed .me-plan-value {
        font-size: 12px;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-missed {
        border-top-color: #dce4ed;
      }
      #dayflow-app .mobile-settings-heading {
        font-size: 19px;
        font-weight: 700;
        line-height: normal;
        font-family: inherit;
        letter-spacing: normal;
      }
      #dayflow-app .timer-heading-group {
        display: flex;
        align-items: baseline;
        gap: 10px;
        flex-wrap: wrap;
        min-width: 0;
      }
      #dayflow-app .timer-heading-total {
        font-size: 12px;
        color: var(--muted);
        font-weight: 650;
        font-variant-numeric: tabular-nums;
      }
      #dayflow-app .timer-heading-total strong {
        color: var(--custom-text);
        font-weight: 800;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-heading-total {
        color: #526174;
      }
      #dayflow-app .me-plan-line:first-child .me-plan-value {
        color: #8cff78;
      }
      #dayflow-app .me-plan-line:nth-child(2) .me-plan-value {
        color: #edca86;
      }
      #dayflow-app .me-plan-missed .me-plan-value {
        color: #d3b1ff;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-line:first-child .me-plan-value {
        color: #136b3e;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-line:nth-child(2) .me-plan-value {
        color: #795218;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-missed .me-plan-value {
        color: #7844ac;
      }
      #dayflow-app .me-plan-line {
        grid-template-columns: minmax(0,1fr) minmax(0,1.22fr);
      }
      #dayflow-app .timer-total-row {
        margin: 0 0 10px;
        font-size: 13px;
        font-weight: 650;
        color: var(--muted);
        font-variant-numeric: tabular-nums;
      }
      #dayflow-app .timer-total-row strong {
        font-weight: 800;
        color: var(--custom-text);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-total-row {
        color: #526174;
      }
      #dayflow-app .me-plan-summary .me-plan-value,#dayflow-app
.me-plan-summary .me-plan-missed .me-plan-value {
        font-size: 13px;
      }
      @media(max-width:480px) {
        #dayflow-app .me-plan-summary .me-plan-value,#dayflow-app
  .me-plan-summary .me-plan-missed .me-plan-value {
          font-size: 12px;
        }
      }
      #dayflow-app #resetDialog .dialog-actions {
        flex-wrap: wrap;
      }
      #dayflow-app #resetDialog .dialog-actions button {
        flex: 1;
        min-width: 125px;
      }
      #dayflow-app .dayflow-brand {
        display: flex;
        justify-content: flex-start;
      }
      #dayflow-app .dayflow-brand-main {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        min-width: 0;
      }
      #dayflow-app .dayflow-logo {
        display: block;
        max-width: min(330px,80vw);
        width: auto;
        height: auto;
        object-fit: contain;
        object-position: left center;
      }
      #dayflow-app .dayflow-logo[hidden],#dayflow-app .dayflow-brand-title[hidden] {
        display: none!important;
      }
      #dayflow-app .dayflow-brand-title {
        font-size: clamp(34px,5vw,49px);
        line-height: 1.08;
        letter-spacing: .035em;
        font-weight: 900;
        color: #ffffff;
        margin: 0;
      }
      @media(max-width:650px) {
        #dayflow-app .dayflow-brand {
          margin-bottom: 24px;
          min-height: 105px;
        }
        #dayflow-app .dayflow-brand-title {
          font-size: 36px;
        }
      }
      #dayflow-app .layout {
        grid-template-columns: minmax(0,1.3fr) minmax(285px,.85fr);
        align-items: start;
      }
      @media(max-width:800px) {
        #dayflow-app .layout {
          grid-template-columns: minmax(0,1fr);
        }
      }
      #dayflow-app .timer-panel-head {
        align-items: center;
      }
      #dayflow-app .timer-edit-actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 9px;
        flex-wrap: wrap;
      }
      #dayflow-app .timer-edit-actions button {
        min-height: 40px;
        padding: 8px 12px;
        font-size: 13px;
      }
      #dayflow-app .settings-files {
        margin-bottom: 18px;
      }
      #dayflow-app .settings-files-title {
        font-weight: 700;
        margin-bottom: 9px;
        font-size: 13px;
        font-family: inherit;
        color: var(--custom-text);
      }
      #dayflow-app .settings-files .timer-file-actions {
        justify-content: flex-start;
      }
      #dayflow-app .settings-files .timer-file-actions button {
        flex: 1;
        white-space: normal;
        justify-content: center;
        font-size: 12px;
        padding: 9px;
      }
      #dayflow-app .timer-start-field {
        margin: 5px 0 18px;
        padding: 0;
      }
      #dayflow-app .timer-start-field .field {
        margin-bottom: 0;
      }
      #dayflow-app .timer-edit-dialog {
        overflow-y: auto;
        border-color: #435b79;
        background: #12151d;
        color: #fff;
      }
      #dayflow-app .timer-edit-dialog-heading {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
      }
      #dayflow-app .timer-edit-dialog-heading h2 {
        margin: 0;
      }
      #dayflow-app .timer-edit-dialog-heading button {
        font-size: 18px;
        min-width: 40px;
        min-height: 40px;
      }
      #dayflow-app .timer-edit-dialog #settingsList {
        margin: 15px 0;
      }
      #dayflow-app .timer-edit-dialog .settings-item {
        background: #171b24;
      }
      #dayflow-app .timer-edit-dialog .settings-name {
        color: #fff;
      }
      #dayflow-app .timer-edit-dialog .setting-grid input {
        color: #fff;
      }
      #dayflow-app .timer-edit-dialog-footer {
        border-top: 1px solid rgba(155,174,194,.2);
        padding-top: 15px;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog {
        background: #fff;
        color: #1d2b40;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog h2 {
        color: #1d2b40;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog .help {
        color: #526174;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog .settings-item {
        background: #f6f9fc;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog .settings-name {
        color: #1d2b40;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog .setting-grid input {
        color: #1d2b40;
        background: #e9eef5;
      }
      @media(max-width:520px) {
        #dayflow-app .timer-panel-head {
          align-items: stretch;
        }
        #dayflow-app .timer-edit-actions {
          justify-content: flex-start;
          width: 100%;
        }
        #dayflow-app .timer-edit-actions button {
          flex: 1;
          font-size: 12px;
          padding: 9px 7px;
        }
        #dayflow-app .timer-edit-dialog {
          padding: 14px;
        }
        #dayflow-app .timer-edit-dialog .setting-grid {
          grid-template-columns: minmax(0,1fr) minmax(0,1fr) 58px;
          gap: 6px;
        }
        #dayflow-app .timer-edit-dialog .settings-item {
          padding: 10px;
        }
      }
      #dayflow-app .timer {
        cursor: pointer;
        touch-action: pan-y;
      }
      #dayflow-app .timer:focus-visible {
        outline: 2px solid #8ecaff;
        outline-offset: 3px;
      }
      #dayflow-app .timer.dayflow-hover {
        border-color: rgba(255,255,255,.83)!important;
      }
      #dayflow-app .timer .timer-top {
        align-items: flex-start;
      }
      #dayflow-app .timer-edit-pencil {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
      }
      #dayflow-app .timer-edit-pencil svg {
        width: 19px;
        height: 19px;
        display: block;
        flex: none;
      }
      #dayflow-app .timer-edit-hint {
        font-size: 11px;
        color: #9fadc3;
        margin: 5px 0 9px;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-hint {
        color: #526174;
      }
      @media(max-width:520px) {
        #dayflow-app .timer-edit-pencil {
          min-width: 46px;
        }
      }
      #dayflow-app .editor-status {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap;
        margin: 11px 0 1px;
      }
      #dayflow-app .editor-status-label {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 5px 9px;
        border: 1px solid #64748b;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 800;
        background: rgba(100,116,139,.13);
        color: #d7e1ee;
      }
      #dayflow-app .editor-status-note {
        font-size: 12px;
        line-height: 1.5;
        color: var(--muted);
        margin: 7px 0 4px;
      }
      #dayflow-app .editor-status[data-status="frozen"] .editor-status-label {
        color: #b7ecff;
        border-color: #66bfe8;
        background: rgba(61,164,222,.14);
      }
      #dayflow-app .editor-status[data-status="transferred"] .editor-status-label {
        color: #ffb4ba;
        border-color: #e56d7c;
        background: rgba(225,65,84,.14);
      }
      #dayflow-app .editor-status[data-status="received"] .editor-status-label {
        color: #f2d79c;
        border-color: #d2a654;
        background: rgba(208,151,51,.13);
      }
      #dayflow-app .editor-status[data-status="completed"] .editor-status-label {
        color: #a6ef98;
        border-color: #79cb71;
        background: rgba(87,181,93,.13);
      }
      #dayflow-app .editor-status[data-status="missed"] .editor-status-label {
        color: #dabaff;
        border-color: #b58be9;
        background: rgba(144,91,208,.13);
      }
      #dayflow-app .editor-status[data-status="running"] .editor-status-label {
        color: #a6ef98;
        border-color: #79cb71;
        background: rgba(87,181,93,.13);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status-note {
        color: #526174;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status-label {
        color: #334155;
        background: #e9eef5;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status[data-status="frozen"] .editor-status-label {
        color: #17618f;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status[data-status="transferred"] .editor-status-label {
        color: #982b39;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status[data-status="received"] .editor-status-label {
        color: #855b13;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status[data-status="completed"] .editor-status-label {
        color: #216c31;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status[data-status="missed"] .editor-status-label {
        color: #75429d;
      }
      #dayflow-app .me-plan-extra {
        padding-top: 7px;
        border-top: 1px solid rgba(167,184,205,.12);
      }
      #dayflow-app .me-plan-extra .me-plan-value {
        color: #ff626c;
      }
      #dayflow-app .me-plan-extra:last-child .me-plan-value {
        color: #aee4ff;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-extra {
        border-top-color: #dce4ed;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-extra .me-plan-value {
        color: #ac293a;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-extra:last-child .me-plan-value {
        color: #216d95;
      }
      #dayflow-app .plan-stats-toggle {
        display: none;
      }
      @media(max-width:800px) {
        #dayflow-app .plan-stats-details {
          margin: 8px 0 15px;
          border: 1px solid var(--line);
          border-radius: 12px;
          background: var(--custom-panel);
          overflow: hidden;
        }
        #dayflow-app .plan-stats-toggle {
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: 12px;
          cursor: pointer;
          list-style: none;
          font-weight: 700;
          font-size: 19px;
          color: var(--custom-text);
          user-select: none;
        }
        #dayflow-app .plan-stats-toggle::-webkit-details-marker {
          display: none;
        }
        #dayflow-app .plan-stats-chevron {
          width: 38px;
          height: 38px;
          display: grid;
          place-items: center;
          flex: none;
          border-radius: 10px;
          background: #10253a;
          border: 1px solid #285078;
          color: #69b5ff;
        }
        #dayflow-app .plan-stats-chevron svg {
          width: 20px;
          height: 20px;
          fill: none;
          stroke: currentColor;
          stroke-width: 2.2;
          stroke-linecap: round;
          stroke-linejoin: round;
          transform: rotate(0);
          transition: transform .2s;
        }
        #dayflow-app .plan-stats-details[open] .plan-stats-chevron svg {
          transform: rotate(180deg);
        }
        #dayflow-app .plan-stats-details .me-plan-summary {
          margin: 0 11px 12px;
        }
        #dayflow-app.dayflow-app[data-theme-mode="light"] .plan-stats-chevron {
          background: #eaf2fa;
          border-color: #c9d9ed;
          color: #326ba6;
        }
      }
      @media(min-width:801px) {
        #dayflow-app .plan-stats-details>.me-plan-summary {
          display: grid!important;
        }
      }
      @media(max-width:650px) {
      }
      @media(max-width:350px) {
      }
      #dayflow-app .editor-status-live {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        padding: 5px 9px;
        border: 1px solid #79cb71;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 800;
        background: rgba(87,181,93,.13);
        color: #a6ef98;
      }
      #dayflow-app .editor-status-live[data-live="paused"] {
        border-color: #e56d7c;
        background: rgba(225,65,84,.14);
        color: #ffb4ba;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status-live {
        color: #216c31;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .editor-status-live[data-live="paused"] {
        color: #982b39;
      }
      #dayflow-app .timer-edit-dialog .timer-edit-dialog-heading {
        top: 0;
        margin-top: -10px;
        border-bottom: 1px solid rgba(155,174,194,.18);
      }
      #dayflow-app .timer-edit-dialog .timer-edit-dialog-heading #closeTimerEditorTop {
        position: relative;
        flex: none;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog .timer-edit-dialog-heading {
        background: #fff;
        border-bottom-color: #dce4ed;
      }
      #dayflow-app .plan-stats-details.panel {
        display: block;
        margin-top: 18px;
        padding: 15px 18px;
        min-width: 0;
      }
      #dayflow-app .plan-stats-details.panel>.me-plan-summary {
        margin: 0;
      }
      @media(max-width:800px) {
        #dayflow-app .plan-stats-details.panel {
          margin: 18px 0 0;
          padding: 0;
          border: 1px solid var(--line);
          border-radius: 15px;
          background: var(--custom-panel);
          overflow: hidden;
        }
        #dayflow-app .plan-stats-details.panel>.me-plan-summary {
          margin: 0 13px 13px;
        }
        #dayflow-app .plan-stats-toggle {
          padding: 13px 18px;
        }
      }
      @media(max-width:650px) {
      }
      #dayflow-app .sidebar-column {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 18px;
      }
      #dayflow-app .sidebar-column>.plan-stats-details.panel {
        margin: 0;
      }
      #dayflow-app .sidebar-column>.mobile-settings-panel {
        min-width: 0;
      }
      @media(min-width:801px) {
        #dayflow-app .sidebar-column .plan-stats-toggle {
          display: flex;
          align-items: center;
          padding: 0;
          margin: 0 0 13px;
          cursor: default;
          font-weight: 700;
          font-size: 19px;
          color: var(--custom-text);
          list-style: none;
          pointer-events: none;
        }
        #dayflow-app .sidebar-column .plan-stats-chevron {
          display: none;
        }
        #dayflow-app .sidebar-column .plan-stats-details:not([open])>.me-plan-summary,#dayflow-app
  .sidebar-column .plan-stats-details:not([open])>.timer-total-row {
          display: block!important;
        }
        #dayflow-app .sidebar-column .plan-stats-details:not([open])>.me-plan-summary {
          display: grid!important;
        }
      }
      #dayflow-app .sidebar-column .plan-stats-details .timer-total-row {
        margin: 0 0 12px;
      }
      @media(max-width:800px) {
        #dayflow-app .sidebar-column {
          gap: 18px;
        }
        #dayflow-app .sidebar-column>.plan-stats-details.panel {
          margin: 0;
        }
        #dayflow-app .sidebar-column .plan-stats-details .timer-total-row {
          margin: 0 13px 12px;
        }
        #dayflow-app .keyboard-help {
          display: none!important;
        }
      }
      @media(min-width:801px) {
        #dayflow-app .timer-start-field .confirmrow {
          max-width: 50%;
        }
      }
      #dayflow-app .mobile-time-entry {
        display: none;
      }
      @media(max-width:800px) {
        #dayflow-app .timer-start-field .confirmrow {
          max-width: 100%;
        }
        #dayflow-app .mobile-time-entry {
          align-items: end;
          gap: 12px;
          flex-wrap: wrap;
          margin-top: 10px;
        }
        #dayflow-app .mobile-time-digits {
          display: flex;
          align-items: end;
          gap: 7px;
        }
        #dayflow-app .mobile-time-digits label {
          display: flex;
          flex-direction: column;
          gap: 5px;
          color: var(--custom-text);
        }
        #dayflow-app .mobile-time-digits input {
          width: 74px;
          height: 44px;
          text-align: center;
          font-size: 20px;
          font-weight: 750;
          font-variant-numeric: tabular-nums;
        }
        #dayflow-app .mobile-time-digits .time-separator {
          font-size: 24px;
          font-weight: 800;
          padding-bottom: 7px;
          color: var(--custom-text);
        }
        #dayflow-app .mobile-time-entry button {
          min-height: 44px;
          font-size: 13px;
        }
      }
      #dayflow-app .dayflow-copyright {
        font-size: 12px;
        padding: 14px 0 5px;
      }
      #dayflow-app .timer-edit-dialog {
        padding: 0;
        overflow: visible;
        max-height: min(85dvh,900px);
        width: min(760px,calc(100vw - 48px));
        max-width: min(760px,calc(100vw - 48px));
        position: fixed;
      }
      #dayflow-app .timer-edit-dialog .timer-edit-scroll {
        max-height: min(85dvh,900px);
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: 22px;
        border-radius: inherit;
        scrollbar-gutter: stable;
      }
      #dayflow-app .timer-edit-dialog .timer-edit-dialog-heading {
        position: static;
        z-index: auto;
        padding: 0;
        margin: 0;
        background: transparent;
        border: 0;
      }
      #dayflow-app .timer-edit-dialog #closeTimerEditorTop {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        display: grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        background: #c51e32!important;
        border: 2px solid #ff7885!important;
        color: #fff!important;
        box-shadow: 0 2px 10px rgba(0,0,0,.4),0 0 9px rgba(255,62,85,.24);
        cursor: pointer;
        touch-action: manipulation;
      }
      #dayflow-app .timer-edit-dialog #closeTimerEditorTop svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
        display: block;
      }
      #dayflow-app .timer-edit-dialog #closeTimerEditorTop:hover {
        background: #ed2a40!important;
        border-color: #ffacb5!important;
      }
      #dayflow-app .timer-edit-dialog #closeTimerEditorTop:focus-visible {
        outline: 2px solid #fff;
        outline-offset: 3px;
      }
      @media(max-width:520px) {
        #dayflow-app .timer-edit-dialog .timer-edit-scroll {
          padding: 14px;
        }
      }
      @media(max-width:650px) {
      }
      @media(max-width:380px) {
      }
      #dayflow-app #emptyTimerDialog {
        border-color: #9e3142;
      }
      #dayflow-app #emptyTimerDialog .dialog-actions {
        flex-wrap: wrap;
      }
      #dayflow-app #emptyTimerDialog .dialog-actions button {
        flex: 1;
        min-width: 116px;
      }
      @media(max-width:650px) {
      }
      #dayflow-app .dayflow-brand {
        margin-bottom: 0!important;
      }
      #dayflow-app .dayflow-brand {
        background: transparent!important;
        border: 0!important;
        border-radius: 0!important;
        box-shadow: none!important;
      }
      @media(max-width:650px) {
      }
      @media(min-width:651px) and (max-width:1100px) {
      }
      @media(max-width:800px) {
        #dayflow-app .mobile-time-entry {
          display: none!important;
        }
        #dayflow-app .mobile-settings-close {
          display: none!important;
        }
        #dayflow-app .sidebar-column>.mobile-settings-panel {
          padding: 0;
          overflow: hidden;
        }
        #dayflow-app .sidebar-column .mobile-settings-heading {
          min-height: 0;
          margin: 0;
          padding: 13px 18px;
          font-size: 19px;
          line-height: normal;
        }
        #dayflow-app .sidebar-column .mobile-settings-chevron {
          flex: 0 0 38px;
          width: 38px;
          height: 38px;
        }
        #dayflow-app .sidebar-column .mobile-settings-content {
          padding-left: 18px;
          padding-right: 18px;
        }
        #dayflow-app .sidebar-column .mobile-settings-toggle:checked~.mobile-settings-content {
          padding-bottom: 18px;
        }
        #dayflow-app .sidebar-column .plan-stats-toggle {
          min-height: 0;
          padding: 13px 18px;
          line-height: normal;
        }
      }
      @media(max-width:650px) {
      }
      @media(min-width:651px) and (max-width:1100px) {
      }
      #dayflow-app .dayflow-copyright {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 5px;
        line-height: 1.5;
        text-align: center;
      }
      #dayflow-app.dayflow-app {
        --dayflow-dock-space: 185px;
      }
      @media(max-width:650px) {
        #dayflow-app.dayflow-app {
          --dayflow-dock-space: calc(3 * clamp(44px,12vw,49px) + 28px);
        }
      }
      @media(min-width:651px) and (max-width:1100px) {
        #dayflow-app.dayflow-app {
          --dayflow-dock-space: 185px;
        }
      }
      #dayflow-app .timer-edit-dialog #closeTimerEditorTop,#dayflow-app
#nameDialog #closeNameDialogTop {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        display: grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        background: #c51e32!important;
        border: 2px solid #2b323b!important;
        color: #fff!important;
        box-shadow: 0 2px 10px rgba(0,0,0,.4),0 0 9px rgba(255,62,85,.24);
        cursor: pointer;
        touch-action: manipulation;
      }
      #dayflow-app .timer-edit-dialog #closeTimerEditorTop:hover,#dayflow-app
#nameDialog #closeNameDialogTop:hover {
        background: #ed2a40!important;
        border-color: #2b323b!important;
      }
      #dayflow-app #nameDialog #closeNameDialogTop svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
        display: block;
      }
      #dayflow-app #nameDialog #closeNameDialogTop:focus-visible {
        outline: 2px solid #fff;
        outline-offset: 3px;
      }
      #dayflow-app #nameDialog {
        overflow: visible;
        max-height: min(85dvh,900px);
        position: fixed;
      }
      #dayflow-app #nameDialog #nameForm {
        max-height: calc(min(85dvh,900px) - 46px);
        overflow-y: auto;
        overscroll-behavior: contain;
      }
      #dayflow-app #nameDialog {
        border-color: #435b79!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #nameDialog {
        border-color: #ccd9e8!important;
      }
      #dayflow-app .dayflow-brand-slogan {
        margin: 3px 0 0;
        font-family: Inter,"Segoe UI",Arial,sans-serif;
        font-size: clamp(14px,1.7vw,18px);
        font-weight: 500;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: .015em;
        color: #ffffff;
        background: none;
        -webkit-background-clip: border-box;
        background-clip: border-box;
        -webkit-text-fill-color: #ffffff;
        text-shadow: none;
      }
      @media(max-width:650px) {
        #dayflow-app .dayflow-brand-slogan {
          font-size: clamp(13px,3.5vw,16px);
          line-height: 1.5;
        }
      }
      #dayflow-app .dayflow-brand-slogan {
        display: none!important;
      }
      #dayflow-app .dayflow-brand {
        min-height: 0!important;
        padding: 7px 0 3px!important;
        margin: 0!important;
        align-items: center!important;
      }
      #dayflow-app .dayflow-brand-main {
        gap: 0!important;
      }
      #dayflow-app .dayflow-logo {
        max-height: 92px!important;
      }
      #dayflow-app .wrap {
        padding-top: 13px!important;
      }
      #dayflow-app .wrap > .layout {
        margin-top: 11px!important;
      }
      div#dayflow-app {
        background: linear-gradient(to bottom,
  #000000 0px,
  color-mix(in srgb,#000 95%,var(--custom-page) 5%) 108px,
  color-mix(in srgb,#000 78%,var(--custom-page) 22%) 270px,
  color-mix(in srgb,#000 51%,var(--custom-page) 49%) 477px,
  color-mix(in srgb,#000 24%,var(--custom-page) 76%) 693px,
  var(--custom-page) 900px)!important;
        background-color: var(--custom-page)!important;
        min-height: 100vh;
      }
      @media(max-width:650px) {
        #dayflow-app .dayflow-brand {
          padding: 4px 0 1px!important;
        }
        #dayflow-app .wrap > .layout {
          margin-top: 10px!important;
        }
        #dayflow-app .dayflow-logo {
          max-height: 84px!important;
        }
      }
      #dayflow-app #startTimeDialog {
        overflow: visible;
        position: fixed;
        border-color: #435b79!important;
        max-height: min(85dvh,900px);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #startTimeDialog {
        border-color: #ccd9e8!important;
      }
      #dayflow-app #startTimeDialog #startTime {
        max-width: 230px;
        min-height: 46px;
        font-size: 19px;
      }
      #dayflow-app #startTimeDialog #startConfirmed {
        font-size: 12px;
      }
      #dayflow-app #startTimeDialog #closeStartTimeDialog {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        display: grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        background: #c51e32!important;
        border: 2px solid #2b323b!important;
        color: #fff!important;
        box-shadow: 0 2px 10px rgba(0,0,0,.4);
        cursor: pointer;
      }
      #dayflow-app #startTimeDialog #closeStartTimeDialog:hover {
        background: #ed2a40!important;
      }
      #dayflow-app #startTimeDialog #closeStartTimeDialog svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
      }
      #dayflow-app #startTimeDialog .dialog-actions {
        flex-wrap: wrap;
      }
      #dayflow-app .theme-mode-switch button {
        font-size: 0!important;
        min-height: 53px;
        padding: 6px!important;
      }
      #dayflow-app .theme-mode-switch .theme-mode-symbol {
        font: normal 34px/1 "Segoe UI Symbol","Segoe UI",system-ui,sans-serif;
        display: flex;
        align-items: center;
        justify-content: center;
        transform: translateY(-1px);
      }
      #dayflow-app .theme-mode-switch .theme-mode-symbol svg {
        width: 34px;
        height: 34px;
        display: block;
        fill: currentColor;
        stroke: none;
      }
      #dayflow-app .empty-timer-state {
        display: grid;
        margin: 6px 0 2px;
        padding: 18px;
        border: 1px solid color-mix(in srgb,var(--dayflow-neutral-border) 76%,white 24%);
        border-radius: 15px;
        background: linear-gradient(180deg,color-mix(in srgb,var(--custom-panel) 92%,white 8%),color-mix(in srgb,var(--custom-panel) 98%,black 2%));
        box-shadow: inset 0 1px 0 rgba(255,255,255,.06),0 10px 24px rgba(0,0,0,.14);
      }
      #dayflow-app .empty-timer-copy {
        display: grid;
        text-align: center;
      }
      #dayflow-app .empty-timer-copy strong {
        color: var(--custom-text);
      }
      #dayflow-app .empty-timer-copy p {
        margin: 0;
        font-size: 14px;
        line-height: 1.5;
        color: color-mix(in srgb,var(--custom-text) 72%,#91a2b8 28%);
      }
      #dayflow-app .empty-timer-cta {
        justify-self: center;
        min-width: min(100%,280px);
        padding: 11px 16px;
        border-radius: 11px;
        font-weight: 800;
      }
      @media (max-width:800px) {
        #dayflow-app .empty-timer-state {
          padding: 16px;
        }
      }
      #dayflow-app .empty-timer-state {
        gap: 13px;
        text-align: center;
        justify-items: center;
        padding-block: 24px;
      }
      #dayflow-app .empty-timer-cta {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 48px;
        width: min(100%,300px);
        border: 1px solid color-mix(in srgb,var(--custom-button) 63%,white 37%);
        background: var(--custom-button);
        color: #fff!important;
        box-shadow: 0 4px 0 rgba(7,12,20,.48),0 11px 20px rgba(0,0,0,.20);
      }
      #dayflow-app .empty-timer-cta:hover {
        filter: brightness(1.11);
      }
      #dayflow-app .empty-timer-copy {
        gap: 6px;
      }
      #dayflow-app .empty-timer-copy strong {
        font-size: 17px;
      }
      @media(max-width:800px) {
        #dayflow-app .empty-timer-state {
          padding-block: 24px;
        }
        #dayflow-app .empty-timer-cta {
          width: min(100%,300px);
        }
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .dayflow-copyright,#dayflow-app.dayflow-app[data-theme-mode="dark"] .dayflow-copyright strong {
        color: #ffffff!important;
      }
      #dayflow-app #startTimeDialog {
        width: min(360px,calc(100vw - 36px))!important;
        max-width: min(360px,calc(100vw - 36px))!important;
        padding: 22px 18px!important;
      }
      #dayflow-app #startTimeForm {
        min-width: 0;
        gap: 12px;
      }
      #dayflow-app #startTimeDialog .timer-start-field {
        min-width: 0;
        margin: 0 0 4px;
      }
      #dayflow-app #startTimeDialog .timer-start-field .field {
        min-width: 0;
      }
      #dayflow-app #startTimeDialog .timer-start-field .help,#dayflow-app #startTimeDialog #startConfirmed {
        display: block;
        max-width: 100%;
        white-space: normal;
        overflow-wrap: break-word;
        line-height: 1.55;
      }
      #dayflow-app #startTimeDialog .confirmrow {
        max-width: 100%!important;
      }
      #dayflow-app #startTimeDialog .dialog-actions {
        display: grid;
        grid-template-columns: minmax(0,1fr) minmax(0,1fr);
        gap: 8px;
        width: 100%;
      }
      #dayflow-app #startTimeDialog .dialog-actions button {
        min-width: 0;
        padding: 10px 6px;
        font-size: 12px;
        white-space: normal;
        line-height: 1.25;
      }
      #dayflow-app .empty-timer-copy {
        width: min(100%,300px);
        max-width: 300px;
        margin-inline: auto;
      }
      #dayflow-app #resetDialog,#dayflow-app #emptyTimerDialog {
        position: fixed;
        overflow: visible;
      }
      #dayflow-app #closeResetDialogTop,#dayflow-app #closeEmptyTimerDialogTop {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        display: grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        background: #c51e32!important;
        border: 2px solid #2b323b!important;
        color: #fff!important;
        box-shadow: 0 2px 10px rgba(0,0,0,.4),0 0 9px rgba(255,62,85,.24);
        cursor: pointer;
        touch-action: manipulation;
      }
      #dayflow-app #closeResetDialogTop:hover,#dayflow-app #closeEmptyTimerDialogTop:hover {
        background: #ed2a40!important;
      }
      #dayflow-app #closeResetDialogTop svg,#dayflow-app #closeEmptyTimerDialogTop svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
        display: block;
      }
      #dayflow-app #closeResetDialogTop:focus-visible,#dayflow-app #closeEmptyTimerDialogTop:focus-visible {
        outline: 2px solid #fff;
        outline-offset: 3px;
      }
      #dayflow-app .settings-head .timer-action.complete-action {
        background: linear-gradient(180deg,#236b37,#124624);
        border: 1px solid #78ff6c;
        color: #d9ffcf
      }
      #dayflow-app .settings-head .timer-action.complete-action:hover {
        background: #2d9148;
        border-color: #a0ff91;
        box-shadow: 0 0 10px rgba(105,255,112,.35)
      }
      #dayflow-app .settings-head .timer-action.complete-action:hover:not(:disabled) {
        background: #22d94c;
        border-color: #abffb3;
        color: #fff;
        box-shadow: 0 0 14px rgba(53,255,89,.85),0 0 6px rgba(120,255,140,.65)
      }
      #dayflow-app .settings-head .settings-title-input {
        flex: 1;
        min-width: 0;
        width: 100%;
        font-weight: 800;
        font-size: 15px;
        line-height: 1.25;
        padding: 7px 9px;
        border-radius: 7px
      }
      #dayflow-app .settings-head .settings-title-fixed {
        flex: 1;
        min-width: 0
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-action.complete-action:hover:not(:disabled) {
        background: #22d94c;
        border-color: #abffb3;
        color: #fff
      }
      #dayflow-app .settings-head .timer-action.complete-action:disabled {
        opacity: .5;
        cursor: default
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-action.complete-action {
        background: #e1f8e5;
        border-color: #64c86d;
        color: #17662b
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-action.complete-action:hover {
        background: #c9f0d0
      }
      #dayflow-app #editTimersTop {
        background: var(--custom-button);
        border-color: var(--custom-button-border);
        color: var(--custom-text)
      }
      #dayflow-app .timer .timer-time-tab {
        display: flex;
        align-items: center;
        gap: 7px;
        width: max-content;
        max-width: calc(100% + 14px);
        margin: -14px 0 13px -14px;
        padding: 6px 12px 7px;
        border: 0;
        border-right: 1px solid #3f4753;
        border-bottom: 1px solid #3f4753;
        border-radius: 10px 0 9px 0;
        background: linear-gradient(180deg,#363d47,#292f39);
        color: #e4e8ee;
        font-size: 11px;
        font-weight: 700;
        line-height: 1.35;
        font-variant-numeric: tabular-nums;
        letter-spacing: .015em;
        white-space: nowrap;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.09);
        pointer-events: none;
      }
      #dayflow-app .timer .timer-time-tab svg {
        width: 13px;
        height: 13px;
        flex: none;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
        opacity: .83;
      }
      #dayflow-app .timer .timer-name {
        flex: 1;
        min-width: 0;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer .timer-time-tab {
        background: linear-gradient(180deg,#e8edf3,#dce3eb);
        border-right-color: #b4c0cd;
        border-bottom-color: #b4c0cd;
        color: #3e4c5e;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.78);
      }
      @media(max-width:440px) {
        #dayflow-app .timer .timer-time-tab {
          font-size: 10.5px;
          padding: 6px 9px 7px;
        }
      }
      #dayflow-app .settings-item .timer-time-tab {
        display: flex;
        align-items: center;
        gap: 7px;
        width: max-content;
        max-width: calc(100% + 12px);
        margin: -12px 0 13px -12px;
        padding: 6px 12px 7px;
        border: 0;
        border-right: 1px solid #3f4753;
        border-bottom: 1px solid #3f4753;
        border-radius: 9px 0 9px 0;
        background: linear-gradient(180deg,#363d47,#292f39);
        color: #e4e8ee;
        font-size: 11px;
        font-weight: 700;
        line-height: 1.35;
        font-variant-numeric: tabular-nums;
        letter-spacing: .015em;
        white-space: nowrap;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.09);
        pointer-events: none;
      }
      #dayflow-app .settings-item .timer-time-tab svg {
        width: 13px;
        height: 13px;
        flex: none;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
        opacity: .83;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-item .timer-time-tab {
        background: linear-gradient(180deg,#e8edf3,#dce3eb);
        border-right-color: #b4c0cd;
        border-bottom-color: #b4c0cd;
        color: #3e4c5e;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.78);
      }
      @media(max-width:520px) {
        #dayflow-app .timer-edit-dialog .settings-item .timer-time-tab {
          margin: -10px 0 12px -10px;
          max-width: calc(100% + 10px);
        }
      }
      @media(max-width:440px) {
        #dayflow-app .settings-item .timer-time-tab {
          font-size: 10.5px;
          padding: 6px 9px 7px;
        }
      }
      #dayflow-app .keyboard-guide {
        margin-top: 20px;
        padding: 16px;
        border: 1px solid color-mix(in srgb,var(--dayflow-neutral-border) 65%,#8797ad 35%);
        border-radius: 13px;
        background: color-mix(in srgb,var(--custom-panel) 90%,#869bb4 10%);
      }
      #dayflow-app .keyboard-guide-header {
        display: flex;
        align-items: center;
        gap: 11px;
        margin-bottom: 14px;
        color: var(--custom-text);
      }
      #dayflow-app .keyboard-guide-icon {
        display: grid;
        place-items: center;
        flex: none;
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: color-mix(in srgb,var(--custom-button) 22%,transparent);
        font-size: 23px;
        color: var(--custom-text);
      }
      #dayflow-app .keyboard-guide-header strong {
        display: block;
        font-size: 15px;
        line-height: 1.4;
      }
      #dayflow-app .keyboard-guide-header small {
        display: block;
        font-size: 12px;
        font-weight: 500;
        color: var(--muted);
      }
      #dayflow-app .section-title-inline {
        display: flex;
        align-items: center;
        gap: 11px;
        min-width: 0;
        color: var(--custom-text);
      }
      #dayflow-app .section-title-iconbox {
        display: grid;
        place-items: center;
        flex: none;
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: color-mix(in srgb,var(--custom-button) 22%,transparent);
        font-size: 22px;
        line-height: 1;
        color: var(--custom-text);
      }
      #dayflow-app .section-title-text {
        display: block;
        font-size: inherit;
        font-weight: inherit;
        line-height: 1.2;
        color: inherit;
      }
      #dayflow-app .timer-panel-head h2,#dayflow-app .plan-stats-toggle .section-title-text,#dayflow-app .mobile-settings-heading .section-title-text {
        margin: 0;
        font-size: inherit;
        font-weight: inherit;
      }
      #dayflow-app .plan-stats-toggle .section-title-inline,#dayflow-app .mobile-settings-heading .section-title-inline {
        gap: 10px;
      }
      #dayflow-app .section-title-iconbox svg {
        width: 24px;
        height: 24px;
        display: block;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.85;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .section-title-iconbox {
        color: var(--custom-text);
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .section-title-iconbox {
        color: var(--custom-text);
      }
      #dayflow-app .shortcut-grid {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 7px;
      }
      #dayflow-app .shortcut-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-width: 0;
        min-height: 39px;
        padding: 8px 10px;
        border: 1px solid color-mix(in srgb,var(--dayflow-neutral-border) 60%,#788ca5 40%);
        border-radius: 8px;
        background: color-mix(in srgb,var(--custom-panel) 84%,#75879e 16%);
      }
      #dayflow-app .shortcut-item kbd {
        flex: none;
        min-width: 33px;
        text-align: center;
        padding: 4px 7px;
        background: color-mix(in srgb,var(--custom-panel) 73%,#2e3b51 27%);
        color: var(--custom-text);
        border: 1px solid color-mix(in srgb,var(--dayflow-neutral-border) 66%,#8b9db2 34%);
        box-shadow: 0 2px 0 rgba(0,0,0,.16);
        font-size: 12px;
        font-weight: 750;
        white-space: nowrap;
      }
      #dayflow-app .shortcut-item span {
        font-size: 12px;
        text-align: right;
        line-height: 1.3;
        color: var(--custom-text);
        overflow-wrap: break-word;
      }
      #dayflow-app .shortcut-note {
        font-size: 11px;
        margin: 12px 2px 0;
        color: var(--muted);
        line-height: 1.45;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .keyboard-guide {
        background: #f2f6fb;
        border-color: #cbd8e6;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .shortcut-item {
        background: #fff;
        border-color: #d8e2ed;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .shortcut-item kbd {
        background: #edf3f8;
        border-color: #c9d5e3;
        color: #25344a;
      }
      @media(max-width:960px) {
        #dayflow-app .shortcut-grid {
          grid-template-columns: 1fr;
        }
      }
      @media(max-width:800px),(hover:none),(pointer:coarse) {
        #dayflow-app .keyboard-guide {
          display: none!important;
        }
      }
      #dayflow-app #editTimersTop,#dayflow-app.dayflow-app[data-theme-mode="light"] #editTimersTop,#dayflow-app  #editTimersTop:hover,#dayflow-app.dayflow-app[data-theme-mode="light"] #editTimersTop:hover {
        color: #fff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .empty-timer-state {
        background: #ffffff!important;
        border-color: #d8e4f0;
        box-shadow: 0 6px 22px rgba(24,45,76,.045);
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .empty-timer-state {
        background: #252a34!important;
        border-color: #464e5c;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .shortcut-item {
        background: #252a34!important;
        border-color: #475264;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .shortcut-item kbd {
        background: #19212c!important;
        border-color: #526175;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .me-plan-line {
        background: #202734!important;
        border: 1px solid #303b4b;
        border-radius: 7px;
        padding: 7px 9px;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .me-plan-line:nth-child(2),#dayflow-app.dayflow-app[data-theme-mode="dark"] .me-plan-missed,#dayflow-app.dayflow-app[data-theme-mode="dark"] .me-plan-extra {
        border-top: 1px solid #303b4b;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .me-plan-summary .me-plan-line {
        border: 1px solid #ccd9e7;
        border-radius: 7px;
        padding: 7px 9px;
        background: #ffffff;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .timer-column > .panel,#dayflow-app.dayflow-app[data-theme-mode="dark"] .sidebar-column > .plan-stats-details.panel,#dayflow-app.dayflow-app[data-theme-mode="dark"] .sidebar-column > .mobile-settings-panel.panel {
        background: var(--custom-panel)!important;
        background-color: var(--custom-panel)!important;
      }
      #dayflow-app.dayflow-app .dayflow-copyright,#dayflow-app.dayflow-app .dayflow-copyright strong,#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-copyright,#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-copyright strong,#dayflow-app.dayflow-app[data-theme-mode="dark"] .dayflow-copyright,#dayflow-app.dayflow-app[data-theme-mode="dark"] .dayflow-copyright strong {
        color: var(--dayflow-footer-contrast,#ffffff)!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .me-plan-summary {
        background: color-mix(in srgb,var(--custom-panel) 90%,#869bb4 10%)!important;
        border: 1px solid color-mix(in srgb,var(--dayflow-neutral-border) 65%,#8797ad 35%)!important;
        border-radius: 13px;
        box-shadow: none;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .me-plan-summary .me-plan-line {
        background: #252a34!important;
        border: 1px solid #475264!important;
        border-radius: 8px;
        padding: 8px 10px;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .timer-total-row,#dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .me-plan-summary .me-plan-label,#dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .me-plan-summary .me-plan-value,#dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .me-plan-summary .me-plan-value * {
        color: #ffffff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .timer-total-row strong,#dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .me-plan-summary .me-plan-value {
        font-weight: 650!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .plan-stats-details .timer-total-row strong {
        color: #8cff78!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] #planRemaining {
        color: #8cff78!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] #planEnd {
        color: #edca86!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] #planMissed {
        color: #d3b1ff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] #planTransferred {
        color: #ff7d8a!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] #planFrozen {
        color: #8fdcff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .plan-stats-details .me-plan-summary {
        background: #f2f6fb!important;
        border: 1px solid #cbd8e6!important;
        border-radius: 13px;
        box-shadow: none;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .plan-stats-details .me-plan-summary .me-plan-line {
        background: #ffffff!important;
        border: 1px solid #d8e2ed!important;
        border-radius: 8px;
        padding: 8px 10px;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .plan-stats-details .timer-total-row strong,#dayflow-app.dayflow-app[data-theme-mode="light"] .plan-stats-details .me-plan-summary .me-plan-value {
        font-weight: 650!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .theme-editor,#dayflow-app.dayflow-app[data-theme-mode="dark"] .theme-color-item {
        border-color: #475264!important;
      }
      #dayflow-app.dayflow-app {
        --custom-panel-border: #1b1b1d;
        --dayflow-neutral-border: #2b323b;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] {
        --dayflow-neutral-border: #2b445e;
      }
      #dayflow-app .theme-color-grid {
        grid-template-columns: minmax(0,1fr)!important;
      }
      #dayflow-app.dayflow-app .timer-column > section.panel,#dayflow-app.dayflow-app .sidebar-column > .plan-stats-details.panel,#dayflow-app.dayflow-app .sidebar-column > .mobile-settings-panel.panel {
        border: 1px solid var(--custom-panel-border)!important;
      }
      #dayflow-app.dayflow-app button:not(.theme-mode-button):not(.volume-step):not(.volume-mute),#dayflow-app.dayflow-app button:not(.theme-mode-button):not(.volume-step):not(.volume-mute):hover,#dayflow-app.dayflow-app .toolbar button,#dayflow-app.dayflow-app .toolbar button:hover:not(:disabled),#dayflow-app.dayflow-app .settings-head .timer-action,#dayflow-app.dayflow-app .settings-head .timer-action:hover:not(:disabled),#dayflow-app.dayflow-app .toolbar :is(#play,#previous,#next,#freezeUp,#stop,#reset,#editAllTimers,#addStickyTimer,#dayflowAiDock),#dayflow-app.dayflow-app .toolbar :is(#play,#previous,#next,#freezeUp,#stop,#reset,#editAllTimers,#addStickyTimer,#dayflowAiDock):hover:not(:disabled) {
        border-color: var(--custom-button-border)!important;
      }
      #dayflow-app.dayflow-app .volume-console .volume-step,#dayflow-app.dayflow-app .volume-console .volume-step:hover {
        border-color: #35644b!important;
      }
      #dayflow-app.dayflow-app .volume-console .volume-step:hover {
        border-color: #6cff7d!important;
      }
      #dayflow-app.dayflow-app .volume-console .volume-mute,#dayflow-app.dayflow-app .volume-console .volume-mute:hover {
        border-color: #596571!important;
      }
      #dayflow-app.dayflow-app .volume-console .volume-mute.is-muted,#dayflow-app.dayflow-app .volume-console .volume-mute.is-muted:hover {
        border-color: #ff7482!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .volume-console .volume-step {
        border-color: #a0c3ad!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .volume-console .volume-mute:not(.is-muted) {
        border-color: #becbd8!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .theme-editor {
        border-color: color-mix(in srgb,var(--dayflow-neutral-border) 65%,#8797ad 35%)!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .theme-color-item {
        border-color: #475264!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-editor {
        border-color: #cbd8e6!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .theme-color-item {
        border-color: #d8e2ed!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="dark"] .theme-editor summary::after {
        color: #a6aeba!important;
      }
      #dayflow-app .volume-console .volume-step {
        display: grid!important;
        place-items: center!important;
        padding: 0!important;
        line-height: 1!important;
        font-variant-numeric: normal;
      }
      @media(max-width:380px) {
      }
      #dayflow-app .timer-edit-actions #editTimersTop {
        order: 0;
      }
      #dayflow-app .timer-edit-actions #add {
        order: 1;
      }
      #dayflow-app #editTimersTop:not([hidden]) {
        display: inline-flex!important;
        align-items: center;
        justify-content: center;
      }
      #dayflow-app #editTimersTop:hover:not(:disabled) {
        background: color-mix(in srgb,var(--custom-button) 77%,white 23%)!important;
        border-color: var(--custom-button-border)!important;
        filter: brightness(1.08);
      }
      @media(max-width:650px) {
      }
      #dayflow-app .volume-console button.volume-step {
        display: flex!important;
        align-items: center!important;
        justify-content: center!important;
        padding: 0!important;
        line-height: 0!important;
      }
      #dayflow-app .volume-console button.volume-step .volume-step-icon {
        display: block!important;
        width: 18px;
        height: 18px;
        flex: 0 0 18px;
        margin: 0!important;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      @media(max-width:650px) {
      }
      #dayflow-app #nameDialog {
        box-sizing: border-box;
        max-width: min(440px,calc(100vw - 34px));
        border: 1px solid #435b79!important;
        outline: 1px solid #435b79;
        outline-offset: -1px;
        border-radius: 14px;
      }
      #dayflow-app #nameDialog #nameForm {
        box-sizing: border-box;
        min-width: 0;
        width: 100%;
      }
      #dayflow-app #nameDialog #nameForm .field,#dayflow-app #nameDialog #nameInput {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #nameDialog {
        border-color: #ccd9e8!important;
        outline-color: #ccd9e8;
      }
      #dayflow-app .settings-head .timer-actions .timer-action {
        border-width: 1px!important;
        border-style: solid!important;
        box-shadow: none;
        transition: background-color .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease;
      }
      #dayflow-app .settings-head .timer-actions .delete-action {
        background: #4b1823!important;
        border-color: #8d3849!important;
        color: #fff!important;
      }
      #dayflow-app .settings-head .timer-actions .delete-action:hover:not(:disabled) {
        background: #d71f36!important;
        border-color: #ff6478!important;
        color: #fff!important;
        box-shadow: 0 0 10px #e3293b88!important;
      }
      #dayflow-app .settings-head .timer-actions .edit-action {
        background: #182b43!important;
        border-color: #285386!important;
        color: #dcecff!important;
      }
      #dayflow-app .settings-head .timer-actions .edit-action:hover:not(:disabled) {
        background: #217bd6!important;
        border-color: #70bdff!important;
        color: #fff!important;
        box-shadow: 0 0 10px rgba(36,137,244,.62)!important;
      }
      #dayflow-app .settings-head .timer-actions .complete-action {
        background: #174d2a!important;
        border-color: #3b9b57!important;
        color: #d9ffcf!important;
      }
      #dayflow-app .settings-head .timer-actions .complete-action:hover:not(:disabled) {
        background: #22d94c!important;
        border-color: #abffb3!important;
        color: #fff!important;
        box-shadow: 0 0 10px rgba(53,255,89,.65)!important;
      }
      #dayflow-app .settings-head .timer-actions .complete-action:disabled {
        opacity: .5;
        cursor: default;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-actions .delete-action {
        background: #fae8ec!important;
        border-color: #e6b7c2!important;
        color: #992f43!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-actions .edit-action {
        background: #e9f1fc!important;
        border-color: #acc7ea!important;
        color: #22548b!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-actions .complete-action {
        background: #e1f8e5!important;
        border-color: #64c86d!important;
        color: #17662b!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .settings-head .timer-actions :is(.delete-action,.edit-action,.complete-action):hover:not(:disabled) {
        color: #fff!important;
      }
      #dayflow-app .timer-panel-head h2,#dayflow-app
.sidebar-column .plan-stats-toggle,#dayflow-app
.sidebar-column .mobile-settings-heading {
        font-family: inherit!important;
        font-size: 19px!important;
        font-weight: 700!important;
      }
      #dayflow-app .timer-panel-head h2 .section-title-text,#dayflow-app
.sidebar-column .plan-stats-toggle .section-title-text,#dayflow-app
.sidebar-column .mobile-settings-heading .section-title-text {
        font-family: inherit!important;
        font-size: 19px!important;
        font-weight: 700!important;
        letter-spacing: normal;
      }
      #dayflow-app .dayflow-language-setting {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        border: 1px solid #475264;
        border-radius: 8px;
        padding: 9px;
        margin: 0 0 17px;
        background: color-mix(in srgb,var(--custom-panel) 84%,#75879e 16%);
      }
      #dayflow-app .dayflow-language-label {
        font-size: 13px;
        font-weight: 700;
        color: var(--custom-text);
      }
      #dayflow-app #dayflowLanguage {
        width: 130px;
        max-width: 55%;
        padding: 8px 10px;
        border: 1px solid #475264;
        border-radius: 8px;
        background: #252a34;
        color: #fff;
        font: inherit;
        cursor: pointer;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-language-setting {
        background: #fff;
        border-color: #d8e2ed;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #dayflowLanguage {
        background: #fff;
        color: #1d2b40;
        border-color: #d8e2ed;
      }
      #dayflow-app #dayflowLanguage[hidden] {
        display: none!important;
      }
      #dayflow-app .dayflow-language-dropdown {
        position: relative;
        width: 145px;
        max-width: 55%;
        flex: none;
      }
      #dayflow-app .dayflow-language-trigger {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 7px;
        justify-content: flex-start;
        min-height: 38px;
        padding: 8px 9px!important;
        border: 1px solid #475264!important;
        border-radius: 8px;
        background: #252a34!important;
        color: #fff!important;
        font-size: 13px;
        font-weight: 650;
        cursor: pointer;
      }
      #dayflow-app .dayflow-language-trigger .dayflow-language-chevron {
        margin-left: auto;
        width: 14px;
        height: 14px;
        flex: none;
        transition: transform .16s;
      }
      #dayflow-app .dayflow-language-dropdown[data-open="true"] .dayflow-language-chevron {
        transform: rotate(180deg);
      }
      #dayflow-app .dayflow-language-options {
        position: absolute;
        z-index: 1200;
        top: calc(100% + 5px);
        left: 0;
        right: 0;
        padding: 4px;
        border: 1px solid #475264;
        border-radius: 8px;
        background: #252a34;
        box-shadow: 0 8px 20px rgba(0,0,0,.32);
      }
      #dayflow-app .dayflow-language-options[hidden] {
        display: none!important;
      }
      #dayflow-app .dayflow-language-option {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 7px;
        text-align: left;
        min-height: 35px;
        padding: 7px!important;
        border: 0!important;
        border-radius: 5px;
        background: transparent!important;
        color: #fff!important;
        font: inherit;
        font-size: 13px;
        cursor: pointer;
      }
      #dayflow-app .dayflow-language-option:hover,#dayflow-app .dayflow-language-option[aria-selected="true"] {
        background: #40516b!important;
      }
      #dayflow-app .dayflow-flag-wrap {
        position: relative;
        display: inline-grid;
        place-items: center;
        width: 25px;
        height: 17px;
        flex: 0 0 25px;
        overflow: hidden;
        border-radius: 2px;
        background: #465366;
      }
      #dayflow-app .dayflow-flag-wrap img {
        display: block;
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 1;
      }
      #dayflow-app .dayflow-flag-fallback {
        font-size: 10px;
        line-height: 1;
        color: #fff;
        font-weight: 800;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-language-trigger,#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-language-options {
        background: #fff!important;
        color: #1d2b40!important;
        border-color: #d8e2ed!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-language-option {
        color: #1d2b40!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-language-option:hover,#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-language-option[aria-selected="true"] {
        background: #e8f0fa!important;
      }
      #dayflow-app.dayflow-app dialog,#dayflow-app.dayflow-app[data-theme-mode="light"] dialog,#dayflow-app.dayflow-app[data-theme-mode="dark"] dialog,#dayflow-app.dayflow-app #nameDialog,#dayflow-app.dayflow-app #startTimeDialog,#dayflow-app.dayflow-app #resetDialog,#dayflow-app.dayflow-app #emptyTimerDialog,#dayflow-app.dayflow-app #timerEditDialog,#dayflow-app.dayflow-app[data-theme-mode="light"] #nameDialog,#dayflow-app.dayflow-app[data-theme-mode="light"] #startTimeDialog {
        border-color: var(--custom-panel-border)!important;
      }
      #dayflow-app.dayflow-app #nameDialog,#dayflow-app.dayflow-app[data-theme-mode="light"] #nameDialog {
        outline-color: var(--custom-panel-border)!important;
      }
      #dayflow-app #nameDialog #nameForm input:is(#nameInput,#taskMinutes,#pauseMinutes) {
        display: block;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
        border: 1px solid #4b5361!important;
        border-radius: 8px;
        background-clip: padding-box;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #nameDialog #nameForm input:is(#nameInput,#taskMinutes,#pauseMinutes) {
        border-color: #c7d3df!important;
      }
      #dayflow-app.dayflow-app button.dayflow-cancel-button,#dayflow-app.dayflow-app[data-theme-mode="light"] button.dayflow-cancel-button,#dayflow-app.dayflow-app[data-theme-mode="dark"] button.dayflow-cancel-button {
        background: #c51e32!important;
        border-color: #e96c7b!important;
        color: #fff!important;
      }
      #dayflow-app.dayflow-app button.dayflow-cancel-button:hover:not(:disabled),#dayflow-app.dayflow-app[data-theme-mode="light"] button.dayflow-cancel-button:hover:not(:disabled),#dayflow-app.dayflow-app[data-theme-mode="dark"] button.dayflow-cancel-button:hover:not(:disabled) {
        background: #ed2a40!important;
        border-color: #ff9aaa!important;
        color: #fff!important;
      }
      #dayflow-app.dayflow-app #resetDialog,#dayflow-app.dayflow-app[data-theme-mode="light"] #resetDialog,#dayflow-app.dayflow-app[data-theme-mode="dark"] #resetDialog,#dayflow-app.dayflow-app #deleteTimerDialog,#dayflow-app.dayflow-app[data-theme-mode="light"] #deleteTimerDialog,#dayflow-app.dayflow-app[data-theme-mode="dark"] #deleteTimerDialog {
        border: 2px solid #d92a40!important;
      }
      #dayflow-app #deleteTimerDialog {
        position: fixed;
        overflow: visible;
      }
      #dayflow-app #deleteTimerDialog .dialog-actions {
        flex-wrap: wrap;
      }
      #dayflow-app #deleteTimerDialog .dialog-actions button {
        flex: 1;
        min-width: 125px;
      }
      #dayflow-app #closeDeleteTimerDialogTop {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        display: grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        background: #c51e32!important;
        border: 2px solid #2b323b!important;
        color: #fff!important;
        box-shadow: 0 2px 10px rgba(0,0,0,.4);
        cursor: pointer;
      }
      #dayflow-app #closeDeleteTimerDialogTop:hover {
        background: #ed2a40!important;
      }
      #dayflow-app #closeDeleteTimerDialogTop svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
      }
      #dayflow-app.dayflow-app #completeTimerDialog,#dayflow-app.dayflow-app[data-theme-mode="light"] #completeTimerDialog,#dayflow-app.dayflow-app[data-theme-mode="dark"] #completeTimerDialog {
        border: 2px solid #d92a40!important;
      }
      #dayflow-app #completeTimerDialog {
        position: fixed;
        overflow: visible;
      }
      #dayflow-app #completeTimerDialog .dialog-actions {
        flex-wrap: wrap;
      }
      #dayflow-app #completeTimerDialog .dialog-actions button {
        flex: 1;
        min-width: 125px;
      }
      #dayflow-app #closeCompleteTimerDialogTop {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        display: grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        background: #c51e32!important;
        border: 2px solid #2b323b!important;
        color: #fff!important;
        box-shadow: 0 2px 10px rgba(0,0,0,.4);
        cursor: pointer;
      }
      #dayflow-app #closeCompleteTimerDialogTop:hover {
        background: #ed2a40!important;
      }
      #dayflow-app #closeCompleteTimerDialogTop svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
      }
      #dayflow-app .settings-head .timer-title-group.timer-actions {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex: 1 1 auto;
        min-width: 0;
        gap: 7px;
      }
      #dayflow-app .settings-head .timer-title-group .settings-title-fixed {
        flex: 0 1 auto;
        min-width: 0;
        overflow-wrap: anywhere;
      }
      #dayflow-app .settings-head > .timer-actions:not(.timer-title-group) {
        flex: 0 0 auto;
      }
      #dayflow-app .timer-edit-intro {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        flex-wrap: wrap;
        margin: 9px 0 2px;
      }
      #dayflow-app .timer-edit-intro .help {
        flex: 1 1 280px;
        margin: 0;
      }
      #dayflow-app.dayflow-app #deleteAllTimersButton,#dayflow-app.dayflow-app[data-theme-mode="light"] #deleteAllTimersButton,#dayflow-app.dayflow-app[data-theme-mode="dark"] #deleteAllTimersButton {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        flex: none;
        background: #c51e32!important;
        color: #fff!important;
        border: 1px solid #e96c7b!important;
        padding: 9px 12px;
        font-size: 13px;
        white-space: nowrap;
      }
      #dayflow-app.dayflow-app #deleteAllTimersButton:hover:not(:disabled) {
        background: #ed2a40!important;
        border-color: #ff9aaa!important;
      }
      #dayflow-app #deleteAllTimersButton svg {
        display: block;
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app.dayflow-app #deleteAllTimersDialog,#dayflow-app.dayflow-app[data-theme-mode="light"] #deleteAllTimersDialog,#dayflow-app.dayflow-app[data-theme-mode="dark"] #deleteAllTimersDialog {
        border: 2px solid #d92a40!important;
      }
      #dayflow-app #deleteAllTimersDialog {
        position: fixed;
        overflow: visible;
      }
      #dayflow-app #deleteAllTimersDialog .dialog-actions {
        flex-wrap: wrap;
      }
      #dayflow-app #deleteAllTimersDialog .dialog-actions button {
        flex: 1;
        min-width: 125px;
      }
      #dayflow-app #closeDeleteAllTimersDialogTop {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        display: grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        background: #c51e32!important;
        border: 2px solid #2b323b!important;
        color: #fff!important;
        box-shadow: 0 2px 10px rgba(0,0,0,.4);
        cursor: pointer;
      }
      #dayflow-app #closeDeleteAllTimersDialogTop:hover {
        background: #ed2a40!important;
      }
      #dayflow-app #closeDeleteAllTimersDialogTop svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
      }
      @media(max-width:800px) {
        #dayflow-app #editTimersTop,#dayflow-app  #editTimersTop:not([hidden]) {
          display: none!important;
        }
      }
      @media(max-width:800px) {
        #dayflow-app .timer-panel-head.has-timers {
          display: flex;
          align-items: center;
          justify-content: space-between;
          flex-wrap: nowrap;
          gap: 8px;
        }
        #dayflow-app .timer-panel-head.has-timers h2 {
          min-width: 0;
          flex: 0 1 auto;
        }
        #dayflow-app .timer-panel-head.has-timers .timer-edit-actions {
          display: flex;
          justify-content: flex-end;
          flex: 0 0 auto;
          width: auto;
          min-width: 0;
          gap: 0;
        }
        #dayflow-app .timer-panel-head.has-timers .timer-edit-actions #add {
          flex: 0 0 auto;
          min-height: 36px;
          padding: 8px 9px;
          font-size: 12px;
          white-space: nowrap;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-inline {
          gap: 7px;
          white-space: nowrap;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-iconbox {
          width: 34px;
          height: 34px;
          flex: 0 0 34px;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-iconbox svg {
          width: 21px;
          height: 21px;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-text {
          font-size: 17px;
        }
      }
      @media(max-width:370px) {
        #dayflow-app .timer-panel-head.has-timers {
          gap: 5px;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-inline {
          gap: 5px;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-iconbox {
          width: 30px;
          height: 30px;
          flex-basis: 30px;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-iconbox svg {
          width: 19px;
          height: 19px;
        }
        #dayflow-app .timer-panel-head.has-timers .section-title-text {
          font-size: 15px;
        }
        #dayflow-app .timer-panel-head.has-timers .timer-edit-actions #add {
          font-size: 11px;
          padding: 7px 7px;
        }
      }
      @media(max-width:650px) {
      }
      #dayflow-app .wrap {
        padding-bottom: 16px!important;
      }
      div#dayflow-app {
        padding-bottom: calc(20px + env(safe-area-inset-bottom,0px))!important;
      }
      div#dayflow-app.dayflow-demo-locked {
        overflow: hidden
      }
      div#dayflow-app.dayflow-preview-readonly {
        overflow-y: auto!important;
      }
      div#dayflow-app.dayflow-preview-readonly .timer {
        cursor: default;
      }
      div#dayflow-app.dayflow-preview-readonly :is(button,input,select,textarea,summary,.timer,[role="button"]) {
        cursor: not-allowed;
      }
      div#dayflow-app.dayflow-demo-locked>.wrap {
        filter: blur(10px) brightness(.55);
        pointer-events: none;
        user-select: none
      }
      #dayflow-app .dayflow-paywall[hidden] {
        display: none!important
      }
      #dayflow-app .dayflow-paywall {
        position: fixed;
        inset: 0;
        z-index: 5000;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 18px;
        overflow-y: auto;
        background: rgba(1,6,15,.57);
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px)
      }
      #dayflow-app .dayflow-paywall-card {
        box-sizing: border-box;
        width: min(800px,100%);
        max-height: calc(100dvh - 36px);
        overflow-y: auto;
        border: 1px solid #3c5068;
        border-radius: 22px;
        background: linear-gradient(145deg,#111b2b,#070c16 72%);
        box-shadow: 0 25px 100px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.07);
        color: #f2f7ff;
        padding: clamp(18px,4vw,34px);
        text-align: center
      }
      #dayflow-app .dayflow-paywall-brand {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 9px;
        margin: 0 0 15px
      }
      #dayflow-app .dayflow-paywall-logo {
        max-width: min(300px,80%);
        max-height: 86px;
        object-fit: contain
      }
      #dayflow-app .dayflow-paywall-logo[hidden],#dayflow-app .dayflow-paywall-wordmark[hidden] {
        display: none!important
      }
      #dayflow-app .dayflow-paywall-wordmark {
        font-size: clamp(33px,6vw,48px);
        font-weight: 900;
        letter-spacing: .06em;
        line-height: 1.05;
        color: #fff
      }
      #dayflow-app .dayflow-paywall-slogan {
        color: #a5c9e9;
        font-size: clamp(13px,2.5vw,16px);
        font-weight: 600;
        margin: 0
      }
      #dayflow-app .dayflow-paywall-flag {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        border: 1px solid #51719a;
        border-radius: 999px;
        padding: 6px 12px;
        margin: 2px 0 14px;
        background: #122943;
        color: #b9d8fa;
        font-size: 12px;
        font-weight: 800
      }
      #dayflow-app .dayflow-paywall-card h2 {
        font-size: clamp(21px,4vw,30px);
        line-height: 1.2;
        color: #fff;
        margin: 0 0 10px
      }
      #dayflow-app .dayflow-paywall-intro {
        color: #b5c5d8;
        font-size: 14px;
        line-height: 1.6;
        max-width: 570px;
        margin: 0 auto 22px
      }
      #dayflow-app .dayflow-plans {
        display: grid;
        grid-template-columns: repeat(3,minmax(0,1fr));
        gap: 12px;
        text-align: left
      }
      #dayflow-app .dayflow-plan {
        display: flex;
        flex-direction: column;
        gap: 10px;
        min-width: 0;
        padding: 18px 14px;
        border: 1px solid #35506f;
        border-radius: 16px;
        background: #101d2c;
        box-shadow: inset 0 1px rgba(255,255,255,.03)
      }
      #dayflow-app .dayflow-plan.featured {
        border-color: #63b8ff;
        background: linear-gradient(150deg,#17385b,#102237);
        box-shadow: 0 0 18px rgba(50,136,218,.16)
      }
      #dayflow-app .dayflow-plan-name {
        color: #b4c9df;
        font-size: 14px;
        font-weight: 750
      }
      #dayflow-app .dayflow-plan-price {
        font-size: clamp(23px,3vw,30px);
        line-height: 1.1;
        font-weight: 900;
        color: #fff;
        white-space: nowrap
      }
      #dayflow-app .dayflow-plan-unit {
        font-size: 12px;
        color: #a7bdcf;
        min-height: 18px
      }
      #dayflow-app .dayflow-plan-offer {
        font-size: 12px;
        line-height: 1.5;
        color: #8ee9ac;
        min-height: 35px;
        font-weight: 750
      }
      #dayflow-app .dayflow-paywall .dayflow-plan a {
        display: block;
        box-sizing: border-box;
        text-align: center;
        margin-top: auto;
        padding: 12px 8px;
        border-radius: 10px;
        background: #2874c8;
        color: #fff!important;
        text-decoration: none;
        font-weight: 800;
        font-size: 13px;
        border: 1px solid #4d9dec
      }
      #dayflow-app .dayflow-paywall .dayflow-plan.featured a {
        background: #168955;
        border-color: #43c483
      }
      #dayflow-app .dayflow-paywall .dayflow-plan a:hover {
        filter: brightness(1.2)
      }
      #dayflow-app .dayflow-paywall .dayflow-plan a:focus-visible {
        outline: 3px solid #fff;
        outline-offset: 3px
      }
      #dayflow-app .dayflow-paywall-foot {
        color: #8fa4bd;
        font-size: 11px;
        line-height: 1.6;
        margin: 18px 0 0
      }
      @media(max-width:650px) {
        #dayflow-app .dayflow-paywall {
          align-items: safe center;
          padding: 10px
        }
        #dayflow-app .dayflow-paywall-card {
          max-height: calc(100dvh - 20px);
          padding: 19px 14px;
          border-radius: 17px
        }
        #dayflow-app .dayflow-plans {
          grid-template-columns: 1fr;
          gap: 9px
        }
        #dayflow-app .dayflow-plan {
          display: grid;
          grid-template-columns: minmax(0,1fr) auto;
          gap: 2px 10px;
          padding: 11px 12px
        }
        #dayflow-app .dayflow-plan-name {
          grid-column: 1
        }
        #dayflow-app .dayflow-plan-price {
          grid-column: 1
        }
        #dayflow-app .dayflow-plan-unit {
          grid-column: 1
        }
        #dayflow-app .dayflow-plan-offer {
          grid-column: 1;
          min-height: 0
        }
        #dayflow-app .dayflow-paywall .dayflow-plan a {
          grid-column: 2;
          grid-row: 1/span 4;
          align-self: center;
          min-width: 100px;
          margin: 0
        }
        #dayflow-app .dayflow-paywall-intro {
          font-size: 13px;
          margin-bottom: 13px
        }
        #dayflow-app .dayflow-paywall-brand {
          margin-bottom: 9px
        }
        #dayflow-app .dayflow-paywall-foot {
          margin-top: 12px
        }
      }
      #dayflow-app #dayflowAdminCountdown[hidden] {
        display: none!important
      }
      #dayflow-app #dayflowAdminCountdown {
        position: fixed;
        z-index: 4900;
        top: 12px;
        right: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 85px;
        padding: 9px 15px;
        border: 2px solid #ff5b6d;
        border-radius: 11px;
        background: #ad162b;
        color: #fff;
        font: 900 22px/1.15 system-ui,"Segoe UI",Arial,sans-serif;
        font-variant-numeric: tabular-nums;
        letter-spacing: .03em;
        box-shadow: 0 5px 18px rgba(0,0,0,.45)
      }
      div#dayflow-app.dayflow-demo-locked #dayflowAdminCountdown {
        z-index: 5100
      }
      #dayflow-app .dayflow-paywall-card {
        position: relative;
        overflow: visible;
        max-height: none;
        padding: 0;
        border-radius: 22px
      }
      #dayflow-app .dayflow-paywall-scroll {
        max-height: calc(100dvh - 36px);
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: clamp(18px,4vw,34px);
        border-radius: inherit
      }
      #dayflow-app #dayflowPaywallClose {
        position: absolute;
        z-index: 5;
        top: -18px;
        right: -18px;
        width: 42px;
        height: 42px;
        min-width: 42px;
        min-height: 42px;
        display: grid;
        place-items: center;
        padding: 0!important;
        border: 2px solid #2b323b!important;
        border-radius: 50%;
        background: #c51e32!important;
        color: #fff!important;
        box-shadow: 0 2px 12px rgba(0,0,0,.55),0 0 10px rgba(255,62,85,.30);
        cursor: pointer;
        touch-action: manipulation
      }
      #dayflow-app #dayflowPaywallClose:hover {
        background: #ed2a40!important;
        border-color: #2b323b!important
      }
      #dayflow-app #dayflowPaywallClose svg {
        display: block;
        width: 21px;
        height: 21px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round
      }
      @media(max-width:650px) {
        #dayflow-app .dayflow-paywall-card {
          max-height: none;
          padding: 0;
          border-radius: 17px
        }
        #dayflow-app .dayflow-paywall-scroll {
          max-height: calc(100dvh - 20px);
          padding: 19px 14px
        }
        #dayflow-app #dayflowPaywallClose {
          top: -9px;
          right: -9px
        }
      }
      #dayflow-app .dayflow-brand {
        justify-content: space-between!important;
        gap: 12px;
        flex-wrap: wrap;
      }
      #dayflow-app #dayflowLoginButton {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 41px;
        padding: 9px 15px!important;
        border-radius: 10px;
        background: #1f6fd1!important;
        border: 1px solid #587ca8!important;
        color: #fff!important;
        font-size: 13px;
        font-weight: 750;
        white-space: nowrap;
        cursor: pointer;
      }
      #dayflow-app #dayflowLoginButton:hover {
        background: #2c82ec!important;
      }
      #dayflow-app #dayflowLoginButton svg {
        width: 18px;
        height: 18px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app #dayflowLoginDialog {
        position: fixed;
        overflow: visible;
        max-width: min(420px,calc(100vw - 42px));
        width: 100%;
        border: 1px solid #3e5978!important;
        border-radius: 17px;
        padding: 25px;
        background: #121821;
        color: #fff;
        box-shadow: 0 20px 65px #0009;
      }
      #dayflow-app #dayflowLoginDialog::backdrop {
        background: rgba(0,0,0,.69);
        backdrop-filter: blur(6px);
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-heading {
        text-align: center;
        margin: 3px 0 18px;
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-logo {
        display: block;
        max-width: 220px;
        max-height: 72px;
        margin: 0 auto 9px;
        object-fit: contain;
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-wordmark {
        display: block;
        font-size: 29px;
        font-weight: 900;
        letter-spacing: .045em;
        color: #fff;
      }
      #dayflow-app #dayflowLoginDialog h2 {
        color: #fff!important;
        font-size: 19px;
        margin: 12px 0 5px;
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-subtitle {
        font-size: 12px;
        color: #b4c0d0;
        line-height: 1.5;
      }
      #dayflow-app #dayflowLoginDialog form {
        display: grid;
        gap: 12px;
      }
      #dayflow-app #dayflowLoginDialog label {
        display: grid;
        gap: 6px;
        font-size: 13px;
        color: #eef3fb!important;
      }
      #dayflow-app #dayflowLoginDialog input {
        min-height: 45px;
        width: 100%;
        background: #080d15!important;
        color: #fff!important;
        border: 1px solid #53647b!important;
        border-radius: 9px;
        color-scheme: dark;
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-submit {
        min-height: 44px;
        background: #1f6fd1!important;
        color: #fff!important;
        border: 1px solid #4e95ee!important;
        margin-top: 3px;
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-status {
        font-size: 12px;
        line-height: 1.5;
        text-align: center;
        color: #ddc68c;
        min-height: 18px;
        margin: 0;
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-links {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 8px 15px;
        font-size: 12px;
      }
      #dayflow-app #dayflowLoginDialog .dayflow-login-links a {
        color: #94c8ff;
        text-decoration: underline;
      }
      #dayflow-app #dayflowLoginClose {
        position: absolute;
        top: -15px;
        right: -15px;
        width: 38px;
        height: 38px;
        min-width: 38px;
        min-height: 38px;
        padding: 0;
        display: grid;
        place-items: center;
        border: 2px solid #2b323b!important;
        border-radius: 50%;
        background: #c51e32!important;
        color: #fff!important;
        cursor: pointer;
      }
      #dayflow-app #dayflowLoginClose:hover {
        background: #ed2a40!important;
      }
      #dayflow-app #dayflowLoginClose svg {
        width: 18px;
        height: 18px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
      }
      @media(max-width:480px) {
        #dayflow-app #dayflowLoginButton {
          padding: 8px 11px!important;
          font-size: 12px;
        }
        #dayflow-app .dayflow-brand {
          align-items: center!important;
        }
      }
      #dayflow-app.dayflow-app .sidebar-column > .dayflow-planning-panel.panel {
        margin: 0;
        background: var(--custom-panel)!important;
        border: 1px solid var(--custom-panel-border)!important;
        border-radius: 15px;
        min-width: 0;
        padding: 15px 18px;
      }
      #dayflow-app .dayflow-planning-panel > summary {
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        cursor: default;
        color: var(--custom-text);
        font-size: 19px;
        font-weight: 700;
      }
      #dayflow-app .dayflow-planning-panel > summary::-webkit-details-marker {
        display: none
      }
      #dayflow-app .dayflow-planning-panel .section-title-text {
        font-size: 19px;
        font-weight: 700
      }
      #dayflow-app .dayflow-planning-panel .plan-stats-chevron {
        display: none
      }
      #dayflow-app .dayflow-planning-content {
        padding-top: 15px
      }
      #dayflow-app .dayflow-planning-overview {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 9px;
        font-size: 12px;
        color: var(--muted);
        font-weight: 650
      }
      #dayflow-app .dayflow-planning-overview strong {
        color: var(--custom-text);
        font-variant-numeric: tabular-nums
      }
      #dayflow-app .dayflow-planning-track {
        height: 16px;
        background: #10151f;
        border: 1px solid #222c3a;
        border-radius: 99px;
        overflow: hidden;
        margin-bottom: 13px
      }
      #dayflow-app .dayflow-planning-fill {
        height: 100%;
        width: 0;
        background: linear-gradient(90deg,var(--planning-gradient-start,#003ffc) 0%,var(--planning-gradient-end,#01f2ed) 100%)!important;
        border-radius: 99px;
        transition: width .2s ease
      }
      #dayflow-app .dayflow-planning-list {
        display: grid;
        gap: 7px
      }
      #dayflow-app .dayflow-planning-row {
        display: flex;
        align-items: center;
        gap: 10px;
        min-width: 0;
        padding: 10px 11px;
        border: 1px solid #475264;
        border-radius: 8px;
        background: #252a34;
        cursor: pointer;
        font-size: 13px;
        font-weight: 600;
        color: #fff;
        line-height: 1.4
      }
      #dayflow-app .dayflow-planning-row span {
        min-width: 0;
        overflow-wrap: anywhere;
        flex: 1
      }
      #dayflow-app .dayflow-planning-row.is-done .dayflow-planning-name {
        text-decoration: line-through;
        opacity: .65
      }
      #dayflow-app .dayflow-planning-row input[type=checkbox] {
        width: 18px;
        height: 18px;
        flex: 0 0 18px;
        margin: 0;
        accent-color: var(--accent);
        cursor: pointer
      }
      #dayflow-app .dayflow-planning-empty {
        padding: 8px 2px;
        margin: 0;
        font-size: 12px;
        color: var(--muted)
      }
      #dayflow-app .dayflow-planning-hint {
        margin: 10px 2px 0;
        font-size: 12px;
        line-height: 1.5;
        color: var(--muted);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-row {
        background: #fff;
        border-color: #d8e2ed;
        color: var(--custom-text)
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-row input[type=checkbox] {
        accent-color: #1e6ac8
      }
      @media(max-width:800px) {
        #dayflow-app.dayflow-app .sidebar-column>.dayflow-planning-panel.panel {
          padding: 0;
          overflow: hidden
        }
        #dayflow-app .dayflow-planning-panel>summary {
          min-height: 64px;
          padding: 13px 18px;
          cursor: pointer
        }
        #dayflow-app .dayflow-planning-panel .plan-stats-chevron {
          display: grid;
          place-items: center;
          flex: 0 0 38px;
          width: 38px;
          height: 38px;
          border-radius: 10px;
          background: #10253a;
          border: 1px solid #285078;
          color: #69b5ff
        }
        #dayflow-app .dayflow-planning-panel .plan-stats-chevron svg {
          width: 20px;
          height: 20px;
          fill: none;
          stroke: currentColor;
          stroke-width: 2.2;
          stroke-linecap: round;
          stroke-linejoin: round;
          transform: rotate(0);
          transition: transform .2s
        }
        #dayflow-app .dayflow-planning-panel[open] .plan-stats-chevron svg {
          transform: rotate(180deg)
        }
        #dayflow-app .dayflow-planning-content {
          padding: 0 13px 15px
        }
        #dayflow-app .dayflow-planning-panel:not([open]) .dayflow-planning-content {
          display: none
        }
        #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-panel .plan-stats-chevron {
          background: #eaf2fa;
          border-color: #c9d9ed;
          color: #326ba6
        }
      }
      #dayflow-app .dayflow-planning-row {
        flex-wrap: wrap;
        cursor: default;
      }
      #dayflow-app .dayflow-planning-row .dayflow-planning-name {
        flex: 1 1 110px;
        min-width: 0;
        cursor: pointer;
      }
      #dayflow-app .dayflow-planning-indicators {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex: 0 1 auto;
        gap: 7px;
        min-width: 0;
        margin-left: auto;
        flex-wrap: wrap;
      }
      #dayflow-app .dayflow-planning-time {
        font-size: 12px;
        font-weight: 800;
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
        color: var(--custom-text);
      }
      #dayflow-app .dayflow-planning-status {
        --planning-status-color: #aeb5c2;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 11px;
        font-weight: 750;
        color: var(--planning-status-color);
        border: 1px solid color-mix(in srgb,var(--planning-status-color) 50%,transparent);
        border-radius: 6px;
        padding: 3px 6px;
        background: color-mix(in srgb,var(--planning-status-color) 10%,transparent);
        white-space: nowrap;
      }
      #dayflow-app .dayflow-planning-status::before {
        content: "";
        display: inline-block;
        width: 6px;
        height: 6px;
        flex: none;
        border-radius: 50%;
        background: var(--planning-status-color);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-status[data-status="running"],#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-status[data-status="success"] {
        color: #17662b;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-status[data-status="frozen"] {
        color: #17618f;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-status[data-status="expired"] {
        color: #75429d;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-status[data-status="paused"],#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-status[data-status="skipped"] {
        color: #a4263b;
      }
      @media(max-width:410px) {
        #dayflow-app .dayflow-planning-indicators {
          width: 100%;
          justify-content: flex-start;
          padding-left: 28px;
          margin-left: 0;
        }
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 8px;
        min-width: 0;
        margin: 0;
        padding: 9px 10px;
        border-radius: 10px;
        cursor: default;
        font-size: 12px;
        isolation: isolate;
        transition: opacity .22s,border-color .22s,box-shadow .22s,transform .22s;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer>* {
        position: relative;
        z-index: 2;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-name {
        flex: 1 1 auto;
        min-width: 0;
        overflow-wrap: anywhere;
        cursor: pointer;
        line-height: 1.35;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-indicators {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex: 0 0 auto;
        gap: 6px;
        width: auto;
        min-width: 0;
        margin: 0;
        padding: 0;
        flex-wrap: nowrap;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-time {
        color: inherit;
        font-size: 11px;
        font-weight: 800;
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
        display: grid;
        place-items: center;
        flex: 0 0 22px;
        width: 22px;
        height: 22px;
        min-width: 22px;
        padding: 0;
        margin: 0;
        border: 1.5px solid currentColor;
        border-radius: 50%;
        background: rgba(0,0,0,.13);
        color: var(--planning-status-color,#aeb5c2);
        font-size: 13px;
        line-height: 1;
        white-space: nowrap;
        box-shadow: 0 0 6px color-mix(in srgb,var(--planning-status-color) 30%,transparent);
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status::before {
        display: none;
        content: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status svg {
        display: block;
        width: 13px;
        height: 13px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status[data-status="running"] svg {
        fill: currentColor;
        stroke: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status[data-status="paused"] svg {
        fill: currentColor;
        stroke: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status[data-status="waiting"] {
        opacity: .65;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer input[type="checkbox"] {
        position: relative;
        z-index: 3;
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        margin: 0;
        accent-color: var(--accent);
        cursor: pointer;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.is-done .dayflow-planning-name {
        text-decoration: line-through;
        opacity: .78;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:is(.active,.paused-status,.frozen,.skipped,.expired,.success) {
        color: #fff;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:not(.active):not(.paused-status):not(.frozen):not(.skipped):not(.expired):not(.success) {
        color: var(--custom-text);
        background: var(--custom-timer);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:is(.active,.paused-status,.frozen,.skipped,.expired,.success) .dayflow-planning-time {
        color: #fff;
      }
      @media(max-width:410px) {
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-indicators {
          width: auto;
          margin: 0;
          padding: 0;
          justify-content: flex-end;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer {
          gap: 6px;
          padding: 8px 7px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
          flex-basis: 19px;
          width: 19px;
          height: 19px;
          min-width: 19px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-time {
          font-size: 10px;
        }
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer {
        gap: 8px;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
        flex: 0 0 22px;
        order: 1;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer input[type="checkbox"] {
        order: 0;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-name {
        order: 2;
        cursor: default;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-indicators {
        order: 3;
        margin-left: auto;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-rename {
        order: 4;
        flex: 0 0 29px;
        width: 29px;
        height: 29px;
        min-width: 29px;
        padding: 0!important;
        display: grid;
        place-items: center;
        border-radius: 7px;
        background: var(--custom-button)!important;
        border: 1px solid var(--custom-button-border)!important;
        color: #fff!important;
        cursor: pointer;
        position: relative;
        z-index: 4;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-rename svg {
        width: 16px;
        height: 16px;
        display: block;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-rename:hover {
        filter: brightness(1.2);
      }
      @media(max-width:410px) {
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer {
          gap: 5px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
          flex-basis: 19px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-rename {
          flex-basis: 26px;
          width: 26px;
          min-width: 26px;
          height: 26px;
        }
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer {
        gap: 7px;
        flex-wrap: nowrap;
        min-width: 0;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
        order: 0;
        flex-shrink: 0;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-name {
        order: 1;
        flex: 1 1 auto;
        min-width: 0;
        cursor: default;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-indicators {
        order: 2;
        flex: 0 0 auto;
        margin-left: auto;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions {
        order: 3;
        display: inline-flex;
        align-items: center;
        gap: 3px;
        flex: 0 0 auto;
        position: relative;
        z-index: 4;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .timer-action {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 29px;
        height: 29px;
        min-width: 29px;
        flex: 0 0 29px;
        padding: 0!important;
        border-radius: 7px;
        border: 1px solid;
        cursor: pointer;
        line-height: 1;
        transition: background .16s,border-color .16s,box-shadow .16s;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .timer-action svg {
        display: block;
        width: 16px;
        height: 16px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .edit-action {
        background: #182b43!important;
        border-color: #285386!important;
        color: #dcecff!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .edit-action:hover:not(:disabled) {
        background: #217bd6!important;
        border-color: #70bdff!important;
        color: #fff!important;
        box-shadow: 0 0 10px rgba(36,137,244,.62)!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .delete-action {
        background: #4b1823!important;
        border-color: #8d3849!important;
        color: #fff!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .delete-action:hover:not(:disabled) {
        background: #d71f36!important;
        border-color: #ff6478!important;
        box-shadow: 0 0 10px #e3293b88!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .complete-action {
        background: #174d2a!important;
        border-color: #3b9b57!important;
        color: #d9ffcf!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .complete-action:hover:not(:disabled) {
        background: #22d94c!important;
        border-color: #abffb3!important;
        color: #fff!important;
        box-shadow: 0 0 10px rgba(53,255,89,.65)!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .complete-action:disabled {
        opacity: .5;
        cursor: default;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-actions .edit-action {
        background: #e9f1fc!important;
        border-color: #acc7ea!important;
        color: #22548b!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-actions .delete-action {
        background: #fae8ec!important;
        border-color: #e6b7c2!important;
        color: #992f43!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-actions .complete-action {
        background: #e1f8e5!important;
        border-color: #64c86d!important;
        color: #17662b!important;
      }
      @media(max-width:430px) {
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer {
          gap: 4px;
          padding: 8px 6px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions {
          gap: 2px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .timer-action {
          width: 25px;
          height: 25px;
          min-width: 25px;
          flex-basis: 25px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-actions .timer-action svg {
          width: 14px;
          height: 14px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-time {
          font-size: 10px;
        }
      }
      #dayflow-app.dayflow-app {
        --planning-gradient-start: #003ffc;
        --planning-gradient-end: #01f2ed;
      }
      #dayflow-app.dayflow-app .dayflow-planning-track {
        background: #0e1420!important;
        border: 1px solid #263144!important;
        box-shadow: inset 0 1px 4px rgba(0,0,0,.6);
      }
      #dayflow-app.dayflow-app .dayflow-planning-fill {
        background: linear-gradient(90deg,var(--planning-gradient-start),var(--planning-gradient-end))!important;
        box-shadow: 0 0 8px color-mix(in srgb,var(--planning-gradient-end) 32%,transparent);
      }
      #dayflow-app .theme-gradient-pickers {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        flex: none;
      }
      #dayflow-app .theme-progress-colors {
        min-width: 0;
      }
      #dayflow-app .theme-progress-colors > span {
        font-weight: 700;
      }
      #dayflow-app .theme-progress-colors .theme-gradient-pickers input[type=color] {
        flex: none;
        width: 43px;
        height: 34px;
        min-width: 43px;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.is-done .dayflow-planning-name {
        text-decoration-line: line-through;
        text-decoration-color: #ffffff;
        text-decoration-thickness: 2px;
        text-decoration-skip-ink: none;
        opacity: 1;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:not(.active):not(.paused-status):not(.frozen):not(.skipped):not(.expired):not(.success) {
        background: #fff!important;
        color: #1e2d43!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:not(.active):not(.paused-status):not(.frozen):not(.skipped):not(.expired):not(.success) .dayflow-planning-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:not(.active):not(.paused-status):not(.frozen):not(.skipped):not(.expired):not(.success) .dayflow-planning-time {
        color: #1e2d43!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:is(.active,.paused-status,.frozen,.skipped,.expired,.success) .dayflow-planning-name,#dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:is(.active,.paused-status,.frozen,.skipped,.expired,.success) .dayflow-planning-time {
        color: #fff!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
        order: 0;
        display: grid;
        place-items: center;
        flex: 0 0 22px;
        width: 22px;
        height: 22px;
        min-width: 22px;
        margin: 0;
        padding: 0;
        border-width: 1.5px;
        border-style: solid;
        border-radius: 50%;
        font-size: 13px;
        font-weight: 900;
        line-height: 1;
        white-space: nowrap;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status.success-badge {
        color: #d9ffcf;
        border-color: rgba(156,255,131,.95);
        background: radial-gradient(circle at 35% 30%,rgba(236,255,232,.3),rgba(87,232,95,.22) 45%,rgba(35,132,47,.3) 80%);
        box-shadow: 0 0 7px var(--successGlow),inset 0 0 6px rgba(235,255,238,.22);
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status.play-badge {
        border-color: #91ff82;
        color: #caffbf;
        background: radial-gradient(circle at 35% 30%,rgba(232,255,226,.28),rgba(83,225,92,.22) 50%,rgba(29,105,42,.30));
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status.pause-badge {
        border-color: #ff6565;
        color: #ffcece;
        background: radial-gradient(circle at 35% 30%,rgba(255,226,226,.26),rgba(231,47,58,.20) 50%,rgba(116,18,29,.35));
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status.frozen-badge {
        border-color: #a6e7ff;
        color: #e6faff;
        background: radial-gradient(circle at 35% 30%,rgba(244,254,255,.32),rgba(105,205,255,.26) 50%,rgba(35,114,168,.32));
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status.skipped-badge {
        border-color: #ff7780;
        color: #ffdadb;
        background: radial-gradient(circle at 35% 30%,rgba(255,209,210,.25),rgba(231,65,77,.20) 50%,rgba(120,23,32,.32));
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status.expired-badge {
        border-color: #bc93ff;
        color: #ebdcff;
        background: radial-gradient(circle at 35% 30%,rgba(239,225,255,.28),rgba(155,94,230,.23) 50%,rgba(82,38,140,.35));
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status svg {
        width: 13px;
        height: 13px;
        display: block;
        flex: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status:is(.play-badge,.pause-badge) svg {
        fill: currentColor;
        stroke: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status.expired-badge svg {
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status[data-status="waiting"] {
        border-color: #aeb5c2;
        opacity: .65;
        background: rgba(0,0,0,.13);
        color: #aeb5c2;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status[data-status="waiting"] svg {
        width: 19px;
        height: 19px;
        stroke-width: 2.4;
      }
      @media(max-width:410px) {
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
          flex-basis: 19px;
          width: 19px;
          height: 19px;
          min-width: 19px;
          font-size: 12px;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status svg {
          width: 12px;
          height: 12px;
        }
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
        position: relative;
        display: grid;
        place-items: center;
        justify-items: center;
        align-items: center;
        text-align: center;
        vertical-align: middle;
        line-height: 0;
        overflow: visible;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status svg {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        display: block;
        margin: 0;
        padding: 0;
        flex: none;
        overflow: visible;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status:not(:has(svg)) {
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer:not(.active):not(.paused-status):not(.frozen):not(.skipped):not(.expired):not(.success) :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #1e2d43!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.active :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #dbffd5!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.paused-status :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #ffe0e3!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.frozen :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #e0f5ff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.skipped :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #ffe1e4!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.expired :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #f0e1ff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.success :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #e3ffda!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.success {
        background: linear-gradient(180deg,rgba(15,29,16,.96),rgba(9,18,10,.94) 72%)!important;
        border-color: rgba(157,255,131,.7)!important;
        box-shadow: 0 0 4px rgba(145,255,128,.30),0 0 9px rgba(118,255,104,.13),inset 0 0 5px rgba(118,255,104,.04)!important;
        opacity: .88;
        color: #fff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.expired {
        background: linear-gradient(180deg,rgba(32,17,48,.96),rgba(19,11,29,.96) 72%)!important;
        border-color: rgba(190,139,255,.88)!important;
        box-shadow: 0 0 4px rgba(186,123,255,.30),0 0 9px rgba(157,81,244,.14),inset 0 0 5px rgba(151,74,242,.05)!important;
        opacity: .9;
        color: #fff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.success :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #e3ffda!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.expired :is(.dayflow-planning-name,.dayflow-planning-time) {
        color: #f0e1ff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.active {
        background: linear-gradient(180deg,#0c1017 0%,#0a0d12 72%)!important;
        border-color: #78ff6c!important;
        box-shadow: 0 0 4px rgba(100,255,128,.26),0 0 9px rgba(83,255,134,.12),inset 0 0 5px rgba(100,255,128,.04)!important;
        color: #fff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.paused-status {
        background: linear-gradient(180deg,#0c1017 0%,#0a0d12 72%)!important;
        border-color: #ff0000!important;
        box-shadow: 0 0 4px rgba(255,45,55,.29),0 0 9px rgba(255,0,0,.13),inset 0 0 5px rgba(255,0,0,.04)!important;
        color: #fff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.skipped {
        background: linear-gradient(180deg,#250c11 0%,#14090c 72%)!important;
        border-color: rgba(255,98,108,.82)!important;
        box-shadow: 0 0 4px rgba(255,78,93,.29),0 0 9px rgba(255,49,75,.13),inset 0 0 5px rgba(255,70,90,.04)!important;
        color: #fff!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.success {
        background: linear-gradient(180deg,#0f1d10 0%,#09120a 72%)!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer.expired {
        background: linear-gradient(180deg,#201130 0%,#130b1d 72%)!important;
      }
      #dayflow-app .timer-right > .success-badge,#dayflow-app
.dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status {
        position: relative;
        display: grid;
        place-items: center;
        justify-items: center;
        align-items: center;
        padding: 0;
        text-align: center;
        line-height: 0;
      }
      #dayflow-app .timer-right > .success-badge .dayflow-badge-glyph,#dayflow-app
.dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status .dayflow-badge-glyph {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        display: block;
        width: max-content;
        height: auto;
        margin: 0;
        padding: 0;
        line-height: 1;
        text-align: center;
        pointer-events: none;
      }
      #dayflow-app .timer-right > .success-badge svg,#dayflow-app
.dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status svg {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        display: block;
        margin: 0;
        padding: 0;
        flex: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-grip {
        order: -1;
        display: grid;
        place-items: center;
        flex: 0 0 23px;
        width: 23px;
        height: 29px;
        padding: 0!important;
        margin: 0 1px 0 0;
        border: 0!important;
        border-radius: 5px;
        background: transparent!important;
        color: #9fb1c6!important;
        box-shadow: none!important;
        cursor: grab;
        touch-action: pan-y;
        user-select: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-grip svg {
        width: 17px;
        height: 20px;
        display: block;
        fill: currentColor;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-grip:active {
        cursor: grabbing;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-drag-source {
        opacity: .44;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-drag-above {
        box-shadow: 0 -3px 0 #39ff14!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-drag-below {
        box-shadow: 0 3px 0 #39ff14!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-grip {
        color: #54667e!important;
      }
      @media(max-width:430px) {
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-grip {
          flex-basis: 17px;
          width: 17px;
          margin: 0;
        }
        #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-grip svg {
          width: 14px;
        }
      }
      #dayflow-app .dayflow-planning-overview #dayflowPlanningCount {
        font-family: inherit;
        font-size: 13px;
        font-weight: 650;
        line-height: 1.5;
        color: var(--muted);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-overview #dayflowPlanningCount {
        color: #526174;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-grip[hidden] {
        display: none!important;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.dayflow-drag-locked {
        cursor: default;
      }
      #dayflow-app .timer-edit-dialog .dayflow-edit-confirm-row {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding-top: 13px;
        margin-top: 12px;
        border-top: none;
      }
      #dayflow-app .timer-edit-dialog #dayflowEditConfirm {
        min-width: 135px;
        min-height: 42px;
        padding: 10px 18px;
        background: var(--custom-button)!important;
        border: 1px solid var(--custom-button-border)!important;
        color: #fff!important;
        font-size: 13px;
        font-weight: 750;
      }
      #dayflow-app .timer-edit-dialog #dayflowEditConfirm:hover {
        background: color-mix(in srgb,var(--custom-button) 80%,white 20%)!important;
        border-color: var(--custom-button-border)!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .timer-edit-dialog .dayflow-edit-confirm-row {
        border-top-color: #dce4ed;
      }
      @media(min-width:801px) {
        #dayflow-app.dayflow-app .sidebar-column > .dayflow-planning-panel.panel {
          padding-bottom: 27px;
        }
      }
      @media(max-width:800px) {
        #dayflow-app .dayflow-planning-panel[open] > .dayflow-planning-content {
          padding-bottom: 27px;
        }
      }
      #dayflow-app .dayflow-planning-drag-help {
        margin: 13px 0 0;
        font-size: 12px;
        line-height: 1.55;
        color: var(--muted);
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] .dayflow-planning-drag-help {
        color: #526174;
      }
      #dayflow-app dialog:not([open]) {
        display: none!important;
        pointer-events: none!important;
        visibility: hidden!important;
      }
      /* 4.9.40 – Pausenpositionsmarker, individuell gefärbt; gestoppt rot. */
      #dayflow-app .dayflow-planning-list .dayflow-break-position {
        --dayflow-break-color: #40bfff;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        min-height: 28px;
        margin: 0;
        padding: 3px 10px;
        border: 1px solid color-mix(in srgb,var(--dayflow-break-color) 65%,transparent);
        border-radius: 8px;
        background: linear-gradient(90deg,color-mix(in srgb,var(--dayflow-break-color) 8%,transparent),color-mix(in srgb,var(--dayflow-break-color) 22%,transparent),color-mix(in srgb,var(--dayflow-break-color) 8%,transparent));
        color: var(--dayflow-break-color);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .025em;
        pointer-events: none;
        user-select: none;
        animation: dayflow5-dayflowBreakPulse 1.5s ease-in-out infinite;
      }
      #dayflow-app .dayflow-planning-list .dayflow-break-position::before,#dayflow-app .dayflow-planning-list .dayflow-break-position::after {
        content: "";
        height: 2px;
        flex: 1;
        min-width: 8px;
        border-radius: 3px;
        background: linear-gradient(90deg,transparent,var(--dayflow-break-color),transparent);
        box-shadow: 0 0 9px var(--dayflow-break-color);
      }
      #dayflow-app .dayflow-planning-list .dayflow-break-position .dayflow-break-dot {
        width: 7px;
        height: 7px;
        flex: none;
        border-radius: 50%;
        background: var(--dayflow-break-color);
        box-shadow: 0 0 9px var(--dayflow-break-color);
      }
      #dayflow-app .dayflow-planning-list .dayflow-break-position[data-paused="true"] {
        --dayflow-break-color: #ff414f!important;
      }
      /* Gleicher roter Impuls fuer laufende und pausierte Pause; die laufende Pause
   verwendet ausschliesslich die individuelle Kartenfarbe (--dayflow-break-color).
   Helle Impulsspitzen verbessern auch bei dunklem Blau die Sichtbarkeit. */
      @keyframes dayflow5-dayflowBreakPulse {
        0%,100% {
          opacity: .58;
          filter: brightness(1) saturate(1);
          box-shadow: 0 0 4px color-mix(in srgb,var(--dayflow-break-color) 19%,transparent);
        }
        50% {
          opacity: 1;
          filter: brightness(1.65) saturate(1.3);
          box-shadow: 0 0 14px color-mix(in srgb,var(--dayflow-break-color) 57%,transparent),
               inset 0 0 9px color-mix(in srgb,var(--dayflow-break-color) 14%,transparent);
        }
      }
      @media(prefers-reduced-motion:reduce) {
        #dayflow-app .dayflow-planning-list .dayflow-break-position {
          animation: none;
          opacity: 1
        }
      }
      /* DAYFLOW 4.9.46: Greiffläche auf der gesamten verschiebbaren Projektkarte. */
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-draggable {
        cursor: grab;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-draggable:active {
        cursor: grabbing;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-draggable .dayflow-planning-name,#dayflow-app
.dayflow-planning-list .dayflow-planning-row.timer.dayflow-draggable .dayflow-planning-time {
        user-select: none;
        -webkit-user-select: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-touch-source {
        opacity: .65;
      }
      /* Die gegriffene Karte erhält auf Desktop und Touch denselben neongrünen Rahmen. */
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer:is(.dayflow-touch-source,.dayflow-drag-source) {
        outline: 2px dashed #39ff14;
        outline-offset: 1px;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-draggable :is(button,input) {
        cursor: pointer;
      }
      /* DAYFLOW 4.9.48: Der Titel ist eine Greiffläche, kein eigenes Bedienelement.
   Hit-Tests landen direkt auf der verschiebbaren Aufgabenkarte. */
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-name {
        pointer-events: none;
      }
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer.dayflow-draggable .dayflow-planning-name {
        cursor: inherit;
        user-select: none;
        -webkit-user-select: none;
      }
      /* DAYFLOW 4.9.58: Wartende Aufgaben ohne Symbol und ohne reservierten Platz. */
      #dayflow-app .dayflow-planning-list .dayflow-planning-row.timer .dayflow-planning-status[data-status="waiting"] {
        display: none!important;
      }
      /* 4.9.60 – Startzeit im Planungs-Header; KI-Mikrofon am bisherigen Dock-Platz. */
      #dayflow-app .dayflow-planning-panel > .dayflow-planning-heading > .dayflow-start-time-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        flex: 0 0 auto;
        margin-left: auto;
        min-height: 40px;
        padding: 8px 12px;
        border-radius: 9px;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        cursor: pointer;
        background: var(--custom-button)!important;
        border: 1px solid var(--custom-button-border)!important;
        color: #fff!important;
        transition: background .16s,border-color .16s,filter .16s;
      }
      #dayflow-app .dayflow-planning-panel > .dayflow-planning-heading > .dayflow-start-time-button:hover:not(:disabled) {
        background: color-mix(in srgb,var(--custom-button) 77%,white 23%)!important;
        border-color: var(--custom-button-border)!important;
        filter: brightness(1.08);
      }
      #dayflow-app .dayflow-start-time-button svg {
        width: 17px;
        height: 17px;
        display: block;
        flex: 0 0 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      @media(max-width:520px) {
        #dayflow-app .dayflow-planning-panel > .dayflow-planning-heading > .dayflow-start-time-button {
          padding: 8px 9px;
          min-height: 36px;
          font-size: 11px;
          gap: 4px;
        }
        #dayflow-app .dayflow-start-time-button svg {
          width: 15px;
          height: 15px;
          flex-basis: 15px;
        }
      }
      /* DAYFLOW 4.9.61 – Einheitlicher oberer Lichtreflex im Sticky-Dock; Farben unverändert. */
      /* Das Mikrofon liegt über dem Schatten des direkt darüberliegenden Buttons. */
      /* DAYFLOW 4.9.63 – Sticky-Dock: bereinigt, einheitlicher Mikrofon-Look aus 4.9.61. */
      #dayflow-app.dayflow-app {
        --dayflow-dock-space: 185px;
      }
      #dayflow-app .toolbar {
        position: fixed;
        z-index: 1000;
        right: 12px;
        bottom: 12px;
        left: auto;
        display: grid;
        grid-template-columns: repeat(3,48px);
        grid-template-rows: repeat(3,48px);
        gap: 5px;
        width: max-content;
        max-width: calc(100vw - 18px);
        padding: 0;
        margin: 0;
        justify-items: stretch;
        align-items: stretch;
        background: transparent;
        border: 0;
        box-shadow: none;
        pointer-events: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
      }
      #dayflow-app.dayflow-app .toolbar button {
        --dock-solid: var(--custom-button);
        position: relative;
        isolation: isolate;
        z-index: 1;
        pointer-events: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        min-width: 0;
        min-height: 48px;
        margin: 0;
        padding: 0;
        border: 1px solid var(--custom-button-border)!important;
        border-radius: 12px;
        background-color: var(--dock-solid)!important;
        background-image: linear-gradient(180deg,rgba(255,255,255,.30) 0%,rgba(255,255,255,.10) 30%,rgba(255,255,255,0) 68%)!important;
        color: #fff!important;
        text-shadow: none;
        line-height: 0;
        font-size: 12px;
        box-shadow: inset 0 2px 1px rgba(255,255,255,.30),inset 0 -2px 1px rgba(0,0,0,.13),
             0 4px 0 rgba(7,12,20,.62),0 10px 19px rgba(0,0,0,.38)!important;
        cursor: pointer;
        touch-action: manipulation;
        transition: transform .17s ease,filter .17s ease,box-shadow .17s ease!important;
      }
      #dayflow-app.dayflow-app .toolbar button:hover:not(:disabled) {
        z-index: 2;
        transform: translateY(-2px)!important;
        filter: brightness(1.13)!important;
        box-shadow: inset 0 2px 1px rgba(255,255,255,.40),inset 0 -2px 1px rgba(0,0,0,.13),
             0 6px 0 rgba(7,12,20,.55),0 13px 23px rgba(0,0,0,.42)!important;
      }
      #dayflow-app.dayflow-app .toolbar button:active:not(:disabled) {
        transform: translateY(2px)!important;
        filter: brightness(1.03)!important;
        box-shadow: inset 0 2px 3px rgba(0,0,0,.15),inset 0 1px 1px rgba(255,255,255,.12),
             0 1px 0 rgba(7,12,20,.58),0 5px 9px rgba(0,0,0,.26)!important;
      }
      #dayflow-app.dayflow-app .toolbar #play:not([data-running="true"]) {
        --dock-solid: #23a24e;
      }
      #dayflow-app.dayflow-app .toolbar #play[data-running="true"] {
        --dock-solid: #d63a50;
      }
      #dayflow-app.dayflow-app .toolbar #previous,#dayflow-app.dayflow-app .toolbar #next {
        --dock-solid: #cf3e52;
      }
      #dayflow-app.dayflow-app .toolbar #freezeUp,#dayflow-app.dayflow-app .toolbar #stop {
        --dock-solid: #328abf;
      }
      #dayflow-app.dayflow-app .toolbar #reset {
        --dock-solid: #8154be;
      }
      #dayflow-app.dayflow-app .toolbar #editAllTimers,#dayflow-app.dayflow-app .toolbar #addStickyTimer,#dayflow-app.dayflow-app .toolbar #dayflowAiDock {
        --dock-solid: var(--custom-button);
      }
      #dayflow-app .toolbar #addStickyTimer {
        grid-column: 1;
        grid-row: 1;
      }
      #dayflow-app .toolbar #freezeUp {
        grid-column: 2;
        grid-row: 1;
      }
      #dayflow-app .toolbar #editAllTimers {
        grid-column: 3;
        grid-row: 1;
      }
      #dayflow-app .toolbar #previous {
        grid-column: 1;
        grid-row: 2;
      }
      #dayflow-app .toolbar #play {
        grid-column: 2;
        grid-row: 2;
      }
      #dayflow-app .toolbar #next {
        grid-column: 3;
        grid-row: 2;
      }
      #dayflow-app .toolbar #dayflowAiDock {
        grid-column: 1;
        grid-row: 3;
        z-index: 3;
      }
      #dayflow-app .toolbar #stop {
        grid-column: 2;
        grid-row: 3;
      }
      #dayflow-app .toolbar #reset {
        grid-column: 3;
        grid-row: 3;
      }
      #dayflow-app .toolbar .dock-label {
        display: none!important;
      }
      #dayflow-app .toolbar button::before,#dayflow-app .toolbar button::after {
        content: none!important;
        display: none!important;
      }
      #dayflow-app .toolbar button .dock-icon {
        display: block!important;
        width: 24px;
        height: 24px;
        flex: 0 0 24px;
        margin: 0;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app .toolbar #play .dock-icon-pause,#dayflow-app .toolbar #play[data-running="true"] .dock-icon-play {
        display: none!important;
      }
      #dayflow-app .toolbar #play[data-running="true"] .dock-icon-pause {
        display: block!important;
      }
      #dayflow-app .toolbar .dock-freeze-mark {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 34px;
        flex: 0 0 30px;
        gap: 0;
        margin: 0;
        padding: 0;
        line-height: 1;
        color: #fff;
        font-family: "Segoe UI Symbol","DejaVu Sans",Arial,sans-serif;
        font-weight: 700;
        text-align: center;
        pointer-events: none;
      }
      #dayflow-app .toolbar .dock-freeze-snow {
        display: block;
        font-size: 21px;
        line-height: 21px;
        height: 21px;
        white-space: nowrap;
      }
      #dayflow-app .toolbar .dock-freeze-arrow {
        display: block;
        font-size: 15px;
        line-height: 13px;
        height: 13px;
        white-space: nowrap;
      }
      @media(max-width:650px) {
        #dayflow-app.dayflow-app {
          --dayflow-dock-space: calc(3 * clamp(44px,12vw,49px) + 28px);
        }
        #dayflow-app .toolbar {
          --control-size: clamp(44px,12vw,49px);
          right: max(9px,env(safe-area-inset-right,0px));
          bottom: calc(12px + env(safe-area-inset-bottom,0px));
          grid-template-columns: repeat(3,var(--control-size));
          grid-template-rows: repeat(3,var(--control-size));
        }
        #dayflow-app.dayflow-app .toolbar button {
          width: var(--control-size);
          height: var(--control-size);
          min-height: var(--control-size);
          border-radius: 50%;
        }
        #dayflow-app .toolbar .dock-freeze-mark {
          height: 30px;
        }
        #dayflow-app .toolbar .dock-freeze-snow {
          font-size: 19px;
          line-height: 19px;
          height: 19px;
        }
        #dayflow-app .toolbar .dock-freeze-arrow {
          font-size: 13px;
          line-height: 11px;
          height: 11px;
        }
      }
      /* DAYFLOW 4.9.64 – Sprachplanung: isoliertes Dialogdesign. */
      #dayflow-app #dayflowVoiceDialog {
        position: fixed;
        overflow: visible;
        width: min(510px,calc(100vw - 38px));
        max-width: min(510px,calc(100vw - 38px));
        padding: 0;
        border: 1px solid var(--custom-panel-border)!important;
        border-radius: 18px;
        background: #121821;
        color: #fff;
        box-shadow: 0 22px 70px rgba(0,0,0,.64);
      }
      #dayflow-app #dayflowVoiceDialog::backdrop {
        background: rgba(0,0,0,.76);
        backdrop-filter: blur(5px);
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-inner {
        padding: 27px 24px 22px;
        max-height: calc(100dvh - 50px);
        overflow-y: auto;
        text-align: center;
      }
      #dayflow-app #dayflowVoiceDialog h2 {
        font-size: 23px;
        margin: 0 0 10px;
        color: #fff!important;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-pitch {
        color: #d8e6f5;
        font-size: 15px;
        line-height: 1.55;
        margin: 0 auto 24px;
        max-width: 385px;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-record {
        width: 148px;
        height: 148px;
        max-width: 100%;
        border: 2px solid #94caff!important;
        border-radius: 50%;
        background: linear-gradient(160deg,#357bd0,#174476)!important;
        color: #fff!important;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;
        margin: 0 auto 16px;
        box-shadow: inset 0 3px 2px #ffffff53,0 9px 0 #09192d,0 18px 32px #0007;
        transition: transform .16s,filter .16s,box-shadow .16s;
        cursor: pointer;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-record:hover {
        transform: translateY(-3px);
        filter: brightness(1.15);
        box-shadow: inset 0 3px 2px #ffffff70,0 12px 0 #09192d,0 20px 32px #0008;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-record:active {
        transform: translateY(5px);
        box-shadow: inset 0 2px 6px #0006,0 3px 0 #09192d;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-record[data-recording="true"] {
        background: linear-gradient(160deg,#df4059,#8c162c)!important;
        border-color: #ff8d9a!important;
        animation: dayflow5-dayflowVoicePulse 1.4s ease-in-out infinite;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-record svg {
        width: 43px;
        height: 43px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-record span {
        font-size: 15px;
        font-weight: 800;
      }
      @keyframes dayflow5-dayflowVoicePulse {
        50% {
          box-shadow: inset 0 3px 2px #ffffff53,0 9px 0 #09192d,0 0 0 10px #ef405627,0 18px 32px #0007;
        }
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-status {
        color: #b9cde0;
        font-size: 12px;
        line-height: 1.5;
        min-height: 22px;
        margin: 7px 0 12px;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-transcript-label {
        display: block;
        text-align: left;
        font-size: 13px;
        font-weight: 750;
        color: #e6effa;
        margin-bottom: 7px;
      }
      #dayflow-app #dayflowVoiceDialog #dayflowVoiceTranscript {
        display: block;
        width: 100%;
        min-height: 105px;
        max-height: 190px;
        resize: vertical;
        text-align: left;
        line-height: 1.45;
        padding: 12px;
        border: 1px solid #60758c!important;
        border-radius: 10px;
        background: #0a111e!important;
        color: #fff!important;
        font: 14px system-ui,sans-serif;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-actions {
        display: flex;
        justify-content: center;
        gap: 9px;
        flex-wrap: wrap;
        margin-top: 15px;
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-actions button {
        min-height: 43px;
        flex: 1 1 160px;
        padding: 9px 12px;
        font-size: 13px;
      }
      #dayflow-app #dayflowVoiceDialog #dayflowVoiceApply {
        background: var(--custom-button)!important;
        color: #fff!important;
        border-color: var(--custom-button-border)!important;
      }
      #dayflow-app #dayflowVoiceDialog #dayflowVoiceApply:hover {
        filter: brightness(1.14);
      }
      #dayflow-app #dayflowVoiceDialog .dayflow-voice-note {
        font-size: 11px;
        line-height: 1.5;
        color: #9eaec2;
        margin: 12px 0 0;
      }
      #dayflow-app #dayflowVoiceClose {
        position: absolute;
        z-index: 30;
        top: -15px;
        right: -15px;
        width: 36px;
        height: 36px;
        padding: 0;
        display: grid;
        place-items: center;
        border: 2px solid #2b323b!important;
        border-radius: 50%;
        background: #c51e32!important;
        color: #fff!important;
        box-shadow: 0 2px 10px #0008;
      }
      #dayflow-app #dayflowVoiceClose:hover {
        background: #ed2a40!important;
      }
      #dayflow-app #dayflowVoiceClose svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.8;
        stroke-linecap: round;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #dayflowVoiceDialog {
        background: #fff;
        color: #192e44;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #dayflowVoiceDialog h2 {
        color: #192e44!important;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #dayflowVoiceDialog .dayflow-voice-pitch {
        color: #344c64;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #dayflowVoiceDialog .dayflow-voice-status,#dayflow-app.dayflow-app[data-theme-mode="light"] #dayflowVoiceDialog .dayflow-voice-note {
        color: #53687f;
      }
      #dayflow-app.dayflow-app[data-theme-mode="light"] #dayflowVoiceDialog .dayflow-voice-transcript-label {
        color: #203850;
      }
      @media(max-width:520px) {
        #dayflow-app #dayflowVoiceDialog .dayflow-voice-inner {
          padding: 24px 15px 17px;
        }
        #dayflow-app #dayflowVoiceDialog .dayflow-voice-record {
          width: 128px;
          height: 128px;
        }
        #dayflow-app #dayflowVoiceDialog h2 {
          font-size: 21px;
        }
      }
      @media(prefers-reduced-motion:reduce) {
        #dayflow-app #dayflowVoiceDialog .dayflow-voice-record {
          animation: none!important;
          transition: none!important;
        }
      }
