.App{width:500px;margin:0 auto;display:flex;flex-direction:column;gap:10px}.Header{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 10px;border-radius:12px;background:linear-gradient(to bottom left,#aee2ff,#60a5fa 40%,#2563eb);color:#fff;box-shadow:0 4px 12px #0000001f;position:relative;overflow:hidden}.Header:before{content:"";position:absolute;inset:-20% -20% 0 0;pointer-events:none;background:radial-gradient(220px 220px at 100% 0%,#ffffff38,#ffffff1a,#fff0 70%),repeating-conic-gradient(from -25deg at 100% 0%,#fff6,#ffffff2e 3deg,#fff0 10deg);-webkit-mask:radial-gradient(200px 200px at 100% 0%,#000 0%,transparent 72%),linear-gradient(to bottom left,#000 38%,transparent 82%);mask:radial-gradient(200px 200px at 100% 0%,#000 0%,transparent 72%),linear-gradient(to bottom left,#000 38%,transparent 82%);mix-blend-mode:screen;opacity:.45}.Header:after{content:"";position:absolute;width:200px;height:200px;right:-60px;top:-60px;pointer-events:none;background:radial-gradient(circle,#ffffdc,#ffffffd9 25%,#fff0 70%);border-radius:50%;filter:blur(12px);mix-blend-mode:screen;opacity:.95}.Header h3{margin:0;font-size:14px;font-weight:500;opacity:.9;letter-spacing:.5px}.Header h1{margin:4px 0 0;font-size:22px;font-weight:800;letter-spacing:.5px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2)}.bucketEditor{display:grid;grid-template-columns:1fr 96px;gap:12px;align-items:center}.bucketEditor input{padding:14px 16px;border:1px solid #e5e7eb;border-radius:12px;font-size:15px;transition:border-color .2s,box-shadow .2s}.bucketEditor input:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 4px #2563eb40}.bucketEditor button{border:none;border-radius:12px;cursor:pointer;color:#fff;font-weight:700;background-color:#2563eb;box-shadow:0 6px 14px #2563eb2e;padding:12px 0;transition:filter .15s,transform .05s}.bucketEditor button:hover{filter:brightness(1.05)}.bucketEditor button:active{transform:translateY(1px)}.bucketEditor button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.BucketList{display:flex;flex-direction:column;gap:20px}.BucketList>input{border:none;border-bottom:1px solid #c3c3c3;padding:15px 0}.BucketList h4{color:#fff;background-color:#f87777;width:100%;padding:20px 10px;text-align:center;border-radius:30px 30px 0 0;background:linear-gradient(90deg,#facc15,#f97316,#ef4444);box-shadow:0 4px 12px #ef444466}.BucketList>input{outline:none;border-bottom:2px dashed rgb(255,0,43);border-top:2px dashed blue}.buckets-wrapper{display:flex;flex-direction:column;gap:25px}.BucketItem{position:relative;display:flex;align-items:center;gap:12px;padding:12px;border:1px solid #e5e7eb;border-radius:12px;background:#fff;box-shadow:0 1px 2px #00000008}.BucketItem.isCompleted{background:#f7f7f7;border-color:#eee}.BucketItem.isCompleted .content{text-decoration:line-through;color:#9ca3af}.BucketItem.isCompleted:after{content:"🏅";position:absolute;right:10px;top:-10px;font-size:20px}.BucketItem input[type=checkbox]{width:18px;height:18px;accent-color:rgb(80,223,180)}.BucketItem .ribbon{position:absolute;top:-13px;left:-10px;background:#2593ff;color:#fff;font-size:12px;padding:4px 8px;border-radius:8px;box-shadow:0 2px 6px #2593ff40}.BucketItem .ribbon.today{background:#ff6b6b}.BucketItem .content-wrap{display:flex;align-items:center;gap:12px;flex:1}.BucketItem .content{flex:1;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.BucketItem .date{min-width:110px;text-align:right;font-size:13px;color:#6b7280}.BucketItem .edit-wrap{display:flex;align-items:center;gap:10px;flex:1}.BucketItem .edit-wrap input[type=text]{flex:1;min-width:0;height:36px;padding:0 12px;border:1px solid #e5e7eb;border-radius:10px;font-size:14px;outline:none}.BucketItem .edit-wrap input[type=text]:focus,.BucketItem .edit-wrap .date input[type=date]:focus{border-color:#50dfb4;box-shadow:0 0 0 3px #50dfb426}.BucketItem .edit-wrap .date{min-width:140px;text-align:right}.BucketItem .edit-wrap .date input[type=date]{width:140px;height:36px;padding:0 10px;border:1px solid #e5e7eb;border-radius:10px;font-size:13px;color:#374151;background:#fff}.BucketItem .btn-wrap{display:flex;gap:8px}.BucketItem button{cursor:pointer;font-size:13px;border:none;border-radius:999px;padding:6px 12px;color:#fff;transition:transform .02s ease-in}.BucketItem button:active{transform:translateY(1px)}.BucketItem .updateBtn{background-color:#50dfb4}.BucketItem .deleteBtn{background-color:#ff7970}@media (max-width: 480px){.BucketItem .date,.BucketItem .edit-wrap .date{min-width:100px}.BucketItem .edit-wrap{gap:8px}.BucketItem .edit-wrap .date input[type=date]{width:120px}}