html,body,#root{height:100%;margin:0;padding:0}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#ffeef5}:root{--bg: #ffeef5;--sidebar-bg: #ffe0f0;--card-bg: #ffc9e6;--card-active: #ff7fb8;--accent: #ff7fb8;--text-main: #77455a;--accent-soft: rgba(255, 127, 184, .4);--accent-shadow: rgba(255, 127, 184, .3);--line-bg: #ffe5f3;--line-gradient-start: #ff7fb8;--line-gradient-end: #ffb1d6;--button-bg: #ffd1ea;--button-bg-hover: #ffb7dd;--prompt-bg: rgba(255, 209, 234, .9);--set-card-bg: rgba(255, 201, 230, .65);--set-card-bg-hover: rgba(255, 201, 230, .8);--control-bg: var(--button-bg);--control-bg-hover: var(--button-bg-hover);--control-text: var(--text-main);--menu-bg: rgba(255, 255, 255, .6);--menu-item-bg: rgba(255, 255, 255, .55);--menu-item-hover: rgba(255, 255, 255, .78)}*,*:before,*:after{box-sizing:border-box}html,body{height:100%;margin:0}.app-shell{height:calc(100vh / 1.8);zoom:1.8;display:grid;grid-template-columns:260px 1fr;grid-template-rows:1fr auto;grid-template-areas:"sidebar main" "footer footer";background:var(--bg);color:var(--text-main);font-family:Red Hat Text,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.sidebar{grid-area:sidebar;background:var(--sidebar-bg);padding:16px;display:flex;flex-direction:column;gap:16px}.sidebar-header{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.2rem}.app-emoji{font-size:1.5rem}.timer-list{display:flex;flex-direction:column;gap:8px}.timer-card{border:none;border-radius:12px;background:var(--card-bg);padding:10px 12px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:4px;transition:transform .1s ease,background .1s ease}.timer-card:hover{transform:translateY(-1px)}.timer-card--active{background:var(--card-active)}.timer-card-name{font-weight:600}.timer-card-duration{font-size:.8rem;opacity:.8}.set-picker{border-radius:12px;padding:0;margin-bottom:-8px}.set-picker:hover{background:none}.set-picker-row{display:flex;align-items:center;gap:8px}.set-picker-button{flex:1;min-width:0;border:none;border-radius:10px;padding:6px 10px 6px 16px;background:var(--set-card-bg);color:var(--control-text);font-weight:700;font-size:.9rem;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;outline:none}.set-picker-button:hover{background:var(--control-bg-hover)}.set-picker-button:focus{outline:none}.set-picker-button-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.set-picker-caret{opacity:.9;transform:translateY(-1px);transition:transform .15s ease}.set-picker-caret.is-open{transform:rotate(180deg)}.set-picker-actions{display:flex;gap:6px;margin-left:auto}.set-action-button{border:none;border-radius:10px;padding:6px 10px;background:var(--set-card-bg);color:var(--control-text);cursor:pointer;font-weight:700;font-size:.9rem;display:flex;align-items:center;align-self:stretch}.set-action-button:hover:not(:disabled){background:var(--control-bg-hover)}.set-action-button:disabled{opacity:.5;cursor:default}.set-picker-menu{margin-top:8px;border-radius:12px;padding:6px;background:var(--menu-bg);display:flex;flex-direction:column;gap:4px}.set-picker-item{display:flex;align-items:center;justify-content:space-between;gap:10px}.set-picker-item:hover,.set-picker-item.is-highlighted{box-shadow:none}.set-picker-item.is-active .set-picker-item-name{color:var(--control-text)}.set-picker-item-label{display:flex;align-items:center;gap:4px;margin-left:10px}.set-picker-item-star{color:var(--accent);font-size:.7rem;flex-shrink:0}.set-picker-item-name{width:80px;flex-shrink:0;font-size:.85rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 4px;border:none;background:transparent;color:var(--text-main);outline:none;border-radius:6px;text-align:left}.set-picker-item-name:focus{background:var(--bg)}.set-picker-item-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.set-item-action{border:none;border-radius:10px;padding:4px 8px;background:var(--control-bg);color:var(--control-text);cursor:pointer;font-weight:800;line-height:1}.set-item-action:hover:not(:disabled){background:var(--control-bg-hover)}.set-item-action:disabled{opacity:.45;cursor:default}.set-item-action--danger:hover:not(:disabled){box-shadow:0 0 0 2px var(--accent-soft)}.main-view{grid-area:main;padding:16px 24px;display:flex;align-items:flex-start;justify-content:flex-start}.timer-view{width:100%;max-width:720px}.timer-view-title{margin-top:0;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center}.footer{grid-area:footer;background:var(--footer-bg);padding:8px 16px}.footer-content{display:flex;align-items:center;gap:8px;font-size:.9rem}.theme-badge{border:none;border-radius:999px;padding:4px 10px;cursor:pointer;font-size:.85rem;transition:background .15s ease,color .15s ease,transform .15s ease}.theme-badge--active{transform:scale(1.07);color:#fff!important}@media(max-width:768px){.app-shell{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"sidebar" "main" "footer"}.sidebar{flex-direction:row;align-items:center;gap:12px;overflow-x:auto}.timer-list{flex-direction:row;margin-top:0}.timer-card{min-width:120px}}.timer-line-wrapper{margin-bottom:16px;padding-top:10px}.timer-line{position:relative;height:12px;border-radius:999px;background:var(--line-bg);overflow:visible}.timer-line-progress{position:absolute;top:0;left:0;bottom:0;border-radius:999px;background:linear-gradient(90deg,var(--line-gradient-start),var(--line-gradient-end));transition:width .1s linear}.timer-emoji{position:absolute;top:50%;transform:translate(-40%,-60%);font-size:2rem;line-height:1;transition:left .1s linear;pointer-events:none}.timer-emoji-inner{display:block}.timer-time-display{font-size:2.4rem;font-weight:700;text-align:left;margin-bottom:16px}.timer-controls{display:flex;gap:8px}.timer-controls button{border:none;border-radius:999px;padding:6px 14px;background:var(--control-bg);cursor:pointer;font-size:.9rem;color:var(--control-text)}.timer-controls button:hover{background:var(--control-bg-hover);color:var(--control-text)}.timer-card-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px;width:100%}.timer-name-input{flex:1;min-width:0;border:none;background:transparent;font-weight:600;font-size:.9rem;color:var(--text-main);outline:none;padding:2px 4px;border-radius:6px}.timer-name-input:focus{background:var(--bg);outline:none}.timer-duration-wrapper{display:flex;align-items:center;gap:4px;background:var(--sidebar-bg);border-radius:999px;padding:2px 8px;flex-shrink:0}.timer-duration-input{width:2.8rem;border:none;background:transparent;text-align:right;font-size:.8rem;color:var(--text-main);outline:none;padding:0;-moz-appearance:textfield}.timer-duration-input::-webkit-outer-spin-button,.timer-duration-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.timer-duration-label{font-size:.75rem;opacity:.8}.add-timer-button{margin-top:-8px;border:none;border-radius:999px;padding:6px 10px;background:var(--set-card-bg);cursor:pointer;font-size:.8rem;font-weight:500;color:var(--control-text)}.add-timer-button:hover:not(:disabled){background:var(--control-bg-hover)}.add-timer-button:disabled{opacity:.5;cursor:default}.delete-timer-button{border:none;background:transparent;color:var(--text-main);font-size:1rem;line-height:1;padding:0 4px;cursor:pointer;flex-shrink:0;opacity:.7;transition:opacity .15s ease}.delete-timer-button:hover{opacity:1}.timer-card.timer-card--dragging{opacity:.6}.timer-card.timer-card--over{outline:none}.next-timer-prompt{margin-top:12px;padding:8px 10px;border-radius:12px;background:var(--card-bg);font-size:.85rem;display:flex;align-items:center;justify-content:space-between;gap:8px}.next-timer-prompt-buttons{display:flex;gap:6px;color:var(--text-main)}.next-timer-prompt-buttons button{border:none;border-radius:999px;padding:4px 10px;font-size:.8rem;cursor:pointer;background:var(--control-bg);color:var(--control-text)}.next-timer-prompt-buttons button:hover{background:var(--control-bg-hover)}.data-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:12px}.data-action-button{border:none;border-radius:8px;padding:4px 8px;background:transparent;color:var(--card-active);cursor:pointer;font-size:.75rem;opacity:.5;transition:opacity .15s ease,background .15s ease}.data-action-button:hover{opacity:1;background:var(--control-bg)}@keyframes emoji-bounce{0%{transform:translateY(0) scale(1)}35%{transform:translateY(-6px) scale(1.15)}70%{transform:translateY(-2px) scale(1.05)}to{transform:translateY(0) scale(1)}}.timer-emoji-inner.bounce-start,.timer-emoji-inner.bounce-end{animation:emoji-bounce .5s ease-out;animation-fill-mode:none}.app-shell.theme-sakura{--bg: #FAEBEE;--sidebar-bg: #FCDDE2;--footer-bg: #ffe8eb;--card-bg: #FAC2C5;--set-card-bg: #FFD0D8;--set-card-bg-hover: rgba(250, 194, 197, .8);--card-active: #F88C96;--accent: #FAA0A6;--accent-strong: #F88C96;--accent-soft: rgba(250, 160, 166, .4);--accent-shadow: rgba(119, 69, 90, .25);--text-main: #77455a;--control-text: #77455a;--button-bg: #FFD0D8;--button-bg-hover: #FAC2C5;--control-bg: var(--button-bg);--control-bg-hover: var(--button-bg-hover);--prompt-bg: rgba(250, 235, 238, .92);--menu-bg: #FFD0D8;--menu-item-bg: #FFD0D8;--menu-item-hover: rgba(252, 221, 226, .9);--line-bg: #FCDDE2;--line-gradient-start: #F88C96;--line-gradient-mid: #f1a9b0;--line-gradient-end: #FAC2C5}.theme-badge--sakura{background:linear-gradient(90deg,#fac2c5,#faa0a6);color:#77455a}.theme-badge--sakura:hover{background:linear-gradient(90deg,#fac2c5,#fac2c5)}.app-shell.theme-sprout{--bg: #F3F5DD;--sidebar-bg: #E6EBC4;--footer-bg: #ebefd3;--card-bg: #DDE2A4;--set-card-bg: #e1e6ad;--set-card-bg-hover: rgba(221, 226, 164, .85);--card-active: #C7CF8E;--accent: #5E7A58;--accent-strong: #476144;--accent-soft: rgba(94, 122, 88, .35);--accent-shadow: rgba(47, 58, 26, .22);--text-main: #3A4F36;--control-text: #3A4F36;--button-bg: #EDF0CC;--button-bg-hover: #DDE2A4;--control-bg: var(--button-bg);--control-bg-hover: var(--button-bg-hover);--prompt-bg: rgba(243, 245, 221, .92);--menu-bg: #EDF0CC;--menu-item-bg: #EDF0CC;--menu-item-hover: rgba(243, 245, 221, .9);--line-bg: #E6EBC4;--line-gradient-start: #A9B57E;--line-gradient-mid: #A9B57E;--line-gradient-end: #cacf9d}.theme-badge--sprout{background:linear-gradient(90deg,#dde2a4,#a9b57e);color:#476144}.theme-badge--sprout:hover{background:linear-gradient(180deg,#dde2a4,#dde2a4)}.app-shell.theme-hyacinth{--bg: #F4F1FA;--sidebar-bg: #CDC1E3;--footer-bg: #DED7EE;--card-bg: #BFB2D8;--set-card-bg: rgba(202, 230, 224, .72);--set-card-bg-hover: rgba(202, 230, 224, .88);--card-active: #9B87A8;--accent: #9B87A8;--accent-strong: #734873;--accent-soft: rgba(202, 230, 224, .45);--accent-shadow: rgba(109, 8, 81, .22);--text-main: #6D0851;--control-text: #6D0851;--button-bg: #DAD2EA;--button-bg-hover: #BFB2D8;--control-bg: var(--button-bg);--control-bg-hover: var(--button-bg-hover);--prompt-bg: rgba(244, 241, 250, .92);--menu-bg: #DAD2EA;--menu-item-bg: #DAD2EA;--menu-item-hover: rgba(244, 241, 250, .9);--line-bg: #CDC1E3;--line-gradient-start: #9B87A8;--line-gradient-mid: #9B87A8;--line-gradient-end: #CAE6E0}.theme-badge--hyacinth{background:linear-gradient(90deg,#cdc1e3,#9b87a8);color:#6d0851}.theme-badge--hyacinth:hover{background:linear-gradient(90deg,#cdc1e3,#cdc1e3)}.app-shell.theme-unicorn{--bg: #F4FAFF;--sidebar-bg: #ABE4FF;--footer-bg: #FFF6D6;--card-bg: #FFDAAB;--set-card-bg: #FFABAB;--set-card-bg-hover: var(--set-card-bg);--card-active: #D9ABFF;--accent: #D9ABFF;--accent-strong: #B98BFF;--accent-soft: rgba(217, 171, 255, .35);--accent-shadow: rgba(58, 46, 66, .22);--text-main: #3A2E42;--control-text: #3A2E42;--button-bg: #DDFFAB;--button-bg-hover: #CFF29B;--control-bg: var(--button-bg);--control-bg-hover: var(--button-bg-hover);--prompt-bg: rgba(244, 250, 255, .92);--menu-bg: #DDFFAB;--menu-item-bg: #DDFFAB;--menu-item-hover: rgba(171, 228, 255, .85);--line-bg: #ABE4FF;--line-gradient-start: #DDFFAB;--line-gradient-mid: #FFDAAB;--line-gradient-end: #FFABAB}.theme-badge--unicorn{background:linear-gradient(90deg,#ffabab,#d9abff);color:#3a2e42}.theme-badge--unicorn:hover{background:linear-gradient(90deg,#ffabab,#ffabab)}.app-shell.theme-night{--bg: #2B222C;--sidebar-bg: #352A35;--footer-bg: #302631;--card-bg: #3B2E3C;--set-card-bg: #3F3240;--set-card-bg-hover: var(--set-card-bg);--card-active: #5E4352;--accent: #F2D974;--accent-strong: #F2D974;--accent-soft: rgba(242, 217, 116, .35);--accent-shadow: rgba(94, 67, 82, .35);--text-main: #EADFB8;--control-text: #EADFB8;--button-bg: #3A2E3C;--button-bg-hover: #5E4352;--control-bg: var(--button-bg);--control-bg-hover: var(--button-bg-hover);--prompt-bg: rgba(43, 34, 44, .92);--menu-bg: #3A2E3C;--menu-item-bg: #3A2E3C;--menu-item-hover: rgba(94, 67, 82, .55);--line-bg: #352A35;--line-gradient-start: #5E4352;--line-gradient-mid: #5E4352;--line-gradient-end: #3B2E3C}.theme-badge--night{background:linear-gradient(90deg,#3b2e3c,#5e4352);color:#eadfb8}.theme-badge--night:hover{background:linear-gradient(90deg,#3b2e3c,#3b2e3c)}.app-shell.theme-cosmic{--bg: #040B14;--sidebar-bg: #081828;--footer-bg: #030811;--card-bg: #0A1F34;--set-card-bg: #0C2238;--set-card-bg-hover: var(--set-card-bg);--card-active: #2E2550;--accent: #5FA8E8;--accent-strong: #4B8FCC;--accent-soft: rgba(95, 168, 232, .35);--accent-shadow: rgba(107, 79, 163, .45);--text-main: #C2D3E1;--control-text: #C2D3E1;--button-bg: #0F2A46;--button-bg-hover: #1B3C63;--control-bg: var(--button-bg);--control-bg-hover: #2E2550;--prompt-bg: rgba(4, 11, 20, .94);--menu-bg: #0F2A46;--menu-item-bg: #0F2A46;--menu-item-hover: rgba(107, 79, 163, .45);--line-bg: #081828;--line-gradient-start: #2E2550;--line-gradient-mid: #2E2550;--line-gradient-end: #314963}.theme-badge--cosmic{background:linear-gradient(90deg,#0a1f34,#1b3c63);color:#c2d3e1}.theme-badge--cosmic:hover{background:linear-gradient(90deg,#0a1f34,#0a1f34)}.app-shell.theme-oracle{--bg: #070514;--sidebar-bg: #0C0720;--footer-bg: #050310;--card-bg: #120A2B;--set-card-bg: #140C33;--set-card-bg-hover: var(--set-card-bg);--card-active: #2A1460;--accent: #A970FF;--accent-strong: #B86CFF;--accent-soft: rgba(169, 112, 255, .35);--accent-shadow: rgba(72, 214, 255, .22);--text-main: #E7D8FF;--control-text: #E7D8FF;--button-bg: #1A0F3A;--button-bg-hover: #251658;--control-bg: var(--button-bg);--control-bg-hover: #2A1460;--prompt-bg: rgba(7, 5, 20, .94);--menu-bg: #1A0F3A;--menu-item-bg: #1A0F3A;--menu-item-hover: rgba(255, 88, 180, .28);--line-bg: #0C0720;--line-gradient-start: #2A1460;--line-gradient-mid: #1DD6C6;--line-gradient-end: #B86CFF}.theme-badge--oracle{background:linear-gradient(90deg,#2a1460,#b86cff);color:#e7d8ff}.theme-badge--oracle:hover{background:linear-gradient(90deg,#2a1460,#2a1460)}.app-shell.theme-grove{--bg: #172214;--sidebar-bg: #1C2918;--footer-bg: #121B11;--card-bg: #24301E;--set-card-bg: #283523;--set-card-bg-hover: var(--set-card-bg);--card-active: #44522F;--accent: #718351;--accent-strong: #9AAB9B;--accent-soft: rgba(113, 131, 81, .35);--accent-shadow: rgba(122, 63, 74, .35);--text-main: #D9E3D5;--control-text: #D9E3D5;--button-bg: #2E3A27;--button-bg-hover: #3A4731;--control-bg: var(--button-bg);--control-bg-hover: #44522F;--prompt-bg: rgba(23, 34, 20, .94);--menu-bg: #2E3A27;--menu-item-bg: #2E3A27;--menu-item-hover: rgba(122, 63, 74, .4);--line-bg: #1C2918;--line-gradient-start: #44522F;--line-gradient-mid: #718351;--line-gradient-end: #9AAB9B}.theme-badge--grove{background:linear-gradient(90deg,#24301e,#44522f,#718351);color:#d9e3d5}.theme-badge--grove:hover{background:linear-gradient(90deg,#24301e,#24301e)}
