:root{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans TC","Microsoft JhengHei",sans-serif;color:#273445;background:#f5f3ee;font-size:16px}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}.shell{max-width:560px;height:100dvh;min-height:430px;margin:auto;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 14px) 14px calc(env(safe-area-inset-bottom) + 10px);gap:10px}header{display:flex;justify-content:space-between;align-items:center}h1{margin:0;font-size:24px;letter-spacing:-.6px}header p{margin:3px 0 0;font-size:12px;color:#79828b}.header-actions{display:flex;gap:6px}.header-actions button{border:0;background:#e7e7e3;border-radius:10px;font-size:24px;width:42px;height:42px}#status{min-height:17px;color:#617386;font-size:12px}#status.error{color:#bc3434}#list{flex:1;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:8px;padding:2px 2px 8px}.card{background:white;border:1px solid #e3e4e0;border-radius:14px;box-shadow:0 3px 11px #3344550a;padding:10px 10px 10px 12px;display:flex;align-items:center;gap:8px;flex-shrink:0;min-height:65px}.card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}.view-first{display:flex;gap:12px;align-items:center;font-weight:650;font-size:15px;white-space:nowrap}.view-first .date{font-size:13px;color:#576778;font-variant-numeric:tabular-nums}.view-second{font-size:13px;color:#79828b}.actions{display:flex;flex-direction:column;gap:5px;align-self:stretch;justify-content:center}.actions button{border:0;background:#f0f1f0;border-radius:7px;min-width:36px;min-height:29px;color:#495b6c;font-size:19px}.actions button.save{background:#d7e8de;color:#245b44}.fields{display:flex;flex-direction:column;gap:6px;min-width:0}.first,.second{display:flex;gap:6px;min-width:0}.first input:first-child{width:53%}.first input:last-child{width:47%}.second input{width:50%}.fields input{min-width:0;height:36px;padding:0 7px;border:1px solid #d6dbdf;border-radius:7px;background:#fafbfc;color:#273445;font-size:14px}.fields input::placeholder{text-align:center;color:#a0a7ae}input[type=date]{font-size:13px}#add{flex-shrink:0;background:#e9ebe8;border-radius:15px;padding:11px;box-shadow:0 -5px 20px #3141520c;display:flex;flex-direction:column;gap:8px}.new-title{font-size:14px;font-weight:700}.add-button{background:#243b50;color:#fff;border:0;border-radius:9px;height:40px;font-weight:650}.confirm{display:flex;align-items:center;gap:5px;font-size:12px;background:#fff5f4;border-radius:8px;padding:6px;flex-wrap:wrap}.confirm span{flex:1}.confirm button{border:0;border-radius:6px;padding:5px 8px}.confirm .danger{background:#b94c4b;color:white}.empty{text-align:center;padding:40px 12px;color:#89939b}dialog{border:0;border-radius:16px;max-width:min(95vw,480px);padding:0;box-shadow:0 20px 70px #0004}dialog::backdrop{background:#0006}.modal{padding:18px;display:grid;gap:14px}.modal h2{margin:0}.modal p{margin:0;font-size:13px}.inline{display:flex;gap:8px}.inline input{min-width:0;flex:1}.modal button{padding:8px;border:0;border-radius:8px}.modal pre{font-size:11px;white-space:pre-wrap;word-break:break-all;background:#f0f4f1;padding:10px}.device-row{display:flex;justify-content:space-between;gap:8px;align-items:center;border-top:1px solid #eee;padding:8px 0;font-size:12px}
.categories{display:flex;gap:4px;flex-wrap:nowrap;min-width:0;overflow-x:auto;padding:2px 0;scrollbar-width:none}.categories::-webkit-scrollbar{display:none}
.cat{flex:1 0 auto;min-width:0;border:1px solid #d6dbe0;background:#f8f9f8;border-radius:13px;padding:5px 7px;font-size:11px;color:#66727c;white-space:nowrap}
.cat.selected{border-color:currentColor;box-shadow:0 0 0 1px currentColor;font-weight:700}
.cat-home.selected,.category-tag.cat-home{color:#926831;background:#f8e7c6}
.cat-school.selected,.category-tag.cat-school{color:#337b53;background:#dceee0}
.cat-travel.selected,.category-tag.cat-travel{color:#2a77a7;background:#dbeefa}
.cat-important.selected,.category-tag.cat-important{color:#aa5760;background:#f9e1e2}
.cat-default.selected{color:#5f7180;background:#e6eaf0}
.category-tag{font-size:10px;font-weight:600;border-radius:6px;padding:2px 5px;margin-left:auto}
.card.cat-home{border-left:3px solid #d1a354}.card.cat-school{border-left:3px solid #65a87f}.card.cat-travel{border-left:3px solid #68b3e3}.card.cat-important{border-left:3px solid #db8991}