@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800&family=Yomogi&display=swap";:root{font-family:Noto Sans JP,sans-serif;color:#303b36;background:#f6f5f0;font-synthesis:none;font-weight:400}*{box-sizing:border-box}body{margin:0}button,textarea{font:inherit}button{cursor:pointer}button:focus-visible,textarea:focus-visible{outline:3px solid #408772;outline-offset:3px}.app{max-width:1560px;margin:auto;padding:0 56px}.header{min-height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dedfd6;gap:16px}.brand{display:flex;align-items:center;gap:13px;font-weight:700;font-size:20px;letter-spacing:.04em}.brand-icon{background:#2c5949;color:#f4f2dc;border-radius:13px;width:44px;height:44px;display:grid;place-items:center;font-size:32px}.brand small{display:block;font-size:9px;letter-spacing:.15em;color:#7d867e;margin-top:5px}.storage-status{font-size:11px;color:#748074;display:flex;align-items:center;gap:7px}.storage-status:before{content:"";width:6px;height:6px;background:#6c957b;border-radius:50%}.intro{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:48px 0 36px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.18em;color:#80907c;margin:0 0 13px}h1{font-size:34px;letter-spacing:.04em;margin:0 0 13px;font-weight:700}.description{font-size:13px;color:#7c8278;margin:0;line-height:1.9}.add-button{border:0;border-radius:9px;background:#2c5949;color:#fff;padding:14px 23px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:10px;white-space:nowrap;box-shadow:0 4px 10px #24493412}.add-button:hover{background:#214838}.add-button>span{font-size:24px;line-height:20px}.board-toolbar{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-bottom:14px;gap:12px}.board-toolbar>div{display:flex;align-items:center;gap:9px;font-weight:600}.board-dot{width:7px;height:7px;border-radius:2px;background:#718974}.count{font-size:10px;background:#e7e9e0;border-radius:5px;padding:2px 7px;color:#6a7867}.hint{font-size:11px;color:#8b9187}.board{position:relative;min-height:500px;background-color:#eeeee6;background-image:radial-gradient(#cbd0c2 .8px,transparent .8px);background-size:20px 20px;border:1px solid #dee1d5;border-radius:14px;overflow:hidden}.empty-state{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:20px;color:#85917f;pointer-events:none}.empty-state[hidden]{display:none}.empty-state>span{font-size:40px;color:#9ba792;margin-bottom:12px}.empty-state h2{font-size:16px;font-weight:500;margin:0 0 10px}.empty-state p{font-size:12px;margin:0;line-height:1.8}.note{position:absolute;width:230px;height:220px;border-radius:3px 3px 15px;background:var(--paper);box-shadow:2px 5px 10px #50533d18;display:flex;flex-direction:column;transition:box-shadow .15s}.note:focus-within{z-index:2}.note.dragging{z-index:5;box-shadow:4px 12px 22px #50533d30}.note-handle{height:46px;min-height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 16px;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.dragging .note-handle{cursor:grabbing}.grip{letter-spacing:2px;color:#0003;font-size:15px}.delete-note{border:0;background:transparent;color:#0006;width:36px;height:36px;border-radius:6px;font-size:21px;display:grid;place-items:center}.delete-note:hover{background:#0000000a;color:#713d36}.note textarea{background:transparent;border:0;resize:none;flex:1;min-height:0;width:100%;padding:0 18px 18px;color:#454b3d;font-size:15px;line-height:1.8;outline-offset:-4px}.note textarea::placeholder{color:#0005}.note-label{font-size:9px;color:#0005;padding:0 18px 12px;letter-spacing:.08em}footer{padding:22px 0 25px;display:flex;justify-content:space-between;color:#9a9f93;font-size:10px;gap:14px}footer>span:last-child{letter-spacing:.17em;font-size:9px}@media(min-width:1280px){.board{min-height:530px}}@media(max-width:900px){.app{padding:0 28px}.header{min-height:95px}.intro{padding:36px 0 30px}h1{font-size:29px}.note{width:210px}.add-button{padding:13px 18px}}@media(max-width:540px){.app{padding:0 18px}.header{min-height:87px;flex-wrap:wrap;padding:18px 0;gap:12px}.brand{font-size:17px}.brand-icon{height:38px;width:38px;font-size:28px}.brand small{font-size:8px}.storage-status{font-size:10px;margin-left:51px}.intro{align-items:stretch;flex-direction:column;gap:22px;padding:31px 0 26px}h1{font-size:27px}.description{font-size:12px}.add-button{justify-content:center;min-height:50px}.hint{font-size:9px}.note{width:230px}.delete-note{height:44px;width:44px}.note-handle{height:50px;min-height:50px;padding-right:3px}.note textarea{font-size:16px}.board{min-height:470px}.empty-state h2{font-size:14px}.empty-state p{font-size:11px}footer{font-size:9px}}.create-note-controls{flex-shrink:0}.new-color-label{display:block;color:#748074;font-size:11px;margin-bottom:8px}.create-note-row{display:flex;gap:10px;align-items:stretch}.color-select{font:inherit;font-size:12px;color:#3d493d;border:1px solid #0002;border-radius:8px;min-height:46px;padding:0 26px 0 12px;cursor:pointer;max-width:100%}.color-select:focus-visible{outline:3px solid #408772;outline-offset:2px}.note-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px 10px 18px}.note-footer .note-label{padding:0;white-space:nowrap;font-size:10px;letter-spacing:0}.note-color{min-height:36px;font-size:11px;padding-left:8px;border-color:#0002;background-color:transparent}.note textarea{padding-bottom:8px}@media(max-width:900px)and (min-width:541px){.intro{flex-wrap:wrap}.create-note-controls{margin-left:auto}}@media(max-width:540px){.create-note-controls{width:100%}.create-note-row .add-button{flex:1;padding-left:12px;padding-right:12px}.create-note-row>.color-select{width:118px;min-width:0}.note-color{min-height:44px}.note-footer{padding-bottom:6px}.note textarea{line-height:1.6}}.note{background-image:linear-gradient(175deg,#ffffff18,transparent 38%,#00000005);border-radius:2px 3px 10px;transform:rotate(var(--tilt, -1deg));transform-origin:center;box-shadow:0 1px 2px #40453018,2px 7px 9px -4px #40453035,5px 13px 17px -10px #40453038}.note.dragging{box-shadow:0 2px 4px #40453018,4px 12px 18px -5px #40453040,8px 20px 25px -12px #40453038}.note textarea{font-family:Yomogi,Noto Sans JP,sans-serif;font-size:18px;font-weight:400;line-height:1.7;letter-spacing:.03em}.search-bar{display:flex;align-items:center;gap:14px;margin-bottom:22px}.search-bar>label{font-size:12px;color:#748074;white-space:nowrap}.search-field{display:flex;align-items:center;max-width:400px;width:100%;min-width:0;min-height:46px;border:1px solid #d8ddd0;border-radius:9px;background:#fafbf7;overflow:hidden}.search-field:focus-within{outline:2px solid #408772;outline-offset:2px}.search-field input{font:inherit;font-size:13px;color:#303b36;background:transparent;border:0;outline:0;min-width:0;width:100%;padding:13px 14px}.search-field input::-webkit-search-cancel-button{-webkit-appearance:none}.search-field button{border:0;background:transparent;color:#748074;min-width:44px;min-height:44px;font-size:23px}.search-field button:hover{background:#e7e9e0}.note[hidden]{display:none}.count{white-space:nowrap}@media(max-width:540px){.search-bar{align-items:stretch;flex-direction:column;gap:8px}.search-field{max-width:none}.search-field input{font-size:16px}}.status-filters{display:flex;gap:4px;padding:4px;background:#e8ebdf;border-radius:10px;width:fit-content;max-width:100%;margin-bottom:20px}.status-filters button{border:0;background:transparent;color:#6b786a;min-height:44px;min-width:88px;padding:8px 20px;border-radius:7px;font:inherit;font-size:13px}.status-filters button[aria-pressed=true]{background:#2c5949;color:#fff;box-shadow:0 2px 5px #24493418}.completed-drop-zone{position:sticky;top:10px;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;border:2px dashed #a9bea6;border-radius:12px;background:#edf2e7;padding:18px 22px;margin-bottom:18px;min-height:80px;transition:background .15s,border-color .15s;box-shadow:0 3px 9px #4045300a}.completed-drop-zone strong{font-size:15px;color:#426748}.completed-drop-zone>span{font-size:12px;color:#71866c}.completed-drop-zone.drag-over{background:#d5e9cb;border-color:#326c40;box-shadow:0 0 0 4px #40877222}.complete-note{font:inherit;font-size:11px;min-height:36px;min-width:84px;border:1px solid #0002;border-radius:20px;background:#ffffff45;color:#42503f;margin-left:auto;margin-right:3px;cursor:pointer}.complete-note:hover{background:#ffffff80}.note.completed{border:1px solid #53745b55}.note.completed textarea{text-decoration:line-through;text-decoration-thickness:1px;color:#64705c}.note.completed .complete-note{background:#376143;color:#fff;border-color:#376143}.note.dragging{z-index:50;pointer-events:none}.note.dragging .note-handle{pointer-events:auto}@media(max-width:540px){.status-filters{width:100%}.status-filters button{flex:1;min-width:0;padding:8px 12px}.completed-drop-zone{flex-direction:column;align-items:flex-start;gap:5px;padding:13px 16px;top:6px}.completed-drop-zone>span{font-size:11px}.complete-note{min-height:44px}}.project-panel{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:18px;margin-bottom:24px;border:1px solid #d8ddd0;border-radius:12px;background:#f0f2e9}.project-selector{flex:1;min-width:0;max-width:440px}.project-selector label{display:block;font-size:11px;color:#748074;margin-bottom:8px}.project-selector select{font:inherit;font-size:14px;min-height:46px;width:100%;padding:10px 12px;background:#fafbf7;border:1px solid #cbd3c3;border-radius:8px;color:#303b36;text-overflow:ellipsis}.project-actions{display:flex;gap:8px;flex-wrap:wrap}.project-actions button{font:inherit;font-size:12px;min-height:46px;padding:10px 14px;background:#fafbf7;border:1px solid #cbd3c3;border-radius:8px;color:#3c5743}.project-actions button:hover{background:#e4ebdc}.project-actions .danger-button{color:#96534b}.project-selector select:focus-visible{outline:3px solid #408772;outline-offset:2px}.board-toolbar>div{min-width:0}.board-toolbar #board-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px}.board-toolbar .count,.board-dot{flex-shrink:0}@media(max-width:768px){.project-panel{align-items:stretch;flex-direction:column}.project-selector{max-width:none}.project-actions button{flex:1}.board-toolbar{flex-wrap:wrap}.board-toolbar #board-title{max-width:180px}}@media(max-width:540px){.project-panel{padding:14px}.project-actions{gap:6px}.project-actions button{padding:10px 8px}}.board-toolbar .board-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.board-actions button{font:inherit;font-size:12px;min-height:44px;min-width:66px;padding:9px 14px;border:1px solid #cbd3c3;border-radius:8px;background:#fafbf7;color:#3c5743}.board-actions button:hover{background:#e4ebdc}@media(max-width:540px){.board-toolbar .board-actions{gap:8px}.board-actions .hint{display:none}}:root{color-scheme:light}.header-actions{display:flex;align-items:center;gap:18px}.theme-toggle{font:inherit;min-height:44px;padding:9px 14px;border:1px solid #cbd3c3;border-radius:8px;background:#fafbf7;color:#3c5743;white-space:nowrap;font-size:12px}.theme-toggle:hover{background:#e4ebdc}:root[data-theme=dark]{color-scheme:dark;background:#171e1b;color:#e5ece5}[data-theme=dark] .header{border-color:#3b4940}[data-theme=dark] :is(.brand small,.storage-status,.eyebrow,.description,.new-color-label,.search-bar>label,.project-selector label,.hint,footer){color:#a6b7a8}[data-theme=dark] .brand-icon{background:#426c58;color:#f4f2dc}[data-theme=dark] .project-panel{background:#222e26;border-color:#415344}[data-theme=dark] :is(.project-selector select,.project-actions button,.board-actions button,.theme-toggle,.search-field){background:#2b3930;color:#e3ece1;border-color:#536750}[data-theme=dark] :is(.project-actions button,.board-actions button,.theme-toggle):hover{background:#3b4e40}[data-theme=dark] .project-actions .danger-button{color:#f1b4a9}[data-theme=dark] .search-field input{color:#e3ece1}[data-theme=dark] .search-field input::placeholder{color:#abb9a9}[data-theme=dark] .search-field button{color:#c8d4c2}[data-theme=dark] .search-field button:hover{background:#3b4e40}[data-theme=dark] :is(.add-button,.status-filters button[aria-pressed=true]){background:#406f58;color:#fff}[data-theme=dark] .add-button:hover{background:#4e8167}[data-theme=dark] .status-filters{background:#26342a}[data-theme=dark] .status-filters button{color:#bdcbb9}[data-theme=dark] .count{background:#344637;color:#d3dfce}[data-theme=dark] .board{background-color:#202a23;background-image:radial-gradient(#425242 .8px,transparent .8px);border-color:#3c503d}[data-theme=dark] .empty-state{color:#a6b99f}[data-theme=dark] .empty-state>span{color:#a6b99f}[data-theme=dark] .completed-drop-zone{background:#263b2b;border-color:#72936e}[data-theme=dark] .completed-drop-zone strong{color:#d4e6cb}[data-theme=dark] .completed-drop-zone>span{color:#aec6a5}[data-theme=dark] .completed-drop-zone.drag-over{background:#365b3c;border-color:#a4cc96}[data-theme=dark] .note{color-scheme:light;box-shadow:0 2px 3px #0003,3px 8px 12px -4px #0006,5px 14px 19px -9px #0007}[data-theme=dark] .note.dragging{box-shadow:0 3px 6px #0004,5px 14px 22px -4px #0008}[data-theme=dark] #new-note-color{color-scheme:light}@media(max-width:540px){.header-actions{width:100%;justify-content:space-between;gap:8px}.header-actions .storage-status{margin-left:0}.theme-toggle{padding:9px 12px}}