@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&family=Yomogi&display=swap";:root{font-family:Noto Sans JP,sans-serif;color:#2d2b28;background:#e9e1d3;font-synthesis:none;--ink: #2d2b28;--muted: #817b70;--red: #dd5a49;--paper: #f8f4eb}*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%}body{min-height:100dvh;background:radial-gradient(circle at 12% 8%,rgba(255,255,255,.7),transparent 28%),linear-gradient(135deg,#eee7dc,#dfd3c1)}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{min-height:100dvh;display:grid;grid-template-rows:auto auto auto 1fr auto;padding:20px}.topbar,footer{width:min(1500px,100%);margin-inline:auto;display:flex;align-items:center;justify-content:space-between}.topbar{min-height:84px;padding:8px 10px 18px}.brand{display:flex;align-items:center;gap:14px}.brand-mark{width:42px;height:42px;background:#ffd768;border-radius:4px;box-shadow:4px 5px #493a201f;transform:rotate(-3deg);position:relative;flex:0 0 auto}.brand-mark:after{content:"";position:absolute;inset:7px 8px auto;height:2px;background:#4f3d1840;box-shadow:0 7px #4f3d1833,0 14px #4f3d1824}h1{margin:0;font-family:DM Sans,sans-serif;font-size:26px;letter-spacing:-.6px}.brand p{margin:2px 0 0;color:var(--muted);font-size:12px}.search-group{margin-inline:auto 22px;display:flex;align-items:center;gap:10px;min-width:0}.search-box{width:min(330px,30vw);height:46px;padding:0 14px;border:1px solid rgba(82,66,42,.15);border-radius:12px;background:#fffdf8b8;display:flex;align-items:center;gap:10px;transition:border-color .15s,box-shadow .15s,background .15s}.search-box:focus-within{border-color:#dd5a4973;background:#fffdf8;box-shadow:0 0 0 3px #dd5a491a}.search-box svg{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:var(--muted);stroke-width:1.8;stroke-linecap:round}.search-box input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:14px}.search-box input::placeholder{color:#9a9388}.search-count{min-width:70px;color:var(--muted);font-family:DM Sans,Noto Sans JP,sans-serif;font-size:12px;white-space:nowrap}.filter-tabs{width:min(1500px,100%);margin:-8px auto 12px;padding-inline:10px;display:flex;justify-content:center;gap:5px}.filter-tabs button{min-height:38px;padding:0 18px;border:1px solid transparent;border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;font-weight:600}.filter-tabs button:hover{color:var(--ink);background:#ffffff73}.filter-tabs button[aria-pressed=true]{border-color:#52422a1f;background:#fffdf8;color:var(--ink);box-shadow:0 3px 10px #4c3b2517}.filter-divider{width:1px;height:24px;margin:7px 4px;background:#52422a24}.filter-tabs .arrange-button{display:flex;align-items:center;gap:6px;color:#625d54}.arrange-button span{font-family:DM Sans,sans-serif;font-size:19px;line-height:1}.project-bar{width:min(1500px,100%);margin:-5px auto 10px;padding:9px 10px;display:flex;align-items:center;gap:8px;border-block:1px solid rgba(82,66,42,.1)}.project-label{margin-right:3px;color:#9a9286;font-family:DM Sans,sans-serif;font-size:9px;font-weight:700;letter-spacing:1.5px}.project-bar select{min-width:210px;max-width:360px;height:38px;padding:0 34px 0 12px;border:1px solid rgba(82,66,42,.16);border-radius:9px;outline:0;background:#fffdf8;color:var(--ink);font-size:13px;font-weight:600;cursor:pointer}.project-bar select:focus{border-color:#dd5a4973;box-shadow:0 0 0 3px #dd5a4917}.project-action{min-height:34px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer;font-size:11px;font-weight:600}.project-action:hover{background:#ffffffa6;color:var(--ink)}.project-add{color:#b84d3f}.project-delete:hover{background:#dd5a4917;color:#b84d3f}.project-action:disabled{opacity:.35;cursor:not-allowed;background:transparent}.add-button,.empty-add{border:0;color:#fff;background:var(--red);cursor:pointer;font-weight:700;box-shadow:0 5px 14px #aa3e2f33;transition:transform .15s,box-shadow .15s}.add-control{position:relative;display:flex}.header-actions{display:flex;align-items:center;gap:9px}.theme-toggle{width:46px;height:46px;padding:0;border:1px solid rgba(82,66,42,.15);border-radius:12px;background:#fffdf8b3;color:#625d54;cursor:pointer;display:grid;place-items:center;font-family:DM Sans,sans-serif;font-size:22px;transition:transform .15s,background .15s,color .15s}.theme-toggle:hover{transform:translateY(-2px);background:#fffdf8;color:var(--ink)}.add-button{min-height:48px;padding:0 16px 0 20px;border-radius:12px 0 0 12px;display:flex;align-items:center;gap:8px}.add-button span:first-child{font-size:25px;line-height:1;font-weight:400}.new-color-button{width:50px;border:0;border-left:1px solid rgba(255,255,255,.35);border-radius:0 12px 12px 0;background:var(--red);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;box-shadow:0 5px 14px #aa3e2f33}.add-button:hover,.empty-add:hover{transform:translateY(-2px);box-shadow:0 7px 18px #aa3e2f45}.add-button:active,.empty-add:active{transform:translateY(0)}.board-wrap{width:min(1500px,100%);min-height:0;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px}.board{position:relative;width:100%;height:100%;min-height:650px;overflow:hidden;border:1px solid rgba(82,66,42,.13);border-radius:20px;background-color:var(--paper);background-image:radial-gradient(rgba(80,70,55,.12) .75px,transparent .75px);background-size:20px 20px;box-shadow:0 18px 50px #4c3b2521,inset 0 1px #fff;touch-action:none}.empty-state{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;padding:24px;pointer-events:auto}.empty-state[hidden]{display:none}.empty-illustration{width:142px;height:88px;position:relative;margin-bottom:22px}.empty-illustration span{position:absolute;width:69px;height:68px;border-radius:3px;box-shadow:5px 7px 12px #3e2f1b1f}.empty-illustration span:nth-child(1){background:#ffd86a;left:5px;top:10px;transform:rotate(-9deg)}.empty-illustration span:nth-child(2){background:#f39d94;right:3px;top:2px;transform:rotate(8deg)}.empty-illustration span:nth-child(3){background:#a9d8c8;left:39px;top:18px;transform:rotate(1deg)}.empty-state h2{margin:0;font-size:19px}.empty-state p{margin:8px 0 20px;color:var(--muted);font-size:13px;line-height:1.7}.empty-add{border-radius:10px;min-height:44px;padding:0 18px;font-size:13px}.no-results{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;padding:24px;pointer-events:none;color:var(--muted)}.no-results[hidden]{display:none}.no-results>span{font-family:DM Sans,sans-serif;font-size:52px;font-weight:500;line-height:1;color:#b2aa9e;transform:rotate(-12deg)}.no-results h2{margin:15px 0 0;color:var(--ink);font-size:18px}.no-results p{margin:7px 0 0;font-size:13px}.note{position:absolute;width:230px;height:220px;padding:42px 20px 20px;border-radius:2px 3px 6px 2px;transform:rotate(var(--note-rotation, -.6deg));transform-origin:50% 48%;box-shadow:2px 3px 3px #352b1c1c,8px 11px 20px #352b1c26;transition:box-shadow .16s,transform .16s;touch-action:none}.note:before{content:"";position:absolute;z-index:-1;left:8px;right:8px;bottom:2px;height:16px;border-radius:50%;background:#3227182e;filter:blur(7px)}.note:after{content:"";position:absolute;right:0;bottom:0;width:24px;height:24px;background:linear-gradient(135deg,#0001 49%,#ffffff6b 50%)}.note:hover{box-shadow:3px 4px 5px #352b1c1c,10px 14px 24px #352b1c2b}.note.is-dragging{z-index:1000!important;transform:rotate(calc(var(--note-rotation, 0deg) + 1deg)) scale(1.025);box-shadow:5px 7px 8px #352b1c1f,16px 22px 34px #352b1c38}.note-yellow{background:#ffe17e}.note-pink{background:#f5aaa2}.note-green{background:#afe0cf}.note-blue{background:#acd9ec}.drag-handle{position:absolute;left:0;top:0;right:0;height:40px;cursor:grab;display:flex;align-items:center;justify-content:center;padding:0;color:#332d2573;letter-spacing:2px;-webkit-user-select:none;user-select:none}.drag-handle:active{cursor:grabbing}.note textarea{width:100%;height:100%;border:0;outline:0;resize:none;background:transparent;color:#38332d;font-family:Yomogi,cursive;line-height:1.72;font-size:17px;font-weight:400;letter-spacing:.035em}.note textarea::placeholder{color:#3d352b73}.complete-note{position:absolute;z-index:3;top:7px;left:8px;width:34px;height:34px;padding:0;border:2px solid rgba(59,52,43,.25);border-radius:50%;background:#ffffff2e;color:transparent;cursor:pointer;font-family:DM Sans,sans-serif;font-size:19px;font-weight:700;display:grid;place-items:center;transition:color .15s,background .15s,border-color .15s,transform .15s}.complete-note:hover{border-color:#519277;color:#519277;transform:scale(1.06)}.complete-note[aria-pressed=true]{border-color:#519277;background:#519277;color:#fff}.delete-note{position:absolute;top:8px;right:8px;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:transparent;color:#302a228f;font-size:20px;cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity .15s,background .15s}.note:hover .delete-note,.delete-note:focus-visible{opacity:1}.delete-note:hover{background:#ffffff61;color:#352f29}.color-dot{display:block;width:18px;height:18px;border:2px solid rgba(67,57,43,.16);border-radius:50%;box-shadow:inset 0 1px 1px #ffffff8c}.color-yellow{background:#ffe17e}.color-pink{background:#f5aaa2}.color-blue{background:#acd9ec}.color-green{background:#afe0cf}.note-color-button{position:absolute;top:8px;right:45px;z-index:2;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#ffffff2e;cursor:pointer;display:grid;place-items:center}.note-color-button:hover{background:#ffffff6b}.color-menu{position:absolute;z-index:1100;width:148px;padding:7px;border:1px solid rgba(67,57,43,.14);border-radius:12px;background:#fffdf8;box-shadow:0 12px 30px #3b2d1b33}.color-menu[hidden]{display:none}.new-color-menu{top:calc(100% + 8px);right:0}.note-color-menu{top:44px;right:42px}.color-option{width:100%;min-height:36px;padding:5px 8px;border:0;border-radius:7px;background:transparent;color:var(--ink);cursor:pointer;display:flex;align-items:center;gap:9px;font-size:12px;text-align:left}.color-option:hover,.color-option:focus-visible{background:#f2eee5;outline:none}.color-option[aria-pressed=true]{font-weight:700;background:#f5f1e8}.completed-panel{position:relative;min-height:650px;padding:18px 14px;overflow:auto;border:2px dashed rgba(81,146,119,.3);border-radius:20px;background:#e6f1e985;transition:border-color .16s,background .16s,transform .16s}.completed-panel.is-drag-over{border-color:#519277;background:#d2eddde0;transform:scale(1.01)}.completed-heading{display:flex;align-items:center;gap:10px;padding:2px 4px 15px;border-bottom:1px solid rgba(81,146,119,.16)}.completed-icon{width:34px;height:34px;border-radius:50%;background:#68a98e;color:#fff;display:grid;place-items:center;font-family:DM Sans,sans-serif;font-size:18px;font-weight:700}.completed-heading h2{margin:0;font-size:15px}.completed-heading p{margin:2px 0 0;color:#718279;font-size:10px}.completed-list{display:grid;gap:15px;padding-top:18px}.completed-empty{position:absolute;inset:48% 20px auto;margin:0;color:#8ca097;text-align:center;font-size:12px;line-height:1.8}.completed-empty[hidden]{display:none}.completed-note{position:relative;width:100%;height:148px;padding:44px 16px 14px;opacity:.78;filter:saturate(.72);box-shadow:2px 3px 3px #352b1c14,6px 8px 14px #352b1c1c}.completed-note textarea{text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:#38332d80}.completed-note .complete-note,.completed-note .note-color-button{top:6px}.completed-note .delete-note{top:6px;opacity:1}.completed-note .note-color-menu{right:35px}.note[hidden]{display:none}.board-wrap[data-filter=complete]{grid-template-columns:minmax(0,720px);justify-content:center}.board-wrap[data-filter=complete] .board{display:none}.board-wrap[data-filter=complete] .completed-panel{min-height:650px}.board-wrap[data-filter=complete] .completed-list{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}footer{min-height:50px;padding:13px 10px 0;color:var(--muted);font-family:DM Sans,Noto Sans JP,sans-serif;font-size:11px;letter-spacing:.2px}footer span:first-child{display:flex;align-items:center;gap:7px}.status-dot{width:7px;height:7px;border-radius:50%;background:#63a98f;box-shadow:0 0 0 3px #63a98f21}@media(max-width:767px){.app-shell{padding:12px}.topbar{min-height:126px;padding:4px 2px 12px;display:grid;grid-template-columns:1fr auto;gap:10px 12px}.brand{gap:9px}.brand-mark{width:36px;height:36px}h1{font-size:20px}.brand p{display:none}.search-group{grid-column:1 / -1;grid-row:2;width:100%;margin:0;gap:8px}.search-box{width:100%;height:46px}.search-count{min-width:66px;text-align:right}.header-actions{grid-column:2;grid-row:1;gap:6px}.theme-toggle{width:44px;height:48px}.add-button{min-width:48px;width:48px;padding:0;justify-content:center}.add-button span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.new-color-button{width:46px}.filter-tabs{margin-top:-4px;padding:0}.filter-tabs button{min-height:42px;padding-inline:16px}.filter-tabs{gap:2px}.filter-tabs button{padding-inline:12px}.filter-divider{margin-inline:1px}.filter-tabs .arrange-button{padding-inline:9px}.board-wrap{display:grid;grid-template-columns:1fr;gap:12px}.board{min-height:560px;border-radius:14px}.completed-panel{min-height:250px;max-height:520px;border-radius:14px}.board-wrap[data-filter=complete]{grid-template-columns:1fr}.board-wrap[data-filter=complete] .completed-panel{min-height:560px}.project-bar{margin:-2px auto 8px;padding:9px 0;display:grid;grid-template-columns:1fr auto auto auto;gap:4px}.project-label{display:none}.project-bar select{min-width:0;width:100%}.project-action{padding-inline:7px;font-size:10px}.project-add span{display:none}.note{width:190px;height:185px;padding:42px 16px 16px}.note textarea{font-size:16px}.delete-note{opacity:1;width:40px;height:40px;top:2px;right:2px}.note-color-button{width:40px;height:40px;top:2px;right:43px}.complete-note{width:40px;height:40px;top:2px;left:2px}.note-color-menu{top:43px;right:35px}.drag-handle{height:44px}footer{min-height:42px;padding-inline:2px}footer span:first-child{font-size:10px}}[data-theme=dark]{color-scheme:dark;--ink: #eee9df;--muted: #aaa297;--paper: #252421}[data-theme=dark] body{background:radial-gradient(circle at 12% 8%,rgba(255,255,255,.045),transparent 30%),linear-gradient(135deg,#24221f,#171715)}[data-theme=dark] .brand-mark{box-shadow:4px 5px #00000047}[data-theme=dark] .search-box,[data-theme=dark] .theme-toggle{border-color:#ffffff1a;background:#2e2c28cc;color:#ddd6ca}[data-theme=dark] .search-box:focus-within{border-color:#ec7d6a8c;background:#302e2a;box-shadow:0 0 0 3px #dd5a491f}[data-theme=dark] .search-box input{color:var(--ink)}[data-theme=dark] .search-box input::placeholder{color:#837c72}[data-theme=dark] .project-bar{border-color:#ffffff14}[data-theme=dark] .project-bar select{border-color:#ffffff1c;background:#302e2a;color:var(--ink)}[data-theme=dark] .project-action:hover,[data-theme=dark] .filter-tabs button:hover{background:#fff1;color:var(--ink)}[data-theme=dark] .filter-tabs button[aria-pressed=true]{border-color:#ffffff17;background:#302e2a;color:var(--ink);box-shadow:0 3px 12px #00000038}[data-theme=dark] .filter-divider{background:#ffffff1a}[data-theme=dark] .filter-tabs .arrange-button{color:#bcb4a8}[data-theme=dark] .board{border-color:#ffffff12;background-color:#252421;background-image:radial-gradient(rgba(255,255,255,.09) .75px,transparent .75px);box-shadow:0 18px 50px #0000004d,inset 0 1px #ffffff09}[data-theme=dark] .empty-state p,[data-theme=dark] .no-results{color:#9f978c}[data-theme=dark] .completed-panel{border-color:#68a98e52;background:#23372d8c}[data-theme=dark] .completed-panel.is-drag-over{border-color:#68a98e;background:#264a3ad1}[data-theme=dark] .completed-heading{border-color:#68a98e2e}[data-theme=dark] .completed-heading p,[data-theme=dark] .completed-empty{color:#81968b}[data-theme=dark] .color-menu{border-color:#ffffff1a;background:#302e2a;box-shadow:0 12px 30px #0006}[data-theme=dark] .color-option{color:var(--ink)}[data-theme=dark] .color-option:hover,[data-theme=dark] .color-option:focus-visible,[data-theme=dark] .color-option[aria-pressed=true]{background:#403d38}[data-theme=dark] footer{color:#8f887d}@media(min-width:768px)and (max-width:1279px){.app-shell{padding:16px}.board{min-height:700px}.note{width:215px;height:205px}.search-group{margin-right:14px}.search-box{width:min(260px,26vw)}.board-wrap{grid-template-columns:minmax(0,1fr) 250px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}