@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800&display=swap";@import"https://fonts.googleapis.com/css2?family=Klee+One:wght@400;600&display=swap";:root{font-family:Noto Sans JP,sans-serif;color:#293c35;background:#f7f7f2;font-synthesis:none}*{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 #487e66;outline-offset:3px}.header{height:90px;margin:0 5%;display:flex;align-items:center;border-bottom:1px solid #dedfd6;gap:30px}.brand{text-decoration:none;color:#293c35;font-size:32px;font-weight:800;letter-spacing:-1.5px;display:flex;align-items:center}.brand-icon{background:#314d3f;color:#f5e8a9;border-radius:10px;font-size:25px;width:37px;height:37px;display:grid;place-items:center;margin-right:11px;letter-spacing:0}.brand-dot{color:#7b9b72}.header-caption{color:#90958c;font-size:12px}.save-status{margin-left:auto;font-size:12px;color:#718477;white-space:nowrap}main{max-width:1500px;margin:0 auto;padding:51px 5% 20px}.intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:32px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.3px;color:#8a9885}h1{font-size:34px;letter-spacing:-1.5px;margin:12px 0}p{font-size:13px;color:#898f83;line-height:1.8;margin:0}.add-button{border:0;border-radius:9px;background:#345441;color:#fff;padding:14px 23px;font-size:13px;box-shadow:0 4px 8px #30493115;white-space:nowrap}.add-button:hover{background:#426c52}.add-button span{font-size:21px;vertical-align:-1px;margin-right:9px}.workspace{border:1px solid #dedfd3;border-radius:13px;overflow:hidden;background:#fcfcf8;box-shadow:0 5px 20px #30493104}.board-toolbar{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 25px;border-bottom:1px solid #e6e7de;gap:10px}.board-title{font-size:13px;font-weight:600;display:flex;align-items:center;gap:10px}.board-icon{font-size:22px;color:#8b9787}.count{font-size:10px;background:#eceee5;color:#7b8974;border-radius:5px;padding:3px 7px}.board-hint{font-size:11px;color:#9aa08e}.board{position:relative;min-height:520px;background-image:radial-gradient(#d7dccd 1px,transparent 1px);background-size:22px 22px;overflow:hidden}.empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:24px}.empty[hidden]{display:none}.empty>span{font-size:50px;color:#9cae8c;margin-bottom:12px}.empty h2{font-size:18px;font-weight:500;margin:0 0 10px}.empty button{margin-top:22px;border:1px solid #d3dbca;color:#58764e;background:#f1f4e9;padding:12px 18px;border-radius:7px;font-size:12px}.board-footer{border-top:1px solid #e6e7de;min-height:42px;padding:12px 24px;display:flex;justify-content:space-between;font-size:10px;color:#9a9f91;gap:12px}.board-footer i{display:inline-block;width:5px;height:5px;background:#94aa80;border-radius:50%;margin-right:7px}.board-footer>span:last-child{font-family:Georgia,serif;font-style:italic;font-size:12px}.page-footer{display:flex;justify-content:space-between;gap:15px;margin-top:24px;font-size:10px;color:#a0a595}.page-footer>span:last-child{font-size:9px;letter-spacing:1.5px}.note{position:absolute;width:240px;height:234px;border-radius:3px 3px 16px;background:var(--note-color);box-shadow:2px 5px 9px #343e3212;display:flex;flex-direction:column;transition:box-shadow .15s}.note.dragging{box-shadow:4px 12px 20px #343e3228;z-index:100}.note-top{display:flex;justify-content:space-between;align-items:center;padding:3px 7px;border-bottom:1px solid #00000006}.drag-handle{touch-action:none;cursor:grab;flex:1;text-align:left;height:40px;background:transparent;border:0;color:#00000040;font-size:22px;display:flex;align-items:center;gap:8px}.drag-handle span{font-size:8px;letter-spacing:1.5px}.dragging .drag-handle{cursor:grabbing}.delete-note{border:0;background:transparent;color:#00000050;font-size:23px;width:40px;height:40px;border-radius:6px}.delete-note:hover{background:#0000000b}.note textarea{font:400 14px/1.9 Noto Sans JP,sans-serif;color:#454b39;resize:none;border:0;background:transparent;outline:0;margin:10px 19px 5px;flex:1;min-height:0;width:calc(100% - 38px)}.note textarea::placeholder{color:#00000045}.note textarea:focus-visible{box-shadow:0 2px #00000015}.note-bottom{display:flex;justify-content:space-between;align-items:center;padding:10px 18px 14px}.colors{display:flex;gap:6px}.color-button{width:20px;height:20px;border:1px solid #00000012;border-radius:50%;background:var(--swatch);padding:0}.color-button[aria-pressed=true]{outline:1px solid #63715b;outline-offset:2px}.note-number{font-size:9px;color:#00000035;letter-spacing:1px}@media(min-width:768px){.color-button{width:13px;height:13px}}@media(max-width:767px){.header{height:72px;margin:0 5%;gap:10px}.brand{font-size:27px}.brand-icon{width:32px;height:32px;font-size:22px}.header-caption{display:none}.save-status{font-size:10px}main{padding-top:30px}.intro{align-items:flex-start;flex-direction:column;margin-bottom:22px;gap:21px}h1{font-size:28px;margin:10px 0}.eyebrow{font-size:8px}.intro p{font-size:11px}.add-button{width:100%;padding:11px 20px;min-height:48px}.board-toolbar{height:56px;padding:0 14px}.board-hint{font-size:9px}.board-title{font-size:12px;gap:7px}.board{min-height:500px}.note{width:240px;height:240px}.delete-note,.drag-handle{height:44px}.color-button{width:26px;height:26px}.colors{gap:8px}.board-footer{padding:12px;font-size:9px}.board-footer>span:last-child{display:none}.page-footer{font-size:9px;line-height:1.8;flex-direction:column;gap:5px}.empty h2{font-size:15px}.empty p{font-size:11px}}.add-note-control{position:relative}.color-picker{position:absolute;z-index:200;right:0;top:calc(100% + 10px);width:270px;padding:15px;background:#fffef9;border:1px solid #dcded3;border-radius:12px;box-shadow:0 12px 30px #293c3524}.color-picker[hidden]{display:none}.color-picker-label{margin:0 0 10px;color:#5f6d63;font-size:11px;font-weight:700}.add-colors{display:grid;grid-template-columns:1fr 1fr;gap:7px}.add-color-button{display:flex;align-items:center;gap:8px;min-height:42px;padding:7px 9px;border:1px solid #e3e4db;border-radius:8px;background:#fafaf5;color:#4e5b52;font-size:11px;text-align:left}.add-color-button:hover{border-color:#9bab92;background:#f3f5ed}.add-color-swatch{width:23px;height:23px;flex:0 0 auto;border:1px solid #00000010;border-radius:6px;background:var(--swatch)}@media(max-width:767px){.add-note-control{width:100%}.color-picker{left:0;right:0;width:100%;top:calc(100% + 8px)}.add-color-button{min-height:48px;font-size:12px}.add-color-swatch{width:28px;height:28px}}.note{transform:rotate(var(--note-tilt,0deg));transform-origin:50% 8%;box-shadow:0 1px 1px #2f3c3120,3px 7px 12px #2f3c3126,10px 16px 24px #2f3c310d;transition:box-shadow .18s ease,transform .18s ease}.note textarea{font-family:Klee One,Yu Mincho,serif;font-size:16px;font-weight:600;letter-spacing:.035em}.note:after{content:"";position:absolute;z-index:-1;right:7px;bottom:5px;left:8px;height:18px;border-radius:50%;background:#2f3c3124;filter:blur(8px);transform:rotate(calc(var(--note-tilt,0deg) * -1))}.note:hover{box-shadow:0 2px 2px #2f3c311c,4px 10px 16px #2f3c312b,12px 20px 28px #2f3c3110}.note.dragging{transform:rotate(0) scale(1.025);box-shadow:0 4px 5px #2f3c3124,7px 18px 28px #2f3c3133}@media(max-width:767px){.note{transform:rotate(calc(var(--note-tilt,0deg) * .72))}}.board-controls{display:flex;align-items:center;gap:14px;margin:0 0 18px}.search-box{display:flex;align-items:center;gap:8px;width:min(340px,100%);height:44px;padding:0 14px;border:1px solid #daddd2;border-radius:9px;background:#fffef9;color:#809080}.search-box:focus-within{border-color:#789079;box-shadow:0 0 0 3px #6e8f7020}.search-box input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#33483d;font:inherit;font-size:12px}.filter-tabs{display:flex;padding:4px;border:1px solid #daddd2;border-radius:9px;background:#ecefe8}.filter-button{min-height:34px;padding:5px 14px;border:0;border-radius:6px;background:transparent;color:#718075;font-size:11px}.filter-button.is-active{background:#fff;color:#314f40;box-shadow:0 1px 5px #314f4018;font-weight:700}.result-count{margin-left:auto;color:#718075;font-size:12px;font-weight:700;white-space:nowrap}.note[hidden]{display:none}.complete-note{width:34px;height:34px;border:1px solid #00000018;border-radius:50%;background:#ffffff38;color:#0000004d;font-size:15px;font-weight:800}.complete-note:hover{background:#ffffff70}.complete-note[aria-pressed=true]{border-color:#54735c;background:#54735c;color:#fff}.note.is-completed{opacity:.56}.note.is-completed textarea{text-decoration:line-through;text-decoration-thickness:1.5px}.completed-zone{display:flex;align-items:center;gap:12px;margin:14px 18px;padding:14px 18px;border:2px dashed #b5c4ae;border-radius:10px;background:#f3f6ed;color:#526b57;transition:.15s}.completed-zone-icon{display:grid;place-items:center;width:34px;height:34px;flex:0 0 auto;border-radius:50%;background:#dce8d5;font-weight:800}.completed-zone strong,.completed-zone small{display:block}.completed-zone strong{font-size:12px}.completed-zone small{margin-top:2px;color:#859181;font-size:9px}.completed-zone b{margin-left:auto;font-size:11px}.completed-zone.is-drag-over{border-color:#4e7657;background:#e2eddb;transform:scale(1.008)}@media(max-width:767px){.board-controls{align-items:stretch;flex-wrap:wrap;gap:9px}.search-box{width:100%;height:48px}.filter-tabs{flex:1}.filter-button{flex:1;min-height:40px;padding:5px 10px}.result-count{display:flex;align-items:center}.completed-zone{margin:10px;padding:13px}.completed-zone small{font-size:8px}.complete-note{width:40px;height:40px}}.project-bar{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:10px 12px;border:1px solid #daddd2;border-radius:11px;background:#fcfcf8}.project-select-label{display:flex;align-items:center;gap:10px;color:#7a887e;font-size:10px;font-weight:700;letter-spacing:.08em}.project-select-label select{min-width:190px;height:38px;padding:0 34px 0 12px;border:1px solid #d7dbd0;border-radius:7px;background:#fff;color:#31483c;font:600 12px Noto Sans JP,sans-serif}.project-actions{display:flex;gap:6px}.project-actions button,.arrange-button{min-height:36px;padding:7px 11px;border:1px solid #d7dbd0;border-radius:7px;background:#fff;color:#607167;font-size:10px}.project-actions button:hover,.arrange-button:hover{border-color:#8fa18c;background:#f3f6ee}.arrange-button{margin-left:auto;color:#345441;font-weight:700}.arrange-button span{margin-right:6px}.note.is-arranging{transition:left .25s ease,top .25s ease,box-shadow .18s ease,transform .18s ease}@media(max-width:767px){.project-bar{align-items:stretch;flex-wrap:wrap}.project-select-label{width:100%;align-items:flex-start;flex-direction:column;gap:5px}.project-select-label select{width:100%;height:44px}.project-actions{flex:1}.project-actions button{flex:1;min-height:42px;padding:6px}.arrange-button{min-height:42px}.board-controls{margin-top:0}}.completed-zone{position:absolute;right:18px;bottom:18px;z-index:140;width:clamp(180px,24%,260px);min-height:52px;margin:0;padding:8px 10px;gap:8px}.completed-zone .completed-zone-icon{width:28px;height:28px}.completed-zone small{font-size:8px}.completed-zone b{font-size:9px}.completed-zone.is-drag-over{border-color:#3e6d49;background:#dbead3;box-shadow:0 0 0 5px #527b5530;transform:scale(1.04)}.note.over-completed-zone{opacity:.72;transform:rotate(0) scale(.96)}@media(max-width:767px){.completed-zone{right:10px;bottom:10px;width:180px}}.project-dialog{width:min(420px,calc(100% - 32px));padding:0;border:0;border-radius:14px;background:#fffef9;color:#30463b;box-shadow:0 20px 60px #24372d45}.project-dialog::backdrop{background:#26372f66;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.project-dialog form{padding:24px}.project-dialog h2{margin:0 0 9px;font-size:18px}.project-dialog p{margin-bottom:18px;color:#7a877e;font-size:12px;white-space:pre-line}.project-dialog label span{display:block;margin-bottom:7px;color:#617167;font-size:11px;font-weight:700}.project-dialog input{width:100%;height:46px;padding:0 12px;border:1px solid #cfd6ca;border-radius:8px;background:#fff;color:#30463b;font:inherit}.project-dialog input:focus{outline:3px solid #53745b25;border-color:#66816b}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:22px}.dialog-actions button{min-width:90px;min-height:42px;border:1px solid #d2d8ce;border-radius:8px;background:#fff;color:#647168}.dialog-actions .dialog-confirm{border-color:#345441;background:#345441;color:#fff;font-weight:700}.dialog-actions .is-danger{border-color:#984d48;background:#984d48}.arrange-button.did-arrange{animation:arranged .35s ease}@keyframes arranged{50%{background:#dcead7;transform:scale(1.06)}}.theme-toggle{display:flex;align-items:center;gap:6px;min-height:36px;padding:6px 11px;border:1px solid #d8ddd3;border-radius:999px;background:#fffef9;color:#53675c;font-size:10px;white-space:nowrap}.theme-toggle:hover{border-color:#8da08f;background:#f0f4eb}.theme-icon{font-size:15px;line-height:1}html,body,.header,.workspace,.project-bar,.board-controls,.board-toolbar,.board-footer,.page-footer,.search-box,.filter-tabs,.color-picker,.project-dialog,.project-select-label select,.project-dialog input,.project-actions button,.arrange-button,.add-color-button{transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease}html[data-theme=dark]{color-scheme:dark;background:#17201c;color:#e4e9e2}html[data-theme=dark] body{background:#17201c}html[data-theme=dark] .header{border-color:#354039}html[data-theme=dark] .brand,html[data-theme=dark] h1,html[data-theme=dark] .board-title{color:#e6ebe4}html[data-theme=dark] .brand-icon{background:#dce8d4;color:#294536}html[data-theme=dark] .header-caption,html[data-theme=dark] .eyebrow,html[data-theme=dark] p,html[data-theme=dark] .page-footer{color:#98a49d}html[data-theme=dark] .save-status{color:#a7baa9}html[data-theme=dark] .theme-toggle{border-color:#46534b;background:#253029;color:#dae4da}html[data-theme=dark] .theme-toggle:hover{background:#303e35}html[data-theme=dark] .workspace,html[data-theme=dark] .project-bar{border-color:#3a463e;background:#202a24;box-shadow:0 8px 28px #00000025}html[data-theme=dark] .board-toolbar,html[data-theme=dark] .board-footer{border-color:#39443d;background:#212b25;color:#a2ada6}html[data-theme=dark] .board{background-color:#1b251f;background-image:radial-gradient(#465249 1px,transparent 1px)}html[data-theme=dark] .count,html[data-theme=dark] .filter-tabs{background:#303a34;color:#bec8c0}html[data-theme=dark] .search-box,html[data-theme=dark] .project-select-label select,html[data-theme=dark] .project-actions button,html[data-theme=dark] .arrange-button{border-color:#465249;background:#242f28;color:#d8e0da}html[data-theme=dark] .search-box input{color:#e2e8e3}html[data-theme=dark] .search-box input::placeholder{color:#89968e}html[data-theme=dark] .filter-tabs{border-color:#465249}html[data-theme=dark] .filter-button{color:#a9b5ad}html[data-theme=dark] .filter-button.is-active{background:#425147;color:#fff;box-shadow:none}html[data-theme=dark] .result-count{color:#acb9b0}html[data-theme=dark] .completed-zone{border-color:#60705f;background:#2b382e;color:#d0ddce}html[data-theme=dark] .completed-zone-icon{background:#455744;color:#edf4ea}html[data-theme=dark] .completed-zone small{color:#a9b6a7}html[data-theme=dark] .color-picker,html[data-theme=dark] .project-dialog{border-color:#465249;background:#252f29;color:#e1e7e2}html[data-theme=dark] .add-color-button,html[data-theme=dark] .project-dialog input,html[data-theme=dark] .dialog-actions button{border-color:#4b574f;background:#303b34;color:#dbe2dc}html[data-theme=dark] .dialog-actions .dialog-confirm{background:#54745f;color:#fff}html[data-theme=dark] .empty button{border-color:#50604f;background:#2c392e;color:#bcd2b8}html[data-theme=dark] .note{box-shadow:0 2px 2px #0004,4px 10px 18px #0005,12px 20px 30px #0002}html[data-theme=dark] .note textarea{color:#303c32}html[data-theme=dark] .note textarea::placeholder{color:#39433a99}@media(max-width:767px){.header{flex-wrap:wrap}.theme-toggle{margin-left:auto}.save-status{margin-left:0}.theme-label{display:none}.theme-toggle{width:40px;justify-content:center;padding:6px}}