@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&family=Yomogi&display=swap";:root{font-family:Noto Sans JP,sans-serif;color:#343630;background:#f8f7f3;font-synthesis:none;--accent:#52624d}*{box-sizing:border-box}body{margin:0}button,a,textarea{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #58794c;outline-offset:4px}.header{height:96px;border-bottom:1px solid #e5e5de;padding:0 5%;display:flex;align-items:center;gap:32px}.brand{text-decoration:none;color:inherit;display:flex;align-items:center;gap:13px;font-size:25px;font-weight:600;letter-spacing:4px}.brand-icon{display:grid;place-items:center;width:40px;height:44px;background:#e2e7dc;border-radius:11px;font-size:36px;letter-spacing:0;color:#607254}.brand-en{display:block;font-size:8px;letter-spacing:1px;margin-top:2px}.header-caption{font-size:12px;color:#95978c}.save-status{margin-left:auto;font-size:11px;color:#737d6d;display:flex;gap:8px;align-items:center}.save-status>span,.tiny-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#819477}.save-status.error{color:#a13d32}main{max-width:1500px;padding:48px 5% 0;margin:auto}.intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:34px}.eyebrow{font-size:10px;letter-spacing:2.3px;color:#88927e;margin:0 0 13px}h1{font-size:29px;letter-spacing:1.2px;font-weight:500;margin:0 0 12px}.subtitle{font-size:12px;line-height:1.9;color:#8b8d83;margin:0}.add-button{border:0;border-radius:9px;padding:14px 23px;background:var(--accent);color:#fff;font-size:13px;display:flex;align-items:center;gap:12px;white-space:nowrap;box-shadow:0 3px 5px #35402d12}.add-button:hover{background:#42533d}.add-button>span{font-size:23px;line-height:1}.board-shell{border:1px solid #dedfd5;border-radius:13px;overflow:hidden;background:#fdfcf9}.toolbar{min-height:59px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 24px;border-bottom:1px solid #e5e5dd}.board-label{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:500}.board-symbol{font-size:19px;color:#818876}.count{background:#eeeee7;color:#898d80;min-width:23px;padding:3px 6px;text-align:center;border-radius:5px;font-size:10px}.toolbar-hint{font-size:10px;color:#999c90}.board{position:relative;min-height:490px;background-color:#f7f7f1;background-image:radial-gradient(#cfd2c5 .8px,transparent .8px);background-size:20px 20px;isolation:isolate}.empty-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:25px}.empty-state[hidden]{display:none}.empty-art{position:relative;width:150px;height:105px;margin-bottom:22px}.empty-art i{position:absolute;width:70px;height:78px;border-radius:3px;box-shadow:1px 4px 10px #454c2910;top:15px;left:7px;background:#eee1b5;transform:rotate(-16deg)}.empty-art i:nth-child(2){left:76px;top:10px;background:#dce5d5;transform:rotate(16deg)}.empty-art i:nth-child(3){left:39px;top:1px;background:#fff0b8;transform:rotate(-4deg)}.empty-art i:nth-child(3):after{content:"";position:absolute;left:17px;right:17px;top:27px;height:14px;border-top:2px solid #d6c68f;border-bottom:2px solid #d6c68f}.empty-state h2{font-size:19px;font-weight:500;letter-spacing:2px;margin:0 0 12px}.empty-state p{font-size:12px;line-height:2;color:#929487;margin:0}.empty-add{margin-top:23px;border:1px solid #cbd1c3;border-radius:7px;background:#ffffff70;color:#67765d;padding:11px 17px;font-size:12px;min-height:44px}.board-footer{display:flex;justify-content:space-between;gap:12px;padding:15px 23px;font-size:9px;color:#999d8e;border-top:1px solid #e4e5dc}.tiny-dot{width:5px;height:5px;margin-right:5px}.page-footer{display:flex;justify-content:space-between;font-size:10px;color:#a3a699;padding:22px 1px}.page-footer>span:last-child{font-size:8px;letter-spacing:1.6px}.note{position:absolute;width:232px;height:222px;border-radius:3px 3px 15px;background:var(--note-color);box-shadow:2px 5px 9px #4a4f2812;display:flex;flex-direction:column;border:1px solid #00000004}.note.dragging{box-shadow:4px 12px 20px #4a4f2826;z-index:10;cursor:grabbing}.note-header{height:44px;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:0 6px 0 13px}.drag-handle{touch-action:none;cursor:grab;border:0;color:#625e495c;background:transparent;height:44px;flex:1;text-align:left;font-size:19px;letter-spacing:2px}.drag-handle:active{cursor:grabbing}.delete-note{width:44px;height:44px;display:grid;place-items:center;background:transparent;border:0;color:#756f5d80;border-radius:6px}.delete-note:hover{background:#00000008;color:#8e5146}.delete-note svg{width:16px;height:16px}.note textarea{font:400 14px/1.9 Noto Sans JP,sans-serif;color:#4e4d41;background:transparent;border:0;resize:none;width:100%;flex:1;min-height:0;padding:0 18px 8px;outline:none}.note textarea::placeholder{color:#78756388}.note textarea:focus-visible{box-shadow:inset 0 0 0 2px #646d4733}.note-bottom{display:flex;justify-content:space-between;align-items:center;padding:3px 12px 8px;height:39px;flex-shrink:0}.colors{display:flex;gap:1px}.color-button{width:29px;height:29px;border:0;background:transparent;padding:7px;border-radius:50%;display:grid;place-items:center}.color-button:after{content:"";display:block;background:var(--swatch);height:14px;width:14px;border:1px solid #00000014;border-radius:50%}.color-button[aria-pressed=true]:after{outline:1px solid #72755c;outline-offset:2px}.note-number{font-size:9px;letter-spacing:1px;color:#79786180}.message{font-size:12px;color:#987149;min-height:16px;margin:0 0 10px}@media(min-width:1500px){.board{min-height:570px}}@media(max-width:800px){.header{height:80px;padding:0 24px}.header-caption{display:none}main{padding:34px 24px 0}h1{font-size:24px}.intro{gap:18px}.subtitle{max-width:340px}.add-button{padding:13px 16px}.toolbar{padding:10px 18px}.board{min-height:550px}}@media(max-width:500px){.header{height:74px;padding:0 20px}.brand{font-size:22px}.brand-icon{width:35px;height:39px}.save-status{font-size:9px;gap:5px}main{padding:30px 16px 0}.intro{align-items:stretch;flex-direction:column;gap:21px;margin-bottom:22px}h1{font-size:22px;letter-spacing:.4px}.eyebrow{font-size:9px}.subtitle{font-size:11px;max-width:290px}.add-button{justify-content:center;min-height:50px}.toolbar{padding:10px 13px}.toolbar-hint{font-size:9px;max-width:115px;line-height:1.7}.board{min-height:480px}.note{width:calc(100% - 32px);height:244px}.note textarea{font-size:16px}.note-bottom{height:48px;padding-bottom:3px}.color-button{width:44px;height:44px;padding:14px}.board-footer{padding:13px;font-size:9px}.board-footer>span:last-child{display:none}.page-footer{font-size:9px}.page-footer>span:last-child{display:none}.empty-state{padding:16px}.empty-state p{font-size:11px}}.note textarea{font-family:Yomogi,Noto Sans JP,sans-serif;font-size:18px;line-height:1.8}.note{transform:rotate(var(--note-tilt, -.6deg));transform-origin:50% 18%;background-image:linear-gradient(180deg,#ffffff16 0%,transparent 22%,#00000004 100%);box-shadow:0 1px 2px #45432d14,2px 6px 10px -3px #45432d26,3px 13px 17px -9px #45432d33;transition:box-shadow .16s ease}.note.dragging{box-shadow:0 2px 4px #45432d14,4px 12px 20px -4px #45432d30,6px 22px 28px -12px #45432d33}@media(prefers-reduced-motion:reduce){.note{transition:none}}.note[hidden]{display:none}.board-label{white-space:nowrap}.search-box{display:flex;align-items:center;margin-left:auto;width:min(280px,100%);min-width:0;border:1px solid #dce0d5;border-radius:8px;background:#fffefa}.search-box:focus-within{outline:2px solid #819477;outline-offset:2px}#note-search{width:100%;min-width:0;height:44px;padding:0 12px;border:0;outline:0;border-radius:8px;background:transparent;color:#343630;font:inherit;font-size:14px}#note-search::-webkit-search-cancel-button{-webkit-appearance:none}#clear-search{flex:0 0 44px;height:44px;border:0;border-radius:8px;background:transparent;color:#737d6d;font-size:22px}#clear-search:hover{background:#eeeee7}@media(max-width:900px){.toolbar-hint{display:none}}@media(max-width:500px){.toolbar{flex-wrap:wrap;gap:12px;padding:14px 13px}.search-box{width:100%}#note-search{font-size:16px}#no-results h2{font-size:17px;letter-spacing:0}}.status-filters{display:flex;gap:5px;margin:0 0 18px;padding:4px;width:fit-content;background:#eaece3;border-radius:10px}.status-filters button{min-width:86px;min-height:44px;border:0;border-radius:7px;background:transparent;color:#687160;font-size:13px}.status-filters button[aria-pressed=true]{background:#fffefa;color:#35482e;box-shadow:0 2px 5px #35402d14}.complete-note{flex:0 0 44px;height:44px;border:0;border-radius:50%;background:transparent;color:#777965;font-size:19px}.complete-note{border:1px solid #89957c;background:#ffffff30}.complete-note:hover{background:#ffffff50}.complete-note[aria-pressed=true]{color:#fff;background:#59744e}.note.is-completed{background-color:#e3e8dc;background-image:linear-gradient(#ffffff40,#ffffff10);border:1px solid #a6b29a}.note.is-completed textarea{text-decoration:line-through;text-decoration-color:#89957c;color:#68745f}.note.is-completed .note-number{color:#42603a;font-weight:700}.completed-zone{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:16px;padding:18px;border:2px dashed #b9c6ae;border-radius:10px;background:#eef2e8;color:#536b48}.completed-zone strong{font-size:14px}.completed-zone strong span{margin-left:8px;font-size:11px;font-weight:400}.completed-zone>span{font-size:11px}.board-shell{overflow:visible}.completed-zone{position:sticky;top:12px;z-index:70}.is-dragging .completed-zone{box-shadow:0 8px 30px #34422b30}.completed-zone.drop-hover{background:#d8e7cc;border-color:#526e43;border-style:solid}.note.dragging{z-index:60}@media(max-width:500px){.status-filters{width:100%}.status-filters button{flex:1}.completed-zone{flex-direction:column;align-items:flex-start;gap:6px;margin:12px;padding:14px}}.project-bar{display:flex;align-items:end;gap:16px;margin-bottom:24px;padding:18px;border:1px solid #dce0d5;border-radius:12px;background:#fdfcf9}.project-picker{flex:1;min-width:0}.project-picker label,#project-name-field label{display:block;margin-bottom:8px;font-size:11px;color:#737d6d}#project-select,#project-name{width:100%;min-width:0;height:44px;padding:0 12px;border:1px solid #cbd1c3;border-radius:7px;background:#fffefa;color:#343630;font:inherit;font-size:16px}#project-select{text-overflow:ellipsis}.project-actions,.dialog-actions{display:flex;gap:8px}.project-actions button,.dialog-actions button{min-height:44px;padding:10px 14px;border:1px solid #cbd1c3;border-radius:7px;background:#fffefa;color:#53644a;font-size:12px}button:disabled{cursor:default;opacity:.45}#delete-project{color:#955a4e}#project-dialog{width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:26px;border:1px solid #dce0d5;border-radius:14px;color:#343630;background:#fdfcf9;box-shadow:0 16px 60px #26332130}#project-dialog::backdrop{background:#26332160}#project-dialog h2{font-size:19px;margin:0 0 14px}#project-dialog p{font-size:13px;line-height:1.9;color:#737d6d;overflow-wrap:anywhere}.dialog-actions{margin-top:24px;justify-content:flex-end;flex-wrap:wrap}#submit-project{background:#52624d;color:#fff;border-color:#52624d}#submit-project.danger{background:#98594d;border-color:#98594d}@media(max-width:600px){.project-bar{flex-direction:column;align-items:stretch;padding:14px;gap:12px}.project-actions button{flex:1;padding:10px 8px}}#align-notes{order:1;flex-shrink:0;min-width:64px;min-height:44px;padding:10px 14px;border:1px solid #cbd1c3;border-radius:7px;background:#fffefa;color:#53644a;font-size:12px}#align-notes:hover:not(:disabled){background:#eef2e8}@media(max-width:500px){#align-notes{order:0;margin-left:auto}.toolbar .board-label{order:-1}.toolbar .search-box{order:1}}.brand{font-size:22px;letter-spacing:.5px;white-space:nowrap}@media(max-width:500px){.header{gap:12px}.brand{font-size:16px;gap:8px;letter-spacing:0}.save-status{flex-shrink:0}}:root{color-scheme:light}#theme-toggle{flex-shrink:0;min-height:44px;padding:10px 14px;border:1px solid #cbd1c3;border-radius:8px;background:#fffefa;color:#53644a;font-size:12px}#theme-toggle:hover{background:#eaece3}:root[data-theme=dark]{color-scheme:dark;background:#1c211e;color:#e3e8dd;--accent: #526c48}[data-theme=dark] :is(.header,.board-shell,.toolbar,.board-footer,.project-bar,#project-dialog){border-color:#414b40}[data-theme=dark] :is(.board-shell,.project-bar,#project-dialog){background:#252c26;color:#e3e8dd}[data-theme=dark] .board{background-color:#202720;background-image:radial-gradient(#435040 .8px,transparent .8px)}[data-theme=dark] :is(.header-caption,.subtitle,.eyebrow,.toolbar-hint,.empty-state p,.board-footer,.page-footer,.project-picker label,#project-name-field label,#project-dialog p,.save-status,.board-symbol){color:#afbba6}[data-theme=dark] .brand-icon{background:#394633;color:#c4d5b5}[data-theme=dark] :is(.search-box,#project-select,#project-name,.project-actions button,.dialog-actions button,#align-notes,.empty-add,#theme-toggle){background:#30392e;border-color:#56624f;color:#e0ead7}[data-theme=dark] :is(#note-search,#clear-search){color:#e0ead7}[data-theme=dark] #note-search::placeholder{color:#b0bda8}[data-theme=dark] :is(#theme-toggle:hover,#align-notes:hover:not(:disabled),#clear-search:hover){background:#424f3c}[data-theme=dark] :is(.status-filters,.count){background:#30392e;color:#c0cdb6}[data-theme=dark] .status-filters button{color:#b9c7af}[data-theme=dark] .status-filters button[aria-pressed=true]{background:#526647;color:#fff}[data-theme=dark] .completed-zone{background:#2a3727;border-color:#657b57;color:#c2d9b0}[data-theme=dark] .completed-zone.drop-hover{background:#3e5335;border-color:#bdd9a4}[data-theme=dark] .note{background-color:color-mix(in srgb,var(--note-color) 24%,#252a25);border-color:#ffffff20;box-shadow:0 2px 4px #0004,3px 10px 18px -5px #0007}[data-theme=dark] .note textarea{color:#f2f1e4}[data-theme=dark] .note textarea::placeholder{color:#c0c4b6}[data-theme=dark] :is(.drag-handle,.delete-note,.note-number,.complete-note){color:#d6decb}[data-theme=dark] .complete-note{background:#ffffff0a;border-color:#a8b89a}[data-theme=dark] .complete-note[aria-pressed=true]{background:#526e43;color:#fff}[data-theme=dark] .note.is-completed{background-color:#303d30;border-color:#718369}[data-theme=dark] .note.is-completed textarea{color:#c2d0b6;text-decoration-color:#a0b18e}[data-theme=dark] .note.is-completed .note-number{color:#c6e0b2}[data-theme=dark] .color-button[aria-pressed=true]:after{outline-color:#d9e7c8}[data-theme=dark] :is(button,a,input,select):focus-visible{outline:3px solid #b6d69e;outline-offset:3px}[data-theme=dark] .note textarea:focus-visible{box-shadow:inset 0 0 0 2px #bdcfa8}[data-theme=dark] :is(.save-status.error,#delete-project,.message){color:#f0b6a0}[data-theme=dark] #submit-project{background:#526c48;color:#fff}[data-theme=dark] #submit-project.danger{background:#874d43;color:#fff}[data-theme=dark] #project-dialog::backdrop{background:#0009}@media(max-width:500px){.header{display:grid;grid-template-columns:1fr auto;height:auto;min-height:96px;gap:4px 8px;padding:12px 20px}#theme-toggle{grid-column:2;grid-row:1}.header .save-status{grid-column:1 / -1;margin:0}}
