:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark light;--bg-body: #09090b;--bg-card: #18181b;--text-main: #e4e4e7;--text-muted: #a1a1aa;--border-color: #27272a;--level-0: #27272a;--level-1: #0e4429;--level-2: #006d32;--level-3: #26a641;--level-4: #39d353;--holiday-color: #fbbf24;--weekend-color: #22d3ee;--today-border: rgba(244, 63, 94, .5);--today-glow: rgba(244, 63, 94, .25);--hover-border: rgba(255, 255, 255, .5);--cell-size: 22px;--cell-gap: 5px;--border-radius: 4px}@media(prefers-color-scheme:light){:root{--bg-body: #f4f4f5;--bg-card: #ffffff;--text-main: #18181b;--text-muted: #71717a;--border-color: #e4e4e7;--level-0: #ebedf0;--level-1: #9be9a8;--level-2: #40c463;--level-3: #30a14e;--level-4: #216e39;--holiday-color: #d97706;--weekend-color: #0891b2;--today-border: #ef4444;--today-glow: rgba(239, 68, 68, .4)}}body{margin:0;min-width:320px;min-height:100vh;background-color:var(--bg-body);color:var(--text-main);overflow-x:hidden}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}header{margin-bottom:2rem}h1{margin-top:0;font-size:2.5em;line-height:1.1;margin-bottom:.5rem;background:linear-gradient(to right,var(--text-main),var(--text-muted));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:600;letter-spacing:-.05em}.year-title{cursor:pointer;display:inline-block}.year-title:hover{text-decoration:underline;text-underline-offset:4px}.subtitle{color:var(--text-muted);font-size:.9em}.offline-badge{display:inline-block;margin-top:8px;padding:4px 12px;background-color:#f59e0b;color:#fff;font-size:.75rem;font-weight:600;border-radius:9999px;opacity:1;transition:opacity .3s ease}.offline-badge.hidden{display:none}.heatmap-container{display:flex;flex-direction:column;gap:var(--cell-gap);padding:24px 6px;background:var(--bg-card);border-radius:12px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:1px solid var(--border-color);overflow-x:auto;max-width:100%;box-sizing:border-box}.decade-row{display:flex;gap:var(--cell-gap);align-items:center}.row-label{width:20px;text-align:right;font-size:10px;color:var(--text-muted);margin-right:8px;font-family:monospace}.day-cell{width:var(--cell-size);height:var(--cell-size);background-color:var(--level-0);border-radius:var(--border-radius);transition:transform .1s ease,outline .1s ease;position:relative;cursor:pointer}.day-cell:hover{transform:scale(1.3);z-index:10;outline:1px solid var(--text-main)}#tooltip{position:fixed;background:var(--bg-body);color:var(--text-main);border:1px solid var(--border-color);padding:4px 8px;border-radius:4px;font-size:10px;white-space:nowrap;pointer-events:none;z-index:9999;opacity:0;transition:opacity .15s ease;box-shadow:0 4px 12px #00000026;transform:translate(-50%,-100%);margin-top:-8px}.day-cell[data-level="1"]{background-color:var(--level-1)}.day-cell[data-level="2"]{background-color:var(--level-2)}.day-cell[data-level="3"]{background-color:var(--level-3)}.day-cell[data-level="4"]{background-color:var(--level-4);box-shadow:0 0 8px var(--level-4)}.day-cell[data-has-todo=true]:after{content:"";position:absolute;top:-2px;right:-2px;width:5px;height:5px;background-color:#ef4444;border-radius:50%;box-shadow:0 0 0 1px var(--bg-card);z-index:5}.legend{display:flex;gap:8px;justify-content:center;align-items:center;margin-top:1rem;font-size:12px;color:var(--text-muted)}.legend-item{width:10px;height:10px;border-radius:2px}.day-cell[data-weekend=true]{box-shadow:inset 0 0 0 1px #22d3ee80}.day-cell[data-holiday]{box-shadow:inset 0 0 0 1px #fbbf2480}.day-cell[data-today=true]{z-index:100!important;animation:pulse-today 2s infinite ease-in-out!important}@keyframes pulse-today{0%{box-shadow:inset 0 0 0 2px var(--today-border),0 0 2px 0 var(--today-glow);filter:brightness(100%)}50%{box-shadow:inset 0 0 0 2px var(--today-border),0 0 12px 3px var(--today-glow);filter:brightness(140%)}to{box-shadow:inset 0 0 0 2px var(--today-border),0 0 2px 0 var(--today-glow);filter:brightness(100%)}}.header-row{display:flex;gap:var(--cell-gap);align-items:center;margin-bottom:8px}.header-label{width:20px;margin-right:8px}.col-num{width:var(--cell-size);text-align:center;font-size:10px;color:var(--text-muted);font-family:monospace}.row-spacer{width:10px;margin-left:8px;flex-shrink:0}#app{width:100%;max-width:1280px;box-sizing:border-box;margin:0 auto;padding:2rem;position:relative;display:flex;flex-direction:column;align-items:center}#heatmap-section{display:flex;flex-direction:column;align-items:center}.mobile-only{display:none!important}#event-panel{background:var(--bg-card);border:1px solid var(--border-color);display:flex;flex-direction:column;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 12px #0000000d}@media(min-width:1000px){#event-panel{width:320px;height:600px;max-height:90vh;position:fixed;top:50%;transform:translateY(-50%);left:50%;margin-left:220px;border-radius:12px;z-index:10}#event-panel.hidden{display:none!important}#close-btn.mobile-only{display:block!important}}@media(min-width:800px)and (max-width:999px){#event-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:320px;height:600px;max-height:80vh;border-radius:12px;z-index:201;box-shadow:0 10px 30px #0000004d}#event-panel.hidden{display:none!important}#panel-overlay,#close-btn.mobile-only{display:block!important}}@media(max-width:799px){#app{width:100%;display:block;padding:.5rem;overflow-x:hidden}.mobile-only{display:block!important}#panel-overlay{position:fixed;inset:0;background:#0009;z-index:200;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:1;transition:opacity .3s}#panel-overlay.hidden{opacity:0;pointer-events:none}#event-panel{position:fixed;z-index:201;bottom:0;left:0;right:0;width:100%;max-height:80vh;border-radius:16px 16px 0 0;transform:translateY(0);box-shadow:0 -4px 20px #0003;display:flex;flex-direction:column}#event-panel.hidden{transform:translateY(100%);opacity:0;pointer-events:none}}.panel-header{padding:16px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;background:var(--bg-card);border-radius:12px 12px 0 0}.panel-header h2{margin:0;font-size:1.1rem;color:var(--text-main)}#close-btn{background:none;border:none;font-size:1.5rem;color:var(--text-muted);cursor:pointer}#event-list{flex:1;overflow-y:auto;padding:16px;background:var(--bg-body)}.empty-state{text-align:center;color:var(--text-muted);font-size:.9em;margin-top:2rem}.panel-input-area{padding:16px;background:var(--bg-card);border-top:1px solid var(--border-color);border-radius:0 0 12px 12px;display:flex;gap:8px}#event-input{flex:1;padding:8px 12px;border-radius:6px;border:1px solid var(--border-color);background:var(--bg-body);color:var(--text-main);outline:none}#event-input:focus{border-color:var(--weekend-color)}#add-btn{padding:0 16px;background:var(--weekend-color);color:#fff;border:none;border-radius:6px;font-weight:600;cursor:pointer;font-size:.9em}#add-btn:hover{filter:brightness(110%)}.event-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;margin-bottom:8px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:6px;box-shadow:0 1px 2px #0000000d}.delete-event{color:#ef4444;cursor:pointer;padding:4px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:translate(-50%,-40%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}#event-list-container{flex:1;overflow-y:auto;padding:16px;background:var(--bg-body)}.list-section{margin-bottom:24px}.section-title{font-size:.75rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 8px 4px}.event-group{display:flex;flex-direction:column;gap:8px;min-height:20px}.event-item{display:flex;align-items:center;gap:12px;padding:10px 12px;margin-bottom:0;background:var(--bg-card);border:1px solid var(--border-color);border-radius:6px;box-shadow:0 1px 2px #0000000d;transition:all .2s ease}.event-item:hover{transform:translateY(-1px);box-shadow:0 2px 5px #0000001a}.event-text{flex:1;font-size:.95rem;line-height:1.4;color:var(--text-main)}.event-checkbox{width:20px;height:20px;min-width:20px;border-radius:6px;border:2px solid var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;background:transparent}.event-checkbox:hover{border-color:var(--weekend-color);background:#22d3ee1a}.event-item.done{opacity:.6;background:var(--bg-body);border-color:transparent}.event-item.done .event-text{color:var(--text-muted)}.event-item.done .event-checkbox{background:var(--weekend-color);border-color:var(--weekend-color);position:relative}.event-item.done .event-checkbox:after{content:"";width:5px;height:9px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg);margin-top:-2px}.event-item.giveup{opacity:.4;background:transparent;border:1px dashed var(--border-color)}.event-item.giveup .event-text{text-decoration:line-through;color:var(--text-muted);font-style:italic}.event-item.giveup .event-checkbox{border-color:var(--border-color);background:transparent;cursor:not-allowed}.event-item.giveup .event-checkbox:after{display:none}.input-actions{display:flex;gap:6px}.action-btn{width:36px;height:36px;border:none;border-radius:6px;font-weight:700;font-size:1.1em;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;color:#fff}#add-todo-btn{background:var(--weekend-color);color:#fff}#add-todo-btn:hover{filter:brightness(110%);box-shadow:0 0 8px var(--weekend-color)}#add-done-btn.done{background:var(--border-color);color:var(--text-main)}#add-done-btn.done:hover{background:var(--text-muted)}.app-logo{height:150px;width:auto;margin-bottom:0;will-change:filter;transition:filter .3s}.app-logo:hover{filter:drop-shadow(0 0 1em #22d3eeaa)}.logo-sway{animation:sway .4s ease-in-out}.logo-spin{animation:spin .8s ease-in-out}@keyframes sway{0%,to{transform:rotate(0)}25%{transform:rotate(-15deg)}75%{transform:rotate(15deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#auth-modal{position:fixed;inset:0;background:var(--bg-body);z-index:9999;display:flex;align-items:center;justify-content:center;transition:opacity .5s ease}#auth-modal.hidden{opacity:0;pointer-events:none}.auth-container{text-align:center;width:90%;max-width:320px}.auth-logo{width:80px;height:auto;margin-bottom:1rem}.auth-container h2{margin-bottom:.5rem;color:var(--text-main)}.auth-container p{color:var(--text-muted);font-size:.9em;margin-bottom:2rem}#auth-input{width:100%;box-sizing:border-box;padding:12px;border-radius:8px;border:1px solid var(--border-color);background:var(--bg-card);color:var(--text-main);outline:none;font-size:1.1em;text-align:center;margin-bottom:1rem;transition:border-color .2s}#auth-input:focus{border-color:var(--weekend-color)}#auth-btn{width:100%;box-sizing:border-box;padding:12px;border-radius:8px;border:none;background:var(--weekend-color);color:#fff;font-weight:700;font-size:1.1em;cursor:pointer;transition:filter .2s}#auth-btn:hover{filter:brightness(110%)}#panel-emoji-input{width:36px;height:36px;border:1px dashed var(--border-color);background:transparent;color:var(--text-main);text-align:center;font-size:1.2rem;border-radius:6px;margin-right:12px;cursor:pointer;transition:all .2s;padding:0}#panel-emoji-input:focus{border-style:solid;border-color:var(--weekend-color);outline:none;background:var(--bg-card)}.day-cell{display:flex;align-items:center;justify-content:center;font-size:12px;overflow:visible}.cell-emoji{pointer-events:none;line-height:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}@keyframes logo-rock{0%{transform:rotate(-10deg)}50%{transform:rotate(10deg)}to{transform:rotate(-10deg)}}header.loading{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2000;margin:0;width:max-content;pointer-events:none;transition:all .6s cubic-bezier(.34,1.56,.64,1)}header.loading .app-logo{animation:logo-rock .8s ease-in-out infinite;filter:drop-shadow(0 0 20px rgba(34,211,238,.8))}.hidden{opacity:0!important;visibility:hidden!important;transition:opacity .5s ease,visibility 0s .5s}#auth-modal:not(.hidden){opacity:1;visibility:visible;transition:opacity .5s ease}#content-area{transition:opacity .4s ease,transform .4s ease;opacity:1;transform:translateY(0)}#content-area.hidden-loading{opacity:0;transform:translateY(20px);pointer-events:none}::-webkit-scrollbar{display:none}html,body{scrollbar-width:none;-ms-overflow-style:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}input,textarea{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;display:none}.edit-input{flex:1;font-size:.95rem;line-height:1.4;color:var(--text-main);background:transparent;border:none;border-bottom:1px solid var(--weekend-color);outline:none;padding:0;margin:0;font-family:inherit;width:100%}.sortable-ghost{opacity:.4;background-color:var(--border-color)}.sortable-drag{cursor:grabbing;opacity:1;background:var(--bg-card);box-shadow:0 5px 15px #0003;transform:scale(1.02)}