:root{--bg-primary: #f8fafc;--bg-secondary: #f1f5f9;--bg-card: #ffffff;--bg-elevated: #ffffff;--task-card-bg: #ffffff;--notes-bg: #f8fafc;--scratchpad-bg: #f8fafc;--modal-bg: #ffffff;--popover-bg: #ffffff;--text-primary: #0f172a;--text-secondary: #64748b;--border-color: #e2e8f0;--accent-color: #0c51de;--accent-rgb: 12, 81, 222;--accent-hover: #0a46bf;--accent-alt: #93c5fd;--accent-warm: #fbbf24;--btn-primary-bg: #0c51de;--btn-primary-text: #ffffff;--btn-secondary-bg: #f1f5f9;--btn-secondary-text: #0f172a;--nav-active-bg: #dbeafe;--nav-active-text: #0b3ea8;--hover-bg: #eef2f7;--input-bg: #ffffff;--input-border: #e2e8f0;--focus-ring: #0c51de;--timer-bg: #ffffff;--timer-progress: #0c51de;--habit-indicator: #10b981;--calendar-highlight: #93c5fd;--heatmap-empty: #e9edf3;--heatmap-1: #dbeafe;--heatmap-2: #93c5fd;--heatmap-3: #60a5fa;--heatmap-4: #0c51de;--status-active: #0c51de;--status-done: #10b981;--status-overdue: #ef4444;--chart-primary: #0c51de;--chart-secondary: #93c5fd;--on-accent: #ffffff;--on-calendar: #111111;--on-habit: #ffffff;--success-color: #10b981;--danger-color: #ef4444;--warning-color: #f59e0b;--border-subtle: 1px;--border-strong: 2px;--outline-width: 2px;--outline-color: var(--border-color);--shadow-offset-sm: 2px;--shadow-offset: 3px;--shadow-color: color-mix(in srgb, var(--outline-color) 13%, transparent);--shadow-lg: 0 10px 24px -16px rgba(0, 0, 0, .18);--radius: 1.5rem;--radius-lg: 2rem;--card-radius: 1.5rem;--card-padding: 1.5rem;--section-gap: 2rem;--stack-gap: 1.5rem;--decoration-opacity: .55;--texture-opacity: 8%;--weight-heading: 700;--weight-strong: 600;--meta-size: .75rem;--font-display: "Space Grotesk", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--skeleton-base: color-mix(in srgb, var(--text-primary) 7%, var(--bg-secondary));--skeleton-highlight: color-mix(in srgb, var(--text-primary) 15%, var(--bg-secondary));color-scheme:light}html{margin:0;padding:0;background:var(--bg-primary)}body,#root{margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-primary);color:var(--text-primary);touch-action:manipulation;-webkit-tap-highlight-color:transparent;width:100%;position:relative}.theme-dark{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-card: #1e293b;--bg-elevated: #243449;--task-card-bg: #1e293b;--notes-bg: #0f172a;--scratchpad-bg: #0f172a;--modal-bg: #1e293b;--popover-bg: #243449;--text-primary: #f8fafc;--text-secondary: #94a3b8;--border-color: #334155;--accent-color: #5b9dff;--accent-rgb: 91, 157, 255;--accent-hover: #79afff;--accent-alt: #7dd3fc;--accent-warm: #fbbf24;--btn-primary-bg: #5b9dff;--btn-primary-text: #111111;--btn-secondary-bg: #334155;--btn-secondary-text: #f8fafc;--nav-active-bg: #2c4a7b;--nav-active-text: #ffffff;--hover-bg: #26364d;--input-bg: #0f172a;--input-border: #334155;--focus-ring: #79afff;--timer-bg: #1e293b;--timer-progress: #79afff;--habit-indicator: #10b981;--calendar-highlight: #7dd3fc;--heatmap-empty: #1c2b3f;--heatmap-1: #304869;--heatmap-2: #466695;--heatmap-3: #5d87c5;--heatmap-4: #79afff;--status-active: #79afff;--status-done: #10b981;--status-overdue: #ef4444;--chart-primary: #79afff;--chart-secondary: #7dd3fc;--outline-color: #334155;--skeleton-base: color-mix(in srgb, var(--text-primary) 8%, var(--bg-secondary));--skeleton-highlight: color-mix(in srgb, var(--text-primary) 18%, var(--bg-secondary));color-scheme:dark}.theme-shack{--bg-primary: #1c1c1e;--bg-secondary: #242426;--bg-card: #2c2c2f;--bg-elevated: #36363a;--task-card-bg: #2c2c2f;--notes-bg: #18181a;--scratchpad-bg: #18181a;--modal-bg: #2c2c2f;--popover-bg: #36363a;--text-primary: #f2f2f4;--text-secondary: #a8a8ae;--accent-color: #5b9dff;--accent-rgb: 91, 157, 255;--accent-hover: #79afff;--accent-alt: #7dd3fc;--accent-warm: #fbbf24;--border-color: #3f3f45;--btn-primary-bg: #5b9dff;--btn-primary-text: #111111;--btn-secondary-bg: #36363a;--btn-secondary-text: #f2f2f4;--nav-active-bg: #344d74;--nav-active-text: #ffffff;--hover-bg: #333337;--input-bg: #18181a;--input-border: #3f3f45;--focus-ring: #75adff;--timer-bg: #2c2c2f;--timer-progress: #75adff;--habit-indicator: #10b981;--calendar-highlight: #7dd3fc;--heatmap-empty: #2a2a2e;--heatmap-1: #3b475c;--heatmap-2: #4c658c;--heatmap-3: #5f86c0;--heatmap-4: #75adff;--status-active: #75adff;--status-done: #10b981;--status-overdue: #ef4444;--chart-primary: #75adff;--chart-secondary: #7dd3fc;--outline-color: #3f3f45;--skeleton-base: #2a2a2e;--skeleton-highlight: #3a3a3f;color-scheme:dark}.theme-riff{--bg-primary: #eaf2fb;--bg-secondary: #ddeaf8;--bg-card: #ffffff;--bg-elevated: #ffffff;--task-card-bg: #ffffff;--notes-bg: #ffffff;--scratchpad-bg: #eaf2fb;--modal-bg: #ffffff;--popover-bg: #ffffff;--text-primary: #111111;--text-secondary: #475569;--border-color: #111111;--accent-color: #0c51de;--accent-rgb: 12, 81, 222;--accent-hover: #0a46bf;--accent-alt: #93c5fd;--accent-warm: #fbbf24;--btn-primary-bg: #0c51de;--btn-primary-text: #ffffff;--btn-secondary-bg: #dbeafe;--btn-secondary-text: #0b3ea8;--nav-active-bg: #bfdbfe;--nav-active-text: #0b3ea8;--hover-bg: #e0ecf8;--input-bg: #ffffff;--input-border: #111111;--focus-ring: #0c51de;--timer-bg: #ffffff;--timer-progress: #0c51de;--habit-indicator: #38bdf8;--calendar-highlight: #93c5fd;--heatmap-empty: #dce7f5;--heatmap-1: #bfdbfe;--heatmap-2: #93c5fd;--heatmap-3: #60a5fa;--heatmap-4: #0c51de;--status-active: #0c51de;--status-done: #2f9e44;--status-overdue: #e5484d;--chart-primary: #0c51de;--chart-secondary: #93c5fd;--on-accent: #ffffff;--on-calendar: #111111;--on-habit: #111111;--success-color: #2f9e44;--danger-color: #e5484d;--outline-color: #111111;--skeleton-base: #dce7f5;--skeleton-highlight: #eff5fc;color-scheme:light}.theme-custom{--bg-primary: var(--custom-bg);--bg-secondary: var(--custom-secondary);--bg-card: var(--custom-card);--bg-elevated: var(--custom-card);--task-card-bg: var(--custom-card);--notes-bg: var(--custom-notes);--scratchpad-bg: var(--custom-notes);--modal-bg: var(--custom-card);--popover-bg: var(--custom-card);--text-primary: var(--custom-text);--text-secondary: var(--custom-text-sec);--accent-color: var(--custom-accent);--accent-rgb: var(--custom-accent-rgb);--accent-hover: var(--custom-accent);--border-color: var(--custom-border);--outline-color: var(--custom-border);--btn-primary-bg: var(--custom-accent);--nav-active-bg: var(--custom-accent);--timer-bg: var(--custom-card);--timer-progress: var(--custom-accent);--calendar-highlight: var(--custom-accent);--input-bg: var(--custom-bg);--input-border: var(--custom-border);--focus-ring: var(--custom-accent)}.theme-dynamic{--bg-primary: var(--m3-background);--bg-secondary: var(--m3-surfaceVariant);--bg-card: var(--m3-surface);--bg-elevated: var(--m3-surfaceVariant);--task-card-bg: var(--m3-surface);--notes-bg: color-mix(in srgb, var(--m3-surfaceVariant) 65%, var(--m3-surface));--scratchpad-bg: color-mix(in srgb, var(--m3-surfaceVariant) 65%, var(--m3-surface));--modal-bg: var(--m3-surface);--popover-bg: var(--m3-surfaceVariant);--text-primary: var(--m3-onBackground);--text-secondary: var(--m3-onSurfaceVariant);--accent-color: var(--m3-primary);--accent-rgb: var(--m3-primary-rgb);--accent-hover: var(--m3-primary);--border-color: var(--m3-outline);--outline-color: var(--m3-outline);--btn-primary-bg: var(--m3-primary);--nav-active-bg: var(--m3-primary);--timer-bg: var(--m3-surface);--timer-progress: var(--m3-primary);--calendar-highlight: var(--m3-primary);--input-bg: var(--m3-background);--input-border: var(--m3-outline);--focus-ring: var(--m3-primary)}.style-classic{--style-border-base: 2px;--style-shadow-base: 3px;--radius: 1.5rem;--radius-lg: 2rem;--card-radius: 1.5rem}.style-riff{--style-border-base: 3px;--style-shadow-base: 6px;--radius: 1.75rem;--radius-lg: 2.25rem;--card-radius: 1.75rem}.intensity-soft{--outline-width: max(1px, calc(var(--style-border-base) * .5));--shadow-offset: max(1px, calc(var(--style-shadow-base) * .18));--shadow-offset-sm: 1px;--border-subtle: 1px;--border-strong: 1px;--shadow-color: color-mix(in srgb, var(--outline-color) 7%, transparent);--shadow-lg: 0 10px 28px -22px rgba(0, 0, 0, .22);--section-gap: 2.5rem;--stack-gap: 1.75rem;--card-padding: 1.6rem;--decoration-opacity: .3;--texture-opacity: 5%;--weight-heading: 700;--weight-strong: 600;--meta-size: .76rem}.intensity-balanced{--outline-width: max(1px, calc(var(--style-border-base) * .75));--shadow-offset: max(1px, calc(var(--style-shadow-base) * .4));--shadow-offset-sm: 2px;--border-subtle: 1px;--border-strong: 2px;--shadow-color: color-mix(in srgb, var(--outline-color) 14%, transparent);--shadow-lg: 0 12px 30px -22px rgba(0, 0, 0, .3);--section-gap: 2rem;--stack-gap: 1.5rem;--card-padding: 1.5rem;--decoration-opacity: .55;--texture-opacity: 8%;--weight-heading: 700;--weight-strong: 600;--meta-size: .75rem}.intensity-bold{--outline-width: var(--style-border-base);--shadow-offset: var(--style-shadow-base);--shadow-offset-sm: 3px;--border-subtle: 2px;--border-strong: 2px;--shadow-color: var(--outline-color);--shadow-lg: var(--style-shadow-base) var(--style-shadow-base) 0 var(--shadow-color);--section-gap: 1.75rem;--stack-gap: 1.35rem;--card-padding: 1.35rem;--decoration-opacity: .9;--texture-opacity: 12%;--weight-heading: 800;--weight-strong: 700;--meta-size: .72rem}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-primary);color:var(--text-primary);transition:background-color .3s ease,color .3s ease;line-height:1.5;min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;letter-spacing:-.03em}button{cursor:pointer;font-family:inherit;border:none;background:none;transition:all .2s ease}input,textarea,select{font-family:inherit;border:var(--border-subtle) solid var(--input-border);background-color:var(--input-bg);color:var(--text-primary);border-radius:.75rem;padding:.5rem .75rem;outline:none;transition:border-color .2s,box-shadow .2s}input:focus,textarea:focus,select:focus{border-color:var(--focus-ring);outline:2px solid var(--focus-ring);outline-offset:1px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(var(--accent-rgb),.2);border-radius:10px;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:var(--accent-color);background-clip:content-box}*{scrollbar-color:rgba(var(--accent-rgb),.3) transparent}html,body{overflow-x:hidden;position:relative;width:100%}.responsive-grid{display:flex;flex-wrap:wrap;gap:var(--stack-gap);align-items:center}.metadata-item{display:flex;align-items:center;gap:.5rem;background:var(--bg-secondary);padding:.25rem .75rem;border-radius:2rem;border:var(--border-subtle) solid var(--border-color);font-size:var(--meta-size);transition:all .2s ease}.metadata-item:hover{border-color:var(--accent-color);background:var(--bg-primary)}@media(max-width:768px){:root{--radius: 1rem;--radius-lg: 1.25rem;--card-radius: 1rem;--card-padding: .75rem}html,body{overflow-x:hidden!important;width:100%!important;position:relative}.task-card,.dashboard-card,.timer-card,.habit-tracker-card,.card-container{padding:var(--card-padding)!important;border-radius:var(--radius)!important;gap:.75rem!important;max-width:100%!important;width:100%!important;box-sizing:border-box!important;margin-left:0!important;margin-right:0!important;display:flex!important;flex-direction:column!important}main,.main-content,.grid-stack{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;max-width:100%!important;gap:1.25rem!important;box-sizing:border-box!important}.responsive-grid{display:grid!important;grid-template-columns:1fr!important;gap:.75rem!important}.score-container{display:flex!important;flex-direction:column!important;gap:.5rem!important}.app-container{padding:.5rem .5rem 5.5rem!important;max-width:100vw!important;width:100%!important;box-sizing:border-box}*{min-width:0}header{align-items:center!important;text-align:center;margin-bottom:1.5rem!important}header .hi-user{margin:0 auto}header .settings-btn{display:none!important}}.settings-modal-grid{display:grid;grid-template-columns:190px minmax(0,1fr);min-height:0;min-width:0;overflow:hidden;flex:1}.settings-sidebar{border-right:1px solid var(--border-color);padding:1rem;background:color-mix(in srgb,var(--bg-secondary) 55%,transparent);display:flex;flex-direction:column;gap:.45rem;overflow-y:auto}@media(max-width:768px){.settings-modal-grid{display:grid!important;grid-template-columns:120px minmax(0,1fr)!important}.settings-sidebar{border-right:1px solid var(--border-color)!important;border-bottom:none!important;padding:.75rem .6rem!important;gap:.35rem!important}.settings-sidebar button{padding:.5rem!important;font-size:.75rem!important}}@media(max-width:480px){.settings-modal-grid{display:grid!important;grid-template-columns:100px minmax(0,1fr)!important}.settings-sidebar{border-right:1px solid var(--border-color)!important;border-bottom:none!important;padding:.5rem .4rem!important;gap:.25rem!important}.settings-sidebar button{padding:.4rem!important;font-size:.65rem!important;line-height:1.2!important}.settings-sidebar button div:first-child{font-size:.7rem!important}.settings-sidebar button div:last-child{display:none!important}}@media(max-width:480px){::-webkit-scrollbar{display:none}}.bottom-nav{display:none;position:fixed;bottom:0;left:.5rem;right:.5rem;width:auto;background:var(--bg-card);border:var(--outline-width) solid var(--outline-color);border-radius:calc(var(--radius-lg) + .25rem);justify-content:space-between;align-items:center;padding:.45rem;padding-bottom:calc(.45rem + env(safe-area-inset-bottom,0px));z-index:1000;box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--shadow-color);box-sizing:border-box;overflow:hidden}@media(max-width:768px){.bottom-nav{display:flex}}.bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;background:none;border:2px solid transparent;border-radius:1rem;font-size:.68rem;font-weight:700;padding:.45rem .2rem .3rem;min-width:0;flex:1;max-width:100%;transition:.2s cubic-bezier(.4,0,.2,1);color:var(--text-secondary)}.bottom-nav button.active{color:var(--nav-active-text);background:var(--nav-active-bg);border-color:var(--outline-color)}.bottom-nav button span{opacity:.95;line-height:1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bottom-nav button svg{flex-shrink:0;color:inherit;stroke:currentColor}@media(max-width:480px){.bottom-nav{left:.4rem;right:.4rem;padding:.28rem;padding-bottom:calc(.28rem + env(safe-area-inset-bottom,0px));border-radius:1.25rem}.bottom-nav button{font-size:.58rem;padding:.34rem .05rem .24rem;gap:.12rem;border-radius:.8rem}.bottom-nav button svg{width:16px;height:16px}}@media(max-width:380px){.bottom-nav{left:.3rem;right:.3rem;padding:.22rem;padding-bottom:calc(.22rem + env(safe-area-inset-bottom,0px))}.bottom-nav button{padding:.34rem 0 .24rem}.bottom-nav .bottom-nav-label{display:none}}.task-date-input::-webkit-calendar-picker-indicator,.task-date-input::-webkit-inner-spin-button,.task-date-input::-webkit-clear-button{display:none!important;-webkit-appearance:none!important;opacity:0!important;width:0!important;height:0!important;padding:0!important;margin:0!important}.task-date-input[type=date],.task-date-input[type=time]{-moz-appearance:textfield!important;appearance:textfield!important}.metadata-item{position:relative}.task-date-input{cursor:pointer;position:relative;z-index:1;outline:none!important;box-shadow:none!important}html,body,#root,*{scrollbar-width:thin;scrollbar-color:var(--accent-color, #6366f1) transparent}::-webkit-scrollbar{width:8px!important;height:8px!important;background-color:transparent!important}::-webkit-scrollbar-track{background:transparent!important}::-webkit-scrollbar-thumb{background-color:var(--accent-color, #6366f1)!important;border-radius:20px!important;border:2px solid transparent!important;background-clip:content-box!important}::-webkit-scrollbar-thumb:hover{background-color:var(--accent-color, #6366f1)!important;filter:brightness(1.2)!important}:root{accent-color:var(--accent-color, #6366f1)}input[type=checkbox].circle-checkbox{appearance:none;-webkit-appearance:none;width:20px;height:20px;flex-shrink:0;border-radius:50%;border:2px solid var(--border-color);cursor:pointer;background-color:transparent;margin:0}input[type=checkbox].circle-checkbox:checked{background-color:var(--accent-color);border-color:var(--accent-color)}@keyframes skeleton-pulse{0%,to{opacity:.6}50%{opacity:.95}}.skeleton-shimmer{background:var(--skeleton-base);animation:skeleton-pulse 1.8s infinite ease-in-out}.skeleton-pulse{animation:skeleton-pulse 1.8s ease-in-out infinite}.skeleton-box{display:inline-block;border-radius:.5rem}@media(prefers-reduced-motion:reduce){.skeleton-shimmer,.skeleton-pulse{animation:none!important;background:var(--skeleton-base)!important;opacity:.85}}.app-container{position:relative;z-index:1}body.style-riff{background-image:radial-gradient(color-mix(in srgb,var(--text-primary) var(--texture-opacity),transparent) 1px,transparent 1px);background-size:22px 22px;background-attachment:fixed}.card-container{border-width:var(--outline-width)!important;border-style:solid!important;border-radius:var(--card-radius)!important;box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--shadow-color)!important;background-clip:padding-box;transition:box-shadow .18s ease,background-color .18s ease,border-color .18s ease}.task-card.card-container{background-color:var(--task-card-bg)!important}.timer-card.card-container{background-color:var(--timer-bg)!important}.card-container h1,.card-container h2,.card-container h3,.card-container h4{font-family:var(--font-display);font-weight:var(--weight-heading);letter-spacing:-.02em}.card-container h5,.card-container h6{font-family:var(--font-body);font-weight:var(--weight-strong);letter-spacing:0}@media(hover:hover)and (pointer:fine){.card-container:hover{box-shadow:calc(var(--shadow-offset) + 2px) calc(var(--shadow-offset) + 2px) 0 var(--shadow-color)!important}}.page-header{background:var(--bg-card);border:var(--outline-width) solid var(--outline-color);border-radius:var(--card-radius);padding:.85rem 1.25rem!important;box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--shadow-color)}.page-header h1{font-family:var(--font-display);font-weight:var(--weight-heading)!important;letter-spacing:-.03em!important}@media(max-width:768px){.page-header{background:transparent;border-color:transparent;box-shadow:none;padding:.25rem 0!important}}.header-icon-btn,.settings-btn{width:40px;height:40px;border-radius:999px!important;align-items:center;justify-content:center;background:var(--bg-card);border:var(--outline-width) solid var(--outline-color)!important;box-shadow:var(--shadow-offset-sm) var(--shadow-offset-sm) 0 var(--shadow-color);color:var(--text-primary);transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}.header-icon-btn{display:inline-flex}.header-icon-btn:hover,.settings-btn:hover{background:var(--hover-bg);transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--shadow-color)}.header-icon-btn:active,.settings-btn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--shadow-color)}@media(max-width:768px){.header-icon-btn{width:36px;height:36px;box-shadow:none}}.settings-overlay{-webkit-backdrop-filter:none;backdrop-filter:none}.settings-dialog{background:var(--modal-bg)!important;border:var(--outline-width) solid var(--outline-color)!important;border-radius:calc(var(--card-radius) + .25rem)!important;box-shadow:calc(var(--shadow-offset) + 4px) calc(var(--shadow-offset) + 4px) 0 var(--shadow-color)!important}.settings-dialog-header{border-bottom:var(--border-subtle) solid var(--outline-color)!important}.settings-sidebar{border-right:var(--border-subtle) solid var(--outline-color);background:color-mix(in srgb,var(--bg-secondary) 70%,transparent)}.settings-sidebar button{border-width:var(--border-subtle)!important;border-style:solid!important}.riff-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:38px;padding:.55rem .95rem;border-radius:999px;border:var(--outline-width) solid var(--outline-color);background:var(--btn-secondary-bg);color:var(--btn-secondary-text);font-weight:var(--weight-strong);font-size:.82rem;box-shadow:var(--shadow-offset-sm) var(--shadow-offset-sm) 0 var(--shadow-color);transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}.riff-btn:hover{transform:translate(-1px,-1px);box-shadow:calc(var(--shadow-offset-sm) + 2px) calc(var(--shadow-offset-sm) + 2px) 0 var(--shadow-color);background:var(--hover-bg)}.riff-btn:active{transform:translate(1px,1px);box-shadow:0 0 0 var(--shadow-color)}.riff-btn:disabled,.riff-btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}.riff-btn:disabled:hover,.riff-btn[disabled]:hover{box-shadow:none;transform:none;background:var(--btn-secondary-bg)}.riff-btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text)}.riff-btn-primary:hover{background:var(--accent-hover)}.riff-btn-lime{background:var(--accent-alt);color:var(--text-primary)}.riff-btn-ghost{background:transparent;color:var(--text-primary);box-shadow:none}.riff-btn-ghost:hover{background:var(--hover-bg);box-shadow:none;transform:none}.auth-screen{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;overflow-y:auto;padding:5.5rem 1.25rem 2.5rem;background:var(--bg-primary);color:var(--text-primary)}.style-riff .auth-screen{background-image:radial-gradient(color-mix(in srgb,var(--text-primary) var(--texture-opacity),transparent) 1px,transparent 1px);background-size:22px 22px;background-attachment:fixed}.auth-screen .doodle-layer{z-index:0}.auth-brand{position:absolute;top:1.5rem;left:1.5rem;z-index:2;display:flex;align-items:center;gap:.55rem}.auth-wordmark{font-family:var(--font-display);font-weight:800;font-size:1.45rem;letter-spacing:-.04em}.auth-card{position:relative;z-index:1;width:100%;max-width:420px;padding:var(--card-padding);background:var(--bg-card);border-color:var(--outline-color);color:var(--text-primary)}.auth-heading{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1.25rem}.auth-kicker{color:var(--accent-color);font-size:.65rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.auth-title{margin:0;font-family:var(--font-display);font-weight:var(--weight-heading);font-size:1.65rem;letter-spacing:-.03em;line-height:1.08}.auth-subtitle{margin:.15rem 0 0;color:var(--text-secondary);font-size:.82rem;line-height:1.45}.auth-error{margin:0 0 1rem;padding:.6rem .75rem;border:var(--border-subtle) solid color-mix(in srgb,var(--danger-color) 45%,var(--border-color));border-radius:.75rem;background:color-mix(in srgb,var(--danger-color) 10%,var(--bg-card));color:var(--danger-color);font-size:.8rem;text-align:center}.auth-form{display:flex;flex-direction:column;gap:.8rem}.auth-input{width:100%;padding:.8rem .95rem;border-radius:.9rem;font-size:.9rem}.auth-submit{width:100%;min-height:48px;margin-top:.2rem;font-size:.88rem}.auth-switch{margin:1.25rem 0 0;color:var(--text-secondary);font-size:.8rem;text-align:center}.auth-link{margin-left:.35rem;padding:0;background:none;border:0;color:var(--accent-color);font-weight:700;text-decoration:underline;text-underline-offset:2px}.auth-link:hover{color:var(--accent-hover)}@media(max-width:600px){.auth-screen{align-items:flex-start;padding:5rem 1rem 2rem}.auth-brand{top:1rem;left:1rem}.auth-wordmark{font-size:1.25rem}.auth-card{padding:1.35rem}}@media(max-height:640px){.auth-screen{align-items:flex-start}}.riff-chip{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .7rem;border-radius:999px;border:var(--border-subtle) solid var(--border-color);background:var(--bg-secondary);color:var(--text-secondary);font-size:var(--meta-size);font-weight:var(--weight-strong);letter-spacing:.02em}.riff-inset{border-radius:var(--radius);border:var(--border-subtle) solid var(--border-color);background:var(--bg-secondary)}.riff-divider{height:0;border-top:var(--border-subtle) solid var(--border-color);opacity:.7}.riff-input{background:var(--input-bg);border:var(--border-subtle) solid var(--input-border);border-radius:.75rem;color:var(--text-primary);padding:.55rem .7rem;font-size:.82rem}.riff-input:focus{border-color:var(--focus-ring);outline:2px solid var(--focus-ring);outline-offset:1px}.doodle-layer{display:none;position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:var(--decoration-opacity)}.style-riff .doodle-layer{display:block}.doodle-layer svg{position:absolute;opacity:1}.intensity-soft .doodle-layer svg:nth-child(n+3){display:none}.intensity-balanced .doodle-layer svg:nth-child(n+5){display:none}@media(max-width:1100px){.doodle-layer{display:none!important}}.theme-preview-card{border:var(--outline-width) solid var(--outline-color);border-radius:var(--card-radius);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--shadow-color);overflow:hidden}.theme-token-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.65rem;align-items:center;padding:.6rem .7rem;border-radius:.9rem;border:var(--border-subtle) solid var(--border-color);background:var(--bg-card)}.theme-token-row:hover{border-color:var(--accent-color)}.theme-token-swatch{width:30px;height:30px;border-radius:.55rem;border:var(--border-subtle) solid var(--border-color);flex-shrink:0;cursor:pointer}.theme-token-hex{width:92px;padding:.35rem .45rem;border-radius:.55rem;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text-primary);font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.72rem;text-transform:lowercase}.theme-token-reset{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid transparent;color:var(--text-secondary);background:transparent}.theme-token-reset:hover{color:var(--text-primary);background:var(--hover-bg);border-color:var(--border-color)}.theme-token-reset:disabled{opacity:.35;cursor:not-allowed}.theme-group-chip{padding:.4rem .8rem;border-radius:999px;border:var(--border-subtle) solid var(--border-color);background:var(--bg-secondary);color:var(--text-secondary);font-size:.75rem;font-weight:700;white-space:nowrap}.theme-group-chip[data-active=true]{background:var(--nav-active-bg);color:var(--nav-active-text);border-color:var(--outline-color)}.theme-group-chip:disabled{opacity:.4;cursor:not-allowed}.theme-preset-card{text-align:left;padding:.85rem;border-radius:var(--radius);border:var(--border-subtle) solid var(--border-color);background:var(--bg-card);box-shadow:var(--shadow-offset-sm) var(--shadow-offset-sm) 0 var(--shadow-color);transition:transform .15s ease,box-shadow .15s ease}.theme-preset-card:hover{transform:translate(-1px,-1px);box-shadow:calc(var(--shadow-offset-sm) + 2px) calc(var(--shadow-offset-sm) + 2px) 0 var(--shadow-color)}.theme-preset-card[data-active=true]{border-color:var(--accent-color);border-width:var(--border-strong)}:where(button,[role=button],a,input,textarea,select):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}@media(prefers-reduced-motion:reduce){.card-container,.riff-btn,.header-icon-btn,.theme-preset-card{transition:none!important}.card-container:hover,.riff-btn:hover,.header-icon-btn:hover,.settings-btn:hover,.theme-preset-card:hover{transform:none!important}}