:root{font-family:Space Grotesk,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@keyframes shimmer{0%{left:-100%}to{left:100%}}.skeleton{animation:shimmer 2s infinite linear;background:linear-gradient(to right,#f6f7f8 4%,#edeef1 25%,#f6f7f8 36%);background-size:1000px 100%;border:3px solid black;border-radius:12px}.skeleton-categories-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;margin-top:20px;margin-bottom:20px;max-width:100%}.skeleton-category-item{height:46px;padding:10px 15px;border-radius:12px;position:relative;overflow:hidden;background:#e0e0e0}.skeleton-category-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,#ffffff 50%,transparent 100%);animation:shimmer 1.5s ease-in-out infinite}.skeleton-timer-list{display:flex;flex-direction:column;gap:12px;margin-top:20px;width:100%}.skeleton-timer-item{height:60px;padding:10px 15px;border-radius:12px;position:relative;overflow:hidden;background:#e0e0e0}.skeleton-timer-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,#ffffff 50%,transparent 100%);animation:shimmer 1.5s ease-in-out infinite}@keyframes load{0%{transform:translate(0)}to{transform:translate(calc(300px + 100%))}}.page{padding-bottom:100px}.categories-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;margin-top:20px;margin-bottom:20px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#fff;padding:20px;border-radius:8px;width:90%;max-width:500px;border:3px solid black;box-shadow:6px 6px #000}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h2{margin:0;font-size:20px;color:#000}.modal-close{background:none;border:none;font-size:24px;cursor:pointer;padding:0;color:#000}.modal-close:hover{color:#000}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;color:#666;font-weight:500}.form-group input{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:16px}.form-group input:focus{outline:none}.color-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:8px}.color-option{width:30px;height:30px;border:none;border-radius:4px;cursor:pointer;transition:transform .2s}.color-option:hover{transform:scale(1.1)}.color-option.selected{box-shadow:0 0 0 2px #fff,0 0 0 4px #4caf50}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}.error-message{color:#ff4d4d;margin:10px 0;padding:10px;background-color:#ffe6e6;border-radius:4px}.auth-container{display:flex;justify-content:center;align-items:center;height:100dvh;padding-top:20px;overflow:hidden;position:fixed;top:0;left:0;right:0;bottom:0}.auth-box{width:100%;max-width:400px;padding:24px;display:flex;flex-direction:column;align-items:center;overflow:hidden}.auth-title{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;color:#000;line-height:1.2;text-align:center}.auth-description{font-size:1.2rem;color:#000000b3;margin-bottom:3rem;font-weight:500;text-align:center}.loading-container{display:flex;justify-content:center;align-items:center;min-height:100vh}.loading-spinner{width:50px;height:50px;border:5px solid #f3f3f3;border-top:5px solid #C4A1FF;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.statistics-container{max-width:800px;margin:0 auto}.statistics-container h2{text-align:center;color:#333;font-size:18px;font-weight:600}.pie-chart-container{margin-bottom:20px}.chart-wrapper{position:relative;height:400px}.statistics-loading,.statistics-error,.statistics-empty{text-align:center;padding:40px 20px;color:#666;background:#fff;border-radius:16px;border:3px solid #333;margin-top:20px}.statistics-error{color:#c62828;background-color:#ffebee;border-color:#e57373}.statistics-empty{color:#757575}.statistics-loading p,.statistics-error p,.statistics-empty p{margin:0 0 10px;font-weight:500}.statistics-empty p:last-child{margin-bottom:0;font-size:14px;opacity:.8}.categories-table-container{background:#fff;border-radius:16px;padding:24px;border:3px solid #333}.categories-table{width:100%}.table-header{display:grid;grid-template-columns:1fr 70px 50px;gap:16px;margin-bottom:12px;padding-bottom:12px;border-bottom:2px solid #333}.header-cell{font-weight:600;color:#333;font-size:12px;text-transform:uppercase;letter-spacing:.5px;text-align:start}.table-body{display:flex;flex-direction:column;gap:8px}.table-row{display:grid;grid-template-columns:1fr 70px 50px;gap:16px;border-bottom:1px solid #eee;align-items:center}.table-row:last-child{border-bottom:none}.category-cell{display:flex;align-items:center;gap:12px}.category-color{width:16px;height:16px;border-radius:50%;border:2px solid #333;flex-shrink:0}.category-emoji{font-size:16px;flex-shrink:0}.category-name{font-weight:500;color:#333;font-size:14px}.duration-cell{display:flex;flex-direction:column;align-items:flex-start;text-align:right}.duration-hours{font-weight:600;color:#333;font-size:16px}.duration-percentage{font-size:12px;color:#666;margin-top:2px}.rating-cell{display:flex;align-items:start;justify-content:flex-start;min-width:40px}@media (max-width: 768px){.statistics-container,.categories-table-container{padding:16px}.chart-wrapper{height:300px}.category-cell{gap:8px}.category-name{font-size:13px}.duration-hours{font-size:14px}.total-time-value{font-size:24px}.total-time-label{font-size:12px}.rating-cell{min-width:32px}.statistics-loading,.statistics-error,.statistics-empty{padding:30px 16px}}body{margin:0;padding:0;width:100vw;height:100dvh;overflow:hidden;color:#000;position:relative;background-color:#f5f5f5}:root{--safe-area-inset-top: env(safe-area-inset-top, 0px);--safe-area-inset-right: env(safe-area-inset-right, 0px);--safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);--safe-area-inset-left: env(safe-area-inset-left, 0px);--footer-height: calc(70px + var(--safe-area-inset-bottom))}body:before{content:"";position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#f4ebe7;z-index:-1}#root{width:100vw;height:100vh;display:flex;overflow:hidden;color:#000;position:relative}.app-container{width:100%;max-width:480px;margin:0 auto;height:100dvh;display:flex;flex-direction:column;position:relative;color:#000;overflow:hidden;padding:var(--safe-area-inset-top) var(--safe-area-inset-right) 0 var(--safe-area-inset-left);padding-left:max(1rem,var(--safe-area-inset-left));padding-right:max(1rem,var(--safe-area-inset-right));background-color:#f4ebe7}.header{height:64px;position:fixed;top:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;background-color:#ffffffe6;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:1rem;border-bottom:3px solid black;z-index:10;color:#000}.header-content{display:flex;justify-content:space-between;align-items:center;height:100%;width:100%}.header h1{margin:0;font-size:1.5rem;font-weight:900;color:#000}.content{flex:1;width:calc(100% + 2rem);margin:0 -1rem;overflow-y:auto;padding:1rem;scrollbar-width:none;-ms-overflow-style:none;color:#000;position:relative;height:calc(100dvh - var(--footer-height));padding-bottom:calc(var(--footer-height))}.content::-webkit-scrollbar{display:none}.page{min-height:100%;width:100%;position:relative;padding-bottom:1rem;display:flex;flex-direction:column}.page::-webkit-scrollbar{display:none}.page h2{margin-bottom:1.5rem;font-size:1.5rem;font-weight:700}.categories-list{display:flex;flex-direction:column;gap:.5rem;width:100%}.category-item{display:flex;align-items:center;padding:.5rem .75rem;border:3px solid black;border-radius:8px;width:100%;color:#000;cursor:pointer;transition:transform .1s,box-shadow .1s}.category-item:hover{transform:translateY(-2px);box-shadow:4px 4px #000}.category-item:active{transform:translate(4px,4px);box-shadow:none}.category-emoji{font-size:1.25rem;margin-right:.75rem}.category-name{font-size:.875rem;font-weight:700;color:#000}.footer{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;height:80px;background-color:#fff;padding:0;z-index:100;border-top:3px solid #000000}.nav{display:flex;justify-content:space-between;align-items:center;height:100%;width:100%;padding:0 1.5rem}.nav-button{color:#666;padding:8px;transition:color .2s ease;border:none;background:none;display:flex;align-items:center;justify-content:center}.nav-button svg{width:48px;height:48px}.nav-button-active{color:#65d1c9}.nav-button:disabled{opacity:.5;cursor:not-allowed}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#fffffff2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:1rem;border:3px solid black;border-radius:12px;box-shadow:6px 6px #000;width:90%;max-width:460px;max-height:90vh;overflow-y:auto;color:#000}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.modal-header h2{margin:0;font-size:1.5rem;font-weight:700;color:#000}.modal-close{background:none;border:none;font-size:2rem;cursor:pointer;padding:0;line-height:1;color:#000}.add-category-form{display:flex;flex-direction:column;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.35rem}.form-group-enjoyment{display:flex;flex-direction:column;gap:.35rem;align-items:start}.form-group-enjoyment label,.form-group label{font-weight:700;color:#000;font-size:.875rem}.form-group input{padding:.5rem;border:3px solid black;border-radius:8px;font-size:1rem;background-color:#fff;color:#000}.form-group input::placeholder{color:#666;opacity:.8}.color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:.35rem}.color-option{width:40px;height:40px;border:3px solid black;border-radius:8px;cursor:pointer;padding:0}.color-option.selected{box-shadow:0 0 0 3px #000,0 0 0 6px #fff,0 0 0 8px #000}.form-actions{display:flex;gap:.75rem;margin-top:.75rem}.form-actions button{flex:1;padding:.75rem;border:3px solid black;border-radius:8px;font-weight:700;cursor:pointer;transition:transform .1s,box-shadow .1s;color:#000}.cancel-button{background-color:#fff;box-shadow:4px 4px #000}.submit-button{background-color:#65d1c9;box-shadow:4px 4px #000;color:#000}.cancel-button:active,.submit-button:active{transform:translate(4px,4px);box-shadow:none}.calendar-header{display:flex;flex-direction:column;gap:.75rem}.week-navigation{display:flex;align-items:center;justify-content:space-between}.week-navigation h2{margin:0;font-size:1.25rem;font-weight:700;color:#000;text-align:center;line-height:1.4;flex:1;padding:0 1rem}.days-tabs{display:flex;justify-content:space-between;margin:1rem 0;width:100%}.timer-content{display:flex;flex-direction:column;align-items:center;width:100%}.active-timer-container{display:flex;flex-direction:column;width:100%;gap:1rem;margin-top:.25rem}.timer-block{display:flex;align-items:center;gap:1rem;width:60%;background-color:#fffc;border:3px solid black;border-radius:8px;box-shadow:4px 4px #000}.timer-display{flex:1;font-size:2.3rem;font-weight:700;font-family:monospace;color:#000;text-align:center}.period-time{font-size:.875rem;color:#000000b3}.periods-history{width:100%;display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem}.period-item{display:flex;align-items:center;padding:.5rem;background:#fffc;border:3px solid black;border-radius:8px;gap:1rem}.period-item-editable{cursor:pointer;transition:transform .1s,box-shadow .1s}.period-item-editable:hover{transform:translateY(-2px);box-shadow:4px 4px #000}.period-category{display:flex;align-items:center;gap:.5rem;flex:1}.period-emoji{font-size:1.25rem}.period-name-container{display:flex;flex-direction:column;word-break:break-all}.period-name{font-weight:600}.period-duration{font-size:.75rem;color:#0009;font-weight:500}.period-time-container{display:flex;flex-direction:column;align-items:center;gap:.25rem}.period-time{font-family:monospace;font-size:.75rem;font-weight:600;padding:.25rem;background-color:#0000001a;border-radius:4px;white-space:nowrap}.period-timespan{font-size:.75rem;color:#0009;padding-left:2.25rem}.category-selection{display:flex;flex-direction:column;gap:1rem}.category-selection-title{font-size:1rem;font-weight:600;color:#666;margin-bottom:.5rem}.category-selection-form{display:flex;flex-direction:column;gap:1rem}.category-selection-list{display:flex;flex-direction:column;gap:.5rem}.category-selection-item{padding:.75rem;border:3px solid black;border-radius:12px;cursor:pointer;transition:transform .1s,box-shadow .1s;margin-bottom:0;color:#000}.category-selection-item:hover{transform:translateY(-2px);box-shadow:4px 4px #000}.category-selection-item:active{transform:translate(4px,4px);box-shadow:none}.empty-periods{width:100%;padding:2rem;text-align:center;color:#666;font-size:1rem;border:3px dashed #ccc;border-radius:12px;margin-top:2rem}.empty-periods-text{font-weight:500;line-height:1.5}.motivational-tip{text-align:center;color:#666;font-size:.875rem;line-height:1.4;margin-top:.75rem;padding:.75rem;background-color:#0000000d;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border-radius:8px;font-style:italic;position:relative}.tip-close-button{position:absolute;top:.5rem;right:.5rem;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:none;background:none;color:#999;font-size:1rem;cursor:pointer;padding:0;opacity:.6;transition:opacity .2s}.tip-close-button:hover{opacity:1}@media screen and (max-width: 375px){.timer-display{font-size:2rem}.period-time{font-size:.75rem}}.category-select{position:relative;width:100%}.category-select-trigger{display:flex;align-items:center;justify-content:space-between;padding:.75rem;border:3px solid black;border-radius:12px;background-color:#fff;cursor:pointer;transition:transform .1s,box-shadow .1s;box-shadow:4px 4px #000;color:#000;font-weight:600;min-height:48px}.category-select-trigger:hover{transform:translateY(-2px);box-shadow:6px 6px #000}.category-select-trigger:active,.category-select-trigger.open{transform:translate(4px,4px);box-shadow:none}.category-select-trigger:focus{outline:none;box-shadow:0 0 0 3px #65d1c94d,4px 4px #000}.category-select-trigger.open:focus{box-shadow:0 0 0 3px #65d1c94d}.category-select-value{display:flex;align-items:center;gap:.5rem;flex:1}.category-select-color{width:16px;height:16px;border-radius:4px;border:2px solid black;flex-shrink:0}.category-select-emoji{font-size:1.25rem;flex-shrink:0}.category-select-name{font-size:.875rem;font-weight:700;color:#000;flex:1}.category-select-placeholder{color:#666;font-size:.875rem;font-weight:600}.category-select-arrow{transition:transform .2s ease;flex-shrink:0;color:#000}.category-select-arrow.open{transform:rotate(180deg)}.category-select-dropdown{position:absolute;top:calc(100% + .5rem);left:0;right:0;background-color:#fff;border:3px solid black;border-radius:12px;box-shadow:6px 6px #000;z-index:1000;max-height:200px;overflow-y:auto;padding:.25rem}.category-select-option{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:8px;cursor:pointer;transition:background-color .15s ease;color:#000}.category-select-option:hover,.category-select-option.highlighted{background-color:#65d1c91a}.category-select-option.selected{background-color:#65d1c933}.category-select-option.selected.highlighted{background-color:#65d1c94d}.category-select-option .category-select-color{width:14px;height:14px}.category-select-option .category-select-emoji{font-size:1rem}.category-select-option .category-select-name{font-size:.875rem;font-weight:600}.category-select-dropdown::-webkit-scrollbar{width:4px}.category-select-dropdown::-webkit-scrollbar-track{background:transparent}.category-select-dropdown::-webkit-scrollbar-thumb{background:#0000004d;border-radius:2px}.category-select-dropdown::-webkit-scrollbar-thumb:hover{background:#00000080}.period-save-form{display:flex;flex-direction:column;gap:1.5rem}.period-save-form .form-group{display:flex;flex-direction:column;gap:.5rem}.period-save-form .form-group label{font-size:.875rem;font-weight:700;color:#000;margin-bottom:.25rem}.time-fields-row{display:flex;gap:1rem}.time-fields-row .form-group{flex:1}.period-save-form .form-actions{display:flex;gap:.75rem;margin-top:.75rem}.period-save-form .form-actions button{flex:1;padding:.875rem;border:3px solid black;border-radius:12px;font-weight:700;font-size:.875rem;cursor:pointer;transition:transform .1s,box-shadow .1s;color:#000;min-height:48px}.period-save-form .validation-error{padding:.5rem;background-color:#ffebee;color:#c62828;border:1px solid #ffcdd2;border-radius:4px;font-size:.875rem;font-weight:600;margin-top:-.5rem}.period-save-form .cancel-button{background-color:#fff;box-shadow:4px 4px #000}.period-save-form .submit-button{background-color:#65d1c9;box-shadow:4px 4px #000}.period-save-form .cancel-button:hover:not(:disabled),.period-save-form .submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:6px 6px #000}.period-save-form .cancel-button:active:not(:disabled),.period-save-form .submit-button:active:not(:disabled){transform:translate(4px,4px);box-shadow:none}.period-save-form .cancel-button:disabled,.period-save-form .submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:2px 2px #000}.field-error{color:#c62828;font-size:.75rem;font-weight:600;margin-top:.25rem;display:block}@media (max-width: 480px){.time-fields-row{gap:1rem}.period-save-form .form-actions{gap:.75rem}.content{min-height:calc(100vh - var(--footer-height) - 20px);padding-bottom:calc(var(--footer-height) + 30px)}.app-container{padding-left:max(.5rem,var(--safe-area-inset-left));padding-right:max(.5rem,var(--safe-area-inset-right))}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Space Grotesk,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;display:flex;justify-content:center;min-height:100vh;width:100%}button{background:none;border:none;padding:0;cursor:pointer;outline:none;font-family:inherit}#root{width:100%;display:flex;justify-content:center;min-height:100vh;background-color:#f5f5f5}::selection{background-color:#f4ebe7;color:#000}