/* GENERATED by ui/drive-page/build-drive-page.mjs from the production index.html <style> block (verbatim). DO NOT EDIT. */
        :root {
            --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple SD Gothic Neo", "Hiragino Sans", "Noto Sans KR", "Noto Sans JP", "Malgun Gothic", sans-serif;
            --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
            --app-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Apple SD Gothic Neo", "Apple SD 산돌고딕 Neo", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "PingFang SC", "PingFang TC", "Noto Sans KR", "Noto Sans JP", "Malgun Gothic", sans-serif;
            --app-font-scale: 1;
            --app-top-safe-offset: 0px;
            --app-mobile-fab-bottom: 5rem;
            --native-android-bottom-inset: 0px;
            --app-bg: #f8fafc;
            --app-surface: #ffffff;
            --app-surface-soft: #f8fafc;
            --app-surface-muted: #f1f5f9;
            --app-border: #e2e8f0;
            --app-border-strong: #cbd5e1;
            --app-text: #1e293b;
            --app-text-strong: #0f172a;
            --app-text-muted: #64748b;
            --app-text-soft: #94a3b8;
            color-scheme: light;
        }

        .theme-dark {
            --app-bg: #020617;
            --app-surface: #0f172a;
            --app-surface-soft: #111827;
            --app-surface-muted: #1e293b;
            --app-border: #334155;
            --app-border-strong: #475569;
            --app-text: #e2e8f0;
            --app-text-strong: #f8fafc;
            --app-text-muted: #cbd5e1;
            --app-text-soft: #94a3b8;
            color-scheme: dark;
        }

        html {
            font-size: 16px;
            -webkit-text-size-adjust: 100%;
            text-size-adjust: 100%;
        }

        /* App text size setting: keep it independent from native system text size. */
        html[data-app-text-size] body {
            font-size: calc(1rem * var(--app-font-scale));
        }

        html[data-app-text-size] .text-\[8px\] {
            font-size: calc(8px * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-\[9px\] {
            font-size: calc(9px * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-\[10px\] {
            font-size: calc(10px * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-\[11px\] {
            font-size: calc(11px * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-xs {
            font-size: calc(var(--text-xs) * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-sm {
            font-size: calc(var(--text-sm) * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-base {
            font-size: calc(var(--text-base) * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-lg {
            font-size: calc(var(--text-lg) * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-xl {
            font-size: calc(var(--text-xl) * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-2xl {
            font-size: calc(var(--text-2xl) * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-3xl {
            font-size: calc(var(--text-3xl) * var(--app-font-scale)) !important;
        }

        html[data-app-text-size] .text-4xl {
            font-size: calc(var(--text-4xl) * var(--app-font-scale)) !important;
        }

        @media (min-width: 40rem) {
            html[data-app-text-size] .sm\:text-\[11px\] {
                font-size: calc(11px * var(--app-font-scale)) !important;
            }

            html[data-app-text-size] .sm\:text-xs {
                font-size: calc(var(--text-xs) * var(--app-font-scale)) !important;
            }

            html[data-app-text-size] .sm\:text-sm {
                font-size: calc(var(--text-sm) * var(--app-font-scale)) !important;
            }

            html[data-app-text-size] .sm\:text-xl {
                font-size: calc(var(--text-xl) * var(--app-font-scale)) !important;
            }

            html[data-app-text-size] .sm\:text-2xl {
                font-size: calc(var(--text-2xl) * var(--app-font-scale)) !important;
            }

            html[data-app-text-size] .sm\:text-4xl {
                font-size: calc(var(--text-4xl) * var(--app-font-scale)) !important;
            }
        }

        @media (min-width: 48rem) {
            html[data-app-text-size] .md\:text-2xl {
                font-size: calc(var(--text-2xl) * var(--app-font-scale)) !important;
            }
        }

        .task-card h4,
        #titleInput,
        #memoInput,
        #memoTitleInput,
        #memoContentInput {
            font-size: calc(1rem * var(--app-font-scale));
        }

        .app-content-text {
            font-size: calc(0.6875rem * var(--app-font-scale)) !important;
        }

        #detailTitle {
            font-size: calc(1.25rem * var(--app-font-scale)) !important;
        }

        #detailDate,
        #detailTime,
        #detailLocation,
        #detailContact,
        #detailEmail,
        #detailMemo,
        #detailCarryOverText {
            font-size: calc(1rem * var(--app-font-scale)) !important;
        }

        .remote-app-font-ready {
            --app-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Apple SD Gothic Neo", "Apple SD 산돌고딕 Neo", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "PingFang SC", "PingFang TC", "Noto Sans KR", "Noto Sans JP", "Malgun Gothic", sans-serif;
        }

        .native-android-app {
            --native-android-bottom-inset: env(safe-area-inset-bottom, 0px);
            --app-mobile-fab-bottom: calc(5.75rem + max(var(--native-android-bottom-inset), env(safe-area-inset-bottom, 0px)));
        }

        .native-ios-app {
            --app-top-safe-offset: 0rem;
            --app-mobile-fab-bottom: calc(6.5rem + env(safe-area-inset-bottom, 0px));
        }

        body {
            font-family: var(--app-font-sans);
            background-color: var(--app-bg);
            -webkit-tap-highlight-color: transparent;
        }

        .hidden {
            display: none !important;
        }

        input,
        textarea,
        select,
        button {
            font: inherit;
            font-family: inherit;
        }

        #app,
        #mainApp {
            margin-top: 0;
            padding-top: calc(1.5rem + env(safe-area-inset-top, 0px) + var(--app-top-safe-offset));
        }

        .native-ios-app #app,
        .native-ios-app #mainApp {
            padding-top: calc(0.25rem + env(safe-area-inset-top, 0px) + var(--app-top-safe-offset));
        }

        .safe-bottom {
            padding-bottom: calc(env(safe-area-inset-bottom) + 0.75rem);
        }

        .native-android-app .safe-bottom {
            padding-bottom: calc(max(var(--native-android-bottom-inset), env(safe-area-inset-bottom, 0px)) + 1rem);
        }

        .native-ios-app [data-hide-on-ios="true"] {
            display: none !important;
        }

        .native-ios-app [data-web-only="true"],
        .native-android-app [data-web-only="true"] {
            display: none !important;
        }

        .footer-action-toolbar {
            width: 100%;
            max-width: 24rem;
            margin: 0 auto calc(var(--app-mobile-fab-bottom) + 4.75rem);
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 0.75rem;
        }

        .footer-action-button {
            min-width: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.45rem;
            padding: 0.8rem 0.9rem;
            border-radius: 1rem;
            border: 1px solid #e2e8f0;
            background: rgba(255, 255, 255, 0.92);
            color: #475569;
            font-size: 0.8rem;
            font-weight: 800;
            line-height: 1;
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
            transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
        }

        .footer-action-button:hover {
            color: #2563eb;
            border-color: #bfdbfe;
            background: #ffffff;
        }

        .footer-action-button:active {
            transform: scale(0.97);
        }

        @media (min-width: 640px) {
            .footer-action-toolbar {
                max-width: none;
                margin-bottom: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: wrap;
            }
        }

        .force-fixed {
            transform: translateZ(0);
            -webkit-transform: translateZ(0);
        }

        /* 안드로이드 스크롤 고정 버그 해결용 */
        .no-scrollbar::-webkit-scrollbar {
            display: none;
        }

        .no-scrollbar {
            -ms-overflow-style: none;
            scrollbar-width: none;
        }

        .task-card {
            transition: transform 0.1s ease, box-shadow 0.1s ease;
            padding: calc(1.25rem * var(--app-font-scale));
        }

        .task-card:active {
            transform: scale(0.98);
        }

        .dday-today-badge {
            animation: ddayGlow 1.6s ease-in-out infinite;
            transform-origin: center;
        }

        .date-swipe-surface {
            touch-action: pan-y pinch-zoom;
            overscroll-behavior-x: contain;
        }

        .date-swipe-stage {
            --date-swipe-offset: 0px;
            --date-swipe-opacity: 1;
            transform: translate3d(var(--date-swipe-offset), 0, 0);
            opacity: var(--date-swipe-opacity);
            will-change: transform, opacity;
            transition: transform 0.28s cubic-bezier(0.2, 0.9, 0.24, 1), opacity 0.22s ease;
        }

        .date-swipe-stage.is-dragging {
            transition: none;
        }

        .toast-notification {
            animation: toastIn 0.35s ease, toastOut 0.35s ease 2.65s forwards;
            pointer-events: auto;
        }

        .toast-safe-top {
            top: calc(env(safe-area-inset-top, 0px) + var(--app-top-safe-offset) + 5rem);
        }

        @keyframes toastIn {
            from {
                opacity: 0;
                transform: translateY(-12px) scale(0.97);
            }

            to {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }

        @keyframes toastOut {
            from {
                opacity: 1;
            }

            to {
                opacity: 0;
                pointer-events: none;
            }
        }

        .modal-enter {
            animation: modalFadeUp 0.3s ease-out;
        }

        @keyframes modalFadeUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .shake {
            animation: shake 0.4s ease-in-out;
        }

        @keyframes shake {

            0%,
            100% {
                transform: translateX(0);
            }

            25% {
                transform: translateX(-10px);
            }

            75% {
                transform: translateX(10px);
            }
        }

        @keyframes ddayGlow {

            0%,
            100% {
                box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.24);
                transform: translateY(0) scale(1);
            }

            50% {
                box-shadow: 0 0 0 10px rgba(220, 38, 38, 0.1);
                transform: translateY(-1px) scale(1.04);
            }
        }

        .nav-active {
            color: #2563eb;
        }

        .nav-active i {
            color: #2563eb;
        }

        /* Match corner cells to the calendar's inner curve so today's border stays visible. */
        #calendarGrid {
            --calendar-corner-radius: calc(2rem - 1px);
        }

        #calendarGrid > :first-child {
            border-top-left-radius: var(--calendar-corner-radius);
        }

        #calendarGrid > :nth-child(7) {
            border-top-right-radius: var(--calendar-corner-radius);
        }

        #calendarGrid > :nth-last-child(7) {
            border-bottom-left-radius: var(--calendar-corner-radius);
        }

        #calendarGrid > :last-child {
            border-bottom-right-radius: var(--calendar-corner-radius);
        }

        .today-cell {
            background-color: #eff6ff !important;
            border: 2px solid #3b82f6 !important;
            box-shadow: inset 0 0 10px rgba(59, 130, 246, 0.1);
            z-index: 10;
        }

        .truncate {
            text-overflow: clip !important;
        }

        .app-text-clip-4 {
            display: block;
            max-height: calc(0.875rem * 1.625 * 4);
            overflow: hidden;
        }

        .cal-item {
            font-size: 9px;
            line-height: 1.2;
            padding: 2px 4px;
            border-radius: 4px;
            margin-bottom: 2px;
            white-space: normal;
            overflow: visible;
            overflow-wrap: anywhere;
            word-break: keep-all;
            text-overflow: clip;
        }

        .memo-checkbox:checked+div {
            text-decoration: line-through;
            color: #94a3b8;
        }

        /* Icon-only buttons keep fixed px size regardless of --app-font-scale */
        #fab {
            width: 64px;
            height: 64px;
            flex-shrink: 0;
        }

        #fab>svg {
            width: 32px;
            height: 32px;
            flex-shrink: 0;
        }

        @media (max-width: 1023px) {
            #fab {
                bottom: var(--app-mobile-fab-bottom);
            }

            .native-android-app body {
                padding-bottom: calc(7.5rem + max(var(--native-android-bottom-inset), env(safe-area-inset-bottom, 0px)));
            }
        }

        .app-install-banner {
            position: fixed;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 190;
            padding: 0.75rem;
        }

        .app-install-banner__card {
            display: flex;
            align-items: center;
            gap: 0.875rem;
            max-width: 32rem;
            margin: 0 auto;
            padding: 1rem;
            color: #fff;
            background: rgba(15, 23, 42, 0.96);
            border: 1px solid rgba(148, 163, 184, 0.18);
            border-radius: 1.5rem;
            box-shadow: 0 22px 48px rgba(15, 23, 42, 0.34);
            backdrop-filter: blur(14px);
        }

        .app-install-banner__icon {
            width: 3rem;
            height: 3rem;
            border-radius: 0.9rem;
            flex-shrink: 0;
        }

        .app-install-banner__content {
            flex: 1 1 auto;
            min-width: 0;
        }

        .app-install-banner__title {
            font-size: 0.9375rem;
            font-weight: 700;
            line-height: 1.35;
        }

        .app-install-banner__desc {
            margin-top: 0.2rem;
            font-size: 0.75rem;
            line-height: 1.45;
            color: #cbd5e1;
        }

        .app-install-banner__actions {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
            margin-top: 0.65rem;
        }

        .app-install-banner__store-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 2rem;
            padding: 0.45rem 0.85rem;
            color: #0f172a;
            font-size: 0.75rem;
            font-weight: 700;
            line-height: 1;
            text-decoration: none;
            background: #fff;
            border-radius: 999px;
            box-shadow: 0 8px 20px rgba(15, 23, 42, 0.16);
        }

        .app-install-banner__dismiss {
            width: 2rem;
            height: 2rem;
            flex-shrink: 0;
            color: #cbd5e1;
            font-size: 1.4rem;
            line-height: 1;
            border: 0;
            border-radius: 999px;
            cursor: pointer;
            background: transparent;
        }

        .lock-screen {
            position: fixed;
            inset: 0;
            z-index: 200;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 100vh;
            min-height: 100dvh;
            padding: calc(env(safe-area-inset-top, 0px) + 1.5rem) 1.25rem calc(env(safe-area-inset-bottom, 0px) + 1.75rem);
            color: #fff;
            text-align: center;
            background: linear-gradient(180deg, #0f172a 0%, #111827 100%);
        }

        .lock-screen__shell {
            width: min(100%, 22rem);
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .lock-screen__badge {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 4.5rem;
            height: 4.5rem;
            margin-bottom: 1.25rem;
            background: linear-gradient(135deg, #2563eb, #1d4ed8);
            border-radius: 999px;
            box-shadow: 0 18px 38px rgba(37, 99, 235, 0.32);
        }

        .lock-screen__title {
            font-size: 1.65rem;
            font-weight: 800;
            line-height: 1.2;
        }

        .lock-screen__desc {
            margin-top: 0.65rem;
            color: #cbd5e1;
            font-size: 0.95rem;
            line-height: 1.5;
        }

        .lock-pin-display {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 0.9rem;
            width: min(100%, 12rem);
            margin: 1.6rem auto 0;
        }

        .lock-pin-dot {
            width: 1rem;
            height: 1rem;
            margin: 0 auto;
            border: 2px solid rgba(148, 163, 184, 0.4);
            border-radius: 999px;
            background: transparent;
            transition: transform 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
        }

        .lock-pin-dot.is-filled {
            background: #60a5fa;
            border-color: #60a5fa;
            transform: scale(1.05);
            box-shadow: 0 0 0 6px rgba(96, 165, 250, 0.14);
        }

        .lock-keypad {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 0.8rem;
            width: min(100%, 18rem);
            margin-top: 1.85rem;
        }

        .lock-key {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            min-height: 4.2rem;
            color: #fff;
            font-size: 1.25rem;
            font-weight: 700;
            line-height: 1;
            border: 1px solid rgba(148, 163, 184, 0.16);
            border-radius: 999px;
            background: rgba(30, 41, 59, 0.9);
            box-shadow: 0 14px 28px rgba(15, 23, 42, 0.24);
            aspect-ratio: 1 / 1;
        }

        .lock-key--placeholder {
            pointer-events: none;
            background: transparent;
            border-color: transparent;
            box-shadow: none;
        }

        .lock-key--action {
            font-size: 0.95rem;
            letter-spacing: 0.04em;
        }

        .lock-screen__note {
            margin-top: 1.1rem;
            color: #94a3b8;
            font-size: 0.78rem;
            line-height: 1.6;
        }

        .done-stamp {
            position: absolute;
            top: 50%;
            right: 0.75rem;
            transform: translateY(-50%) rotate(-15deg);
            width: 68px;
            height: 68px;
            border: 2px solid rgba(176, 30, 40, 0.75);
            border-radius: 50%;
            padding: 4px;
            pointer-events: none;
            color: rgba(176, 30, 40, 0.82);
            z-index: 2;
        }

        .done-stamp-ring {
            border: 1.5px solid rgba(176, 30, 40, 0.75);
            border-radius: 50%;
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 2px;
        }

        .done-stamp-top {
            font-size: 8.5px;
            font-weight: 900;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            line-height: 1;
        }

        .done-stamp-check {
            width: 26px;
            height: 26px;
            stroke: currentColor;
            stroke-width: 2.5;
            stroke-linecap: round;
            stroke-linejoin: round;
            fill: none;
        }

        .ai-draft-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.38rem;
            min-width: 4.5rem;
            min-height: 1rem;
            padding: 0 1rem;
            color: #fff;
            background: #2563eb;
            border: 1px solid #1d4ed8;
            border-radius: 1rem;
            font-size: 0.875rem;
            font-weight: 900;
            line-height: 1;
            box-shadow: 0 14px 24px rgba(37, 99, 235, 0.22);
            transition: transform 150ms ease, background 150ms ease, opacity 150ms ease;
        }

        .ai-draft-button:hover {
            background: #1d4ed8;
        }

        .ai-draft-button:active {
            transform: scale(0.98);
        }

        .ai-draft-button:disabled {
            opacity: 0.72;
        }

        .ai-draft-button svg {
            width: 1rem;
            height: 1rem;
            color: currentColor;
            stroke: currentColor;
        }

        .theme-dark body {
            color: var(--app-text);
            background-color: var(--app-bg);
        }

        .theme-dark input,
        .theme-dark textarea,
        .theme-dark select {
            color: var(--app-text-strong);
            background-color: var(--app-surface-soft);
            border-color: var(--app-border);
        }

        .theme-dark input::placeholder,
        .theme-dark textarea::placeholder {
            color: #64748b;
        }

        .theme-dark select option {
            color: var(--app-text);
            background-color: var(--app-surface);
        }

        .theme-dark .bg-white,
        .theme-dark .peer:checked~.peer-checked\:bg-white {
            background-color: var(--app-surface) !important;
        }

        .theme-dark .hover\:bg-white\/50:hover,
        .theme-dark .hover\:bg-white\/70:hover {
            background-color: rgba(30, 41, 59, 0.78) !important;
        }

        .theme-dark .bg-slate-50,
        .theme-dark [class~="bg-slate-50/50"] {
            background-color: var(--app-surface-soft) !important;
        }

        .theme-dark .bg-slate-100 {
            background-color: var(--app-surface-muted) !important;
        }

        .theme-dark .bg-slate-200,
        .theme-dark .bg-slate-300 {
            background-color: #334155 !important;
        }

        .theme-dark .bg-blue-50,
        .theme-dark .bg-blue-100 {
            background-color: rgba(37, 99, 235, 0.2) !important;
        }

        .theme-dark .bg-indigo-50,
        .theme-dark .bg-indigo-100,
        .theme-dark .bg-purple-50,
        .theme-dark .bg-purple-100,
        .theme-dark .bg-violet-50,
        .theme-dark .bg-violet-100 {
            background-color: rgba(99, 102, 241, 0.2) !important;
        }

        .theme-dark .bg-sky-50,
        .theme-dark .bg-sky-100 {
            background-color: rgba(14, 165, 233, 0.18) !important;
        }

        .theme-dark .bg-emerald-50,
        .theme-dark .bg-emerald-100,
        .theme-dark .bg-green-50,
        .theme-dark .bg-green-100 {
            background-color: rgba(16, 185, 129, 0.18) !important;
        }

        .theme-dark .bg-amber-50,
        .theme-dark .bg-amber-100,
        .theme-dark .bg-yellow-50,
        .theme-dark .bg-yellow-100,
        .theme-dark .bg-orange-50,
        .theme-dark .bg-orange-100 {
            background-color: rgba(245, 158, 11, 0.2) !important;
        }

        .theme-dark .bg-red-50,
        .theme-dark .bg-red-100,
        .theme-dark .bg-rose-50,
        .theme-dark .bg-rose-100 {
            background-color: rgba(244, 63, 94, 0.18) !important;
        }

        .theme-dark .border-slate-50,
        .theme-dark .border-slate-100,
        .theme-dark .border-slate-200,
        .theme-dark .border-slate-300,
        .theme-dark .border-slate-400 {
            border-color: var(--app-border) !important;
        }

        .theme-dark .border-blue-100,
        .theme-dark .border-blue-200 {
            border-color: rgba(96, 165, 250, 0.36) !important;
        }

        .theme-dark .border-indigo-100,
        .theme-dark .border-indigo-200,
        .theme-dark .border-purple-100,
        .theme-dark .border-purple-200,
        .theme-dark .border-violet-100,
        .theme-dark .border-violet-200 {
            border-color: rgba(129, 140, 248, 0.36) !important;
        }

        .theme-dark .border-sky-100,
        .theme-dark .border-sky-200,
        .theme-dark .border-sky-400 {
            border-color: rgba(56, 189, 248, 0.38) !important;
        }

        .theme-dark .border-emerald-100,
        .theme-dark .border-emerald-200,
        .theme-dark .border-emerald-300,
        .theme-dark .border-emerald-400,
        .theme-dark .border-green-100,
        .theme-dark .border-green-200 {
            border-color: rgba(52, 211, 153, 0.38) !important;
        }

        .theme-dark .border-amber-100,
        .theme-dark .border-amber-200,
        .theme-dark .border-amber-300,
        .theme-dark .border-amber-400,
        .theme-dark .border-yellow-100,
        .theme-dark .border-yellow-200,
        .theme-dark .border-red-100,
        .theme-dark .border-red-200,
        .theme-dark .border-rose-100,
        .theme-dark .border-rose-200,
        .theme-dark .border-rose-400 {
            border-color: rgba(251, 191, 36, 0.34) !important;
        }

        .theme-dark .border-red-100,
        .theme-dark .border-red-200,
        .theme-dark .border-rose-100,
        .theme-dark .border-rose-200,
        .theme-dark .border-rose-400 {
            border-color: rgba(251, 113, 133, 0.38) !important;
        }

        .theme-dark .text-slate-900,
        .theme-dark .text-slate-800,
        .theme-dark .text-slate-700 {
            color: var(--app-text-strong) !important;
        }

        .theme-dark .text-slate-600,
        .theme-dark .text-slate-500 {
            color: var(--app-text-muted) !important;
        }

        .theme-dark .text-slate-400,
        .theme-dark .text-slate-300 {
            color: var(--app-text-soft) !important;
        }

        .theme-dark .text-blue-500,
        .theme-dark .text-blue-600,
        .theme-dark .text-blue-700,
        .theme-dark .text-sky-600,
        .theme-dark .text-sky-700,
        .theme-dark .text-indigo-600,
        .theme-dark .text-indigo-700 {
            color: #93c5fd !important;
        }

        .theme-dark .text-purple-600,
        .theme-dark .text-purple-700,
        .theme-dark .text-violet-600,
        .theme-dark .text-violet-700 {
            color: #c4b5fd !important;
        }

        .theme-dark .text-emerald-600,
        .theme-dark .text-emerald-700,
        .theme-dark .text-emerald-800,
        .theme-dark .text-green-600,
        .theme-dark .text-green-700 {
            color: #6ee7b7 !important;
        }

        .theme-dark .text-amber-500,
        .theme-dark .text-amber-600,
        .theme-dark .text-amber-700,
        .theme-dark .text-yellow-500,
        .theme-dark .text-yellow-600,
        .theme-dark .text-orange-500 {
            color: #fcd34d !important;
        }

        .theme-dark .text-red-500,
        .theme-dark .text-red-600,
        .theme-dark .text-red-700,
        .theme-dark .text-rose-500,
        .theme-dark .text-rose-600,
        .theme-dark .text-rose-700 {
            color: #fda4af !important;
        }

        .theme-dark .bg-yellow-400.text-slate-900,
        .theme-dark .bg-yellow-300.text-slate-900 {
            color: #0f172a !important;
        }

        .theme-dark .hover\:bg-slate-50:hover,
        .theme-dark .hover\:bg-slate-100:hover,
        .theme-dark .hover\:bg-slate-200:hover {
            background-color: #1e293b !important;
        }

        .theme-dark .hover\:bg-blue-50:hover,
        .theme-dark .hover\:bg-blue-100:hover,
        .theme-dark .hover\:bg-indigo-50:hover,
        .theme-dark .hover\:bg-indigo-100:hover,
        .theme-dark .hover\:bg-red-50:hover,
        .theme-dark .hover\:bg-red-100:hover,
        .theme-dark .hover\:bg-emerald-50:hover,
        .theme-dark .hover\:bg-emerald-100:hover {
            background-color: rgba(30, 41, 59, 0.9) !important;
        }

        .theme-dark .shadow-sm,
        .theme-dark .shadow-md,
        .theme-dark .shadow-lg,
        .theme-dark .shadow-xl,
        .theme-dark .shadow-2xl {
            --tw-shadow-color: rgba(0, 0, 0, 0.38);
        }

        .theme-dark .ring-offset-1,
        .theme-dark .ring-offset-2 {
            --tw-ring-offset-color: var(--app-bg);
        }

        .theme-dark .footer-action-button {
            color: var(--app-text-muted);
            background: rgba(15, 23, 42, 0.92);
            border-color: var(--app-border);
            box-shadow: 0 14px 28px rgba(0, 0, 0, 0.24);
        }

        .theme-dark .footer-action-button:hover {
            color: #93c5fd;
            background: #1e293b;
            border-color: rgba(96, 165, 250, 0.42);
        }

        .theme-dark .today-cell {
            background-color: rgba(37, 99, 235, 0.18) !important;
            border-color: #60a5fa !important;
            box-shadow: inset 0 0 14px rgba(96, 165, 250, 0.18);
        }

        .theme-dark .memo-checkbox:checked+div {
            color: #64748b;
        }

        .theme-dark .task-card.bg-white,
        .theme-dark .task-card.bg-slate-50 {
            background-color: #0f172a !important;
            border-color: #334155 !important;
        }

        .theme-dark .task-card.bg-slate-300 {
            background-color: #1e293b !important;
            border-color: #475569 !important;
        }

        .theme-dark .task-card.bg-sky-100 {
            background-color: rgba(8, 47, 73, 0.9) !important;
            border-color: #0ea5e9 !important;
            box-shadow: 0 14px 30px rgba(14, 165, 233, 0.12);
        }

        .theme-dark .task-card.bg-emerald-100 {
            background-color: rgba(6, 78, 59, 0.88) !important;
            border-color: #10b981 !important;
            box-shadow: 0 14px 30px rgba(16, 185, 129, 0.12);
        }

        .theme-dark .task-card.bg-amber-100 {
            background-color: rgba(120, 53, 15, 0.86) !important;
            border-color: #f59e0b !important;
            box-shadow: 0 14px 30px rgba(245, 158, 11, 0.12);
        }

        .theme-dark .task-card.bg-rose-100 {
            background-color: rgba(136, 19, 55, 0.86) !important;
            border-color: #fb7185 !important;
            box-shadow: 0 14px 30px rgba(244, 63, 94, 0.12);
        }

        .theme-dark .cal-item.bg-white {
            color: #e2e8f0 !important;
            background-color: #0f172a !important;
            border-color: #334155 !important;
        }

        .theme-dark .cal-item.bg-slate-100 {
            color: #94a3b8 !important;
            background-color: #1e293b !important;
            border-color: #334155 !important;
        }

        .theme-dark .cal-item.bg-purple-50 {
            color: #ddd6fe !important;
            background-color: rgba(88, 28, 135, 0.72) !important;
            border-color: rgba(168, 85, 247, 0.45) !important;
        }

        .theme-dark .cal-item.bg-sky-100 {
            color: #e0f2fe !important;
            background-color: rgba(8, 47, 73, 0.86) !important;
            border-color: rgba(56, 189, 248, 0.48) !important;
        }

        .theme-dark .cal-item.bg-emerald-100 {
            color: #d1fae5 !important;
            background-color: rgba(6, 78, 59, 0.84) !important;
            border-color: rgba(52, 211, 153, 0.48) !important;
        }

        .theme-dark .cal-item.bg-amber-100 {
            color: #fef3c7 !important;
            background-color: rgba(120, 53, 15, 0.82) !important;
            border-color: rgba(251, 191, 36, 0.5) !important;
        }

        .theme-dark .cal-item.bg-rose-100 {
            color: #ffe4e6 !important;
            background-color: rgba(136, 19, 55, 0.82) !important;
            border-color: rgba(251, 113, 133, 0.5) !important;
        }

        .theme-dark .color-btn.bg-white,
        .theme-dark .memo-color-btn.bg-white {
            background-color: #0f172a !important;
            border-color: #64748b !important;
        }

        .theme-dark .color-btn.bg-sky-300,
        .theme-dark .memo-color-btn.bg-sky-300 {
            background-color: #38bdf8 !important;
            border-color: #0ea5e9 !important;
        }

        .theme-dark .color-btn.bg-emerald-300,
        .theme-dark .memo-color-btn.bg-emerald-300 {
            background-color: #34d399 !important;
            border-color: #10b981 !important;
        }

        .theme-dark .color-btn.bg-amber-300,
        .theme-dark .memo-color-btn.bg-amber-300 {
            background-color: #fbbf24 !important;
            border-color: #f59e0b !important;
        }

        .theme-dark .color-btn.bg-rose-300,
        .theme-dark .memo-color-btn.bg-rose-300 {
            background-color: #fb7185 !important;
            border-color: #f43f5e !important;
        }

        @media (max-width: 420px) {
            .lock-screen__title {
                font-size: 1.45rem;
            }

            .lock-screen__desc {
                font-size: 0.88rem;
            }

            .lock-keypad {
                width: min(100%, 16.5rem);
                gap: 0.65rem;
            }

            .lock-key {
                min-height: 3.7rem;
                font-size: 1.1rem;
            }
        }
    