:root{--font-family-sans:"LXGW WenKai TC","LXGW WenKai",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--text-primary:#0f172a;--text-secondary:#64748b;--accent-primary:#3b82f6;--accent-primary-hover:#2563eb;--accent-danger:#ef4444;--accent-danger-hover:#dc2626;--accent-save:#10b981;--accent-save-hover:#059669;--icon-color:#fff;--editing-glow:rgba(59,130,246,.6);--mobile-event-bg:rgba(15,23,42,.03);--bg-gradient:linear-gradient(-45deg,#6366f1,#8b5cf6,#06b6d4,#3b82f6);--glass-bg:hsla(0,0%,100%,.75);--glass-border:hsla(0,0%,100%,.3);--card-bg:hsla(0,0%,100%,.9);--card-bg-hover:#fff;--radius-2xl:1.5rem;--radius-xl:1.25rem;--radius-lg:1rem;--radius-md:0.75rem;--radius-full:9999px;--shadow-color:rgba(15,23,42,.1);--shadow-lg:0 20px 25px -5px var(--shadow-color),0 10px 10px -5px var(--shadow-color);--shadow-md:0 10px 15px -3px var(--shadow-color),0 4px 6px -2px var(--shadow-color);--shadow-sm:0 4px 6px -1px var(--shadow-color),0 2px 4px -1px var(--shadow-color);--shadow-xs:0 1px 3px 0 var(--shadow-color),0 1px 2px -1px var(--shadow-color);--transition-fluid:0.4s cubic-bezier(0.22,0.61,0.36,1);--transition-snap:0.2s cubic-bezier(0.4,0,0.6,1);--transition-bounce:0.6s cubic-bezier(0.68,-0.55,0.265,1.55)}@keyframes gradientBG{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes fadeInSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes row-enter{0%{opacity:0;transform:translateY(-20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes row-exit{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}*,:after,:before{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family-sans);color:var(--text-primary);background:var(--bg-gradient);background-size:400% 400%;animation:gradientBG 20s ease infinite;padding:2rem 1rem;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{max-width:800px;margin:0 auto;padding:2.5rem;background:var(--glass-bg);backdrop-filter:blur(25px) saturate(180%);-webkit-backdrop-filter:blur(25px) saturate(180%);border:1px solid var(--glass-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);animation:fadeInSlideUp .8s var(--transition-fluid) forwards;position:relative;overflow:hidden}.container:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,hsla(0,0%,100%,.1) 0,hsla(0,0%,100%,0) 70%);z-index:-1;pointer-events:none}.app-header{position:relative;display:flex;justify-content:center;align-items:center;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--glass-border)}.app-header:after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100px;height:3px;background:linear-gradient(90deg,var(--accent-primary),var(--accent-save));border-radius:var(--radius-full)}.controls-container{display:flex;align-items:stretch;justify-content:space-between;margin-bottom:1.5rem;gap:1rem}.controls-container>*{display:flex;align-items:center}h1{font-size:2.25rem;font-weight:700;color:var(--text-primary);position:absolute;left:50%;transform:translateX(-50%);text-align:center;background:linear-gradient(90deg,var(--accent-primary),var(--accent-save));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sort-container{position:relative;z-index:10;flex-grow:1}.custom-dropdown{height:100%}.custom-dropdown,.dropdown-trigger{position:relative;display:flex;width:100%}.dropdown-trigger{align-items:center;justify-content:space-between;padding:.875rem 1.5rem;border-radius:var(--radius-lg);background:var(--card-bg);box-shadow:var(--shadow-sm);border:1px solid transparent;cursor:pointer;transition:all var(--transition-snap);font-family:var(--font-family-sans);font-size:1rem;font-weight:500;color:var(--text-primary);overflow:hidden}.dropdown-trigger:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,hsla(0,0%,100%,.2),hsla(0,0%,100%,.05));z-index:-1;pointer-events:none}.dropdown-trigger:hover{background:var(--card-bg-hover);box-shadow:var(--shadow-md);border-color:var(--glass-border);transform:translateY(-2px)}.dropdown-trigger:focus,.dropdown-trigger[aria-expanded=true]{outline:none;box-shadow:0 0 0 2px var(--editing-glow),var(--shadow-md)}.dropdown-arrow{width:1.25rem;height:1.25rem;transition:transform var(--transition-snap);color:var(--text-secondary)}.dropdown-arrow.open{transform:rotate(180deg)}.dropdown-panel{position:absolute;top:calc(100% + .5rem);left:0;width:100%;padding:.75rem;background:var(--glass-bg);backdrop-filter:blur(25px) saturate(180%);-webkit-backdrop-filter:blur(25px) saturate(180%);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);animation:fadeInSlideUp .3s var(--transition-fluid) forwards;z-index:11}.dropdown-option{display:block;width:100%;text-align:left;padding:.875rem 1.25rem;border:none;background:transparent;border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-family-sans);font-size:1rem;font-weight:500;color:var(--text-primary);transition:all var(--transition-snap);margin-bottom:.25rem}.dropdown-option:last-child{margin-bottom:0}.dropdown-option:hover{background:hsla(0,0%,100%,.5);transform:translateX(3px)}.dropdown-option.selected{font-weight:600;background:hsla(0,0%,100%,.7);box-shadow:var(--shadow-xs)}.green-sort-theme .dropdown-trigger{width:auto;height:100%;padding:.75rem 1rem;background:linear-gradient(120deg,rgba(16,185,129,.15),rgba(16,185,129,.25));backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(16,185,129,.3);color:var(--text-primary);box-shadow:var(--shadow-sm);border-radius:var(--radius-lg);font-weight:600}.green-sort-theme .dropdown-trigger:hover{background:linear-gradient(120deg,rgba(16,185,129,.25),rgba(16,185,129,.35));border-color:rgba(16,185,129,.5);box-shadow:var(--shadow-md);transform:translateY(-2px)}.green-sort-theme .dropdown-trigger:focus,.green-sort-theme .dropdown-trigger[aria-expanded=true]{outline:none;box-shadow:0 0 0 3px rgba(16,185,129,.4),var(--shadow-md)}.green-sort-theme .trigger-content{display:flex;align-items:center;gap:.75rem}.green-sort-theme .trigger-icon{color:var(--accent-save);width:1.25rem;height:1.25rem}.green-sort-theme .trigger-text{display:flex;flex-direction:column;align-items:flex-start;line-height:1.4}.green-sort-theme .trigger-title{font-size:.85rem;color:var(--text-primary);font-weight:600}.green-sort-theme .trigger-label{font-size:.9rem;font-weight:500;color:var(--text-secondary);white-space:nowrap}.green-sort-theme .dropdown-arrow{color:var(--text-secondary);width:1.25rem;height:1.25rem}.green-sort-theme .dropdown-panel{background:hsla(0,0%,100%,.85);backdrop-filter:blur(25px) saturate(180%);-webkit-backdrop-filter:blur(25px) saturate(180%);border-color:var(--glass-border);border-radius:var(--radius-lg);padding:.75rem;box-shadow:var(--shadow-lg)}.green-sort-theme .dropdown-option{color:var(--text-primary);padding:.875rem 1.25rem;border-radius:var(--radius-md);font-weight:500;transition:all var(--transition-snap)}.green-sort-theme .dropdown-option:hover{background:rgba(16,185,129,.15);transform:translateX(3px)}.green-sort-theme .dropdown-option.selected{background:linear-gradient(90deg,var(--accent-save),#047857);color:#fff;font-weight:600;box-shadow:var(--shadow-xs)}.diary-list{display:flex;flex-direction:column;gap:1rem}.diary-entry{display:flex;gap:1rem;align-items:center}.diary-entry>*{opacity:0;animation-fill-mode:forwards}.row-enter-active>*{animation:row-enter .6s var(--transition-fluid) forwards}.row-exit-active>*{animation:row-exit .4s var(--transition-bounce) forwards}.entry-date,.entry-event{padding:1rem 1.5rem;border-radius:var(--radius-xl);background:var(--card-bg);transition:all var(--transition-snap);box-shadow:var(--shadow-sm);height:100%;display:flex;align-items:center;position:relative;overflow:hidden}.entry-date:before,.entry-event:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,hsla(0,0%,100%,.2),hsla(0,0%,100%,.05));z-index:-1;pointer-events:none}.entry-date{font-weight:700;width:160px;justify-content:center;color:var(--accent-primary);font-size:1.1rem}.entry-event{line-height:1.6;font-size:1.05rem;flex-grow:1}.entry-actions{display:flex;gap:.75rem;align-items:center}.entry-date:hover,.entry-event:hover{background:var(--card-bg-hover);transform:translateY(-3px);box-shadow:var(--shadow-md)}.entry-date:hover:after,.entry-event:hover:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,rgba(59,130,246,.05),rgba(16,185,129,.05));z-index:-1}.is-editing>.entry-date,.is-editing>.entry-event{background-color:var(--card-bg-hover);box-shadow:0 0 0 2px var(--editing-glow),var(--shadow-md);cursor:text;transform:translateY(-2px)}.is-editing>.entry-date:after,.is-editing>.entry-event:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,rgba(59,130,246,.1),rgba(16,185,129,.1));z-index:-1}.entry-date[contenteditable=true]:focus-visible,.entry-event[contenteditable=true]:focus-visible{outline:none;box-shadow:0 0 0 2px var(--editing-glow),var(--shadow-md)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.875rem 1.75rem;border:none;border-radius:var(--radius-xl);cursor:pointer;font-size:1rem;font-weight:600;font-family:var(--font-family-sans);text-decoration:none;transition:all var(--transition-snap);box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,hsla(0,0%,100%,.2),hsla(0,0%,100%,.05));z-index:-1;pointer-events:none}.btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.btn:active{transform:translateY(0) scale(.98);box-shadow:var(--shadow-sm)}.btn-add{background-color:var(--accent-primary);color:var(--icon-color);box-shadow:0 4px 15px rgba(59,130,246,.3)}.btn-add:hover{background-color:var(--accent-primary-hover);box-shadow:0 6px 20px rgba(59,130,246,.4)}.btn-add .icon{margin-right:.625rem}.btn-like-green-sort{width:auto;flex-grow:1;height:100%;justify-content:center;background:linear-gradient(120deg,rgba(16,185,129,.15),rgba(16,185,129,.25));backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(16,185,129,.3);color:var(--text-primary);box-shadow:var(--shadow-sm);padding:.875rem 1.5rem;border-radius:var(--radius-lg);font-weight:600}.btn-like-green-sort:hover{background:linear-gradient(120deg,rgba(16,185,129,.25),rgba(16,185,129,.35));border-color:rgba(16,185,129,.5);box-shadow:var(--shadow-md);transform:translateY(-3px)}.btn-like-green-sort:focus{outline:none;box-shadow:0 0 0 3px rgba(16,185,129,.4),var(--shadow-md)}.btn-like-green-sort .icon{margin-right:.625rem}.icon-btn{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;color:var(--icon-color);border:none;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-snap);box-shadow:var(--shadow-xs);position:relative;overflow:hidden}.icon-btn:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,hsla(0,0%,100%,.2),hsla(0,0%,100%,.05));z-index:-1;pointer-events:none}.icon-btn:hover{transform:scale(1.1) rotate(8deg);filter:brightness(1.15);box-shadow:var(--shadow-sm)}.icon-btn:active{transform:scale(.95) rotate(0deg)}.icon-btn.btn-edit{background-color:var(--accent-primary);box-shadow:0 4px 10px rgba(59,130,246,.3)}.icon-btn.btn-delete{background-color:var(--accent-danger);box-shadow:0 4px 10px rgba(239,68,68,.3)}.icon-btn.btn-save{background-color:var(--accent-save);box-shadow:0 4px 10px rgba(16,185,129,.3)}.icon-btn.hidden{display:none}.icon{width:22px;height:22px;stroke-width:2.2}.empty-state{grid-column:1/-1;text-align:center;padding:3rem 1rem;background:var(--card-bg);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:all var(--transition-snap)}.empty-state:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.empty-state p:first-child{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.empty-state p:last-child{font-size:1rem;color:var(--text-secondary)}@media (max-width:768px){body{padding:1.25rem .75rem}.container{padding:1.75rem 1.25rem}.app-header{flex-direction:column;align-items:flex-start;gap:1.5rem;margin-bottom:1.5rem}.app-header:after{left:0;transform:translateX(0)}h1{font-size:1.875rem;position:relative;left:0;transform:none}.controls-container{flex-direction:column;gap:1rem;width:100%}.btn-add{width:100%;justify-content:center;padding:1rem;border-radius:var(--radius-lg);font-size:1.1rem}.diary-list{grid-template-columns:1fr;gap:1.25rem}.diary-entry{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:.75rem 1rem;padding:1.25rem;background:var(--card-bg);border-radius:var(--radius-2xl);box-shadow:var(--shadow-md);transition:all var(--transition-snap)}.diary-entry:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.entry-date,.entry-event{background:none;box-shadow:none;padding:0;height:auto}.entry-date:hover,.entry-event:hover{background:none;transform:none;box-shadow:none}.entry-date{grid-column:1/2;grid-row:1/2;font-weight:700;font-size:1rem;color:var(--accent-primary);padding:.5rem 1rem;background:rgba(59,130,246,.1);border-radius:var(--radius-md);width:auto;justify-content:flex-start}.entry-event{grid-column:1/-1;grid-row:2/3;background:var(--mobile-event-bg);border-radius:var(--radius-lg);padding:1rem;font-size:1.05rem;line-height:1.6}.entry-actions{grid-column:2/3;grid-row:1/2;align-self:center;gap:.5rem}.icon-btn{width:36px;height:36px}.icon{width:18px;height:18px}.is-editing{box-shadow:0 0 0 2px var(--editing-glow),var(--shadow-md);transform:translateY(-2px)}.is-editing>.entry-event{background-color:var(--card-bg-hover)}.is-editing>.entry-date{box-shadow:none}.green-sort-theme .dropdown-trigger,.sort-container{width:100%}.empty-state{padding:2rem 1rem}.empty-state p:first-child{font-size:1.125rem}}@media (min-width:769px) and (max-width:1024px){.container{padding:2rem}h1{font-size:2rem}.entry-date{width:140px}.entry-date,.entry-event{font-size:1rem}}@media (min-width:1025px){.container{padding:3rem}h1{font-size:2.5rem}.entry-date{width:170px;font-size:1.15rem}.entry-event{font-size:1.1rem}}.search-container{position:relative;display:flex;align-items:stretch;flex-grow:2}.search-input-wrapper{position:relative;width:100%}.search-icon{position:absolute;top:50%;left:1.25rem;transform:translateY(-50%);color:var(--text-secondary);width:1.25rem;height:1.25rem;pointer-events:none}.search-input{width:100%;height:100%;padding:.875rem 1.25rem .875rem 3.5rem;border-radius:var(--radius-lg);background:var(--card-bg);box-shadow:var(--shadow-sm);border:1px solid transparent;font-family:var(--font-family-sans);font-size:1rem;font-weight:500;color:var(--text-primary);transition:all var(--transition-snap)}.search-input::placeholder{color:var(--text-secondary);opacity:.8}.search-input:hover{background:var(--card-bg-hover);box-shadow:var(--shadow-md);border-color:var(--glass-border)}.search-input:focus{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.4),var(--shadow-md);border-color:var(--accent-primary)}.search-input-as-button{flex-grow:1;background:transparent;border:none;outline:none;padding:0;margin:0;font-family:var(--font-family-sans);font-size:.9rem;font-weight:500;color:var(--text-secondary)}.search-input-as-button::placeholder{color:var(--text-secondary);opacity:1}.search-input-as-button:focus{box-shadow:none}.search-control-theme .trigger-content{width:100%}.search-control-theme{flex-grow:2;min-width:100px}.date-filter-panel{display:flex;gap:.75rem;flex-grow:1}.date-filter-panel select{width:100%;padding:.75rem 1rem;border-radius:var(--radius-md);border:1px solid var(--glass-border);background:hsla(0,0%,100%,.8);font-family:var(--font-family-sans);font-size:.95rem;color:var(--text-primary);transition:all var(--transition-snap);cursor:pointer}.date-filter-panel select:hover{border-color:var(--accent-primary);background:#fff}.date-filter-panel select:focus{outline:none;box-shadow:0 0 0 2px var(--editing-glow);border-color:var(--accent-primary)}.date-filter-panel select:disabled{cursor:not-allowed;opacity:.6;background:rgba(229,231,235,.5)}@media (max-width:768px){.search-container{width:100%}.date-filter-panel{flex-direction:column}}