:root{font-family:Inter,Hiragino Sans,Yu Gothic UI,Yu Gothic,sans-serif;color:#25231f;background:#e8e4da;font-synthesis:none;--header-height: 88px;--note-width: 232px;--note-height: 188px}*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%}body{min-height:100vh;overflow:hidden;display:flex;flex-direction:column}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-header{height:var(--header-height);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 40px;color:#fffdf7;background:#24231f;border-bottom:1px solid #47443c;box-shadow:0 3px 16px #1413102e;position:relative;z-index:20}.brand{display:flex;align-items:center;gap:14px;min-width:0}.brand-mark{width:38px;height:42px;flex:0 0 auto;background:#ffd95a;border-radius:3px 3px 7px;box-shadow:3px 4px #d8aa21;transform:rotate(-3deg)}h1{margin:0;font-size:1.25rem;line-height:1.3;letter-spacing:.04em}.brand p{margin:2px 0 0;color:#bdb9ad;font-size:.8rem;letter-spacing:.04em}.create-controls{display:flex;align-items:center;gap:16px}.create-palette,.note-palette{display:flex;align-items:center;gap:7px;padding:0;margin:0;border:0}.create-palette{padding:7px 10px;border-radius:999px;background:#35332d}.create-palette legend{float:left;margin:0 2px 0 0;color:#d2cec3;font-size:.78rem;line-height:28px}.color-option{position:relative;display:block;width:26px;height:26px;cursor:pointer}.color-option input{position:absolute;opacity:0;pointer-events:none}.color-option span{display:block;width:100%;height:100%;overflow:hidden;color:transparent;border:2px solid transparent;border-radius:50%;box-shadow:inset 0 0 0 1px #46381424;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}.color-option:hover span{transform:scale(1.1)}.color-option input:focus-visible+span{outline:3px solid #fff;outline-offset:2px}.color-option input:checked+span{border-color:#fff;box-shadow:0 0 0 2px #24231f,inset 0 0 0 1px #46381424}.color-option--yellow span{background:#ffd85a}.color-option--pink span{background:#ff9fbd}.color-option--blue span{background:#88c9f3}.color-option--green span{background:#9ddc9b}.add-button{min-height:48px;padding:0 20px;border:0;border-radius:12px;background:#ffd85a;color:#29261c;font-weight:750;font-size:.95rem;box-shadow:0 4px #b98b11;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,background .14s ease}.add-button span{font-size:1.35rem;margin-right:4px;vertical-align:-1px}.add-button:hover{background:#ffe075;transform:translateY(-1px);box-shadow:0 5px #b98b11}.add-button:active{transform:translateY(3px);box-shadow:0 1px #b98b11}.add-button:focus-visible,.note button:focus-visible,.note-text:focus-visible{outline:3px solid #3e77d0;outline-offset:3px}.workspace{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 220px;overflow:hidden;background:#eeeae0}.board-scroll{min-width:0;overflow:auto;overscroll-behavior:contain}.board{position:relative;min-width:100%;min-height:100%;isolation:isolate;background-color:#eeeae0}.board-grid{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(circle,rgb(69 64 53 / 18%) 1px,transparent 1.25px);background-size:24px 24px}.empty-state{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);text-align:center;color:#797469;transition:opacity .2s ease;pointer-events:none}.empty-state[hidden]{display:none}.empty-state p{margin:16px 0 4px;font-weight:700;font-size:1rem}.empty-state small{font-size:.8rem}.empty-note{display:block;width:68px;height:62px;margin:auto;border:2px dashed #aaa498;border-radius:4px;transform:rotate(-4deg)}.note{--note-rotation: -.7deg;position:absolute;width:var(--note-width);height:var(--note-height);padding:40px 20px 20px;--note-bg: #ffd85a;--note-fold-dark: #e7b92e;--note-fold-light: #f5c944;--note-ink: #312b1c;background:var(--note-bg);border:1px solid rgb(116 87 13 / 20%);border-radius:4px 4px 14px;box-shadow:1px 2px 2px #3a2f122e,4px 9px 12px #3a2f1229,11px 20px 30px #3a2f1217;overflow:hidden;transition:box-shadow .18s ease,transform .18s ease;animation:note-in .2s ease-out;touch-action:none;transform:rotate(var(--note-rotation));transform-origin:50% 8%}.note:nth-of-type(4n+2){--note-rotation: .9deg}.note:nth-of-type(4n+3){--note-rotation: -1.15deg}.note:nth-of-type(4n+4){--note-rotation: .45deg}.note[data-color=pink]{--note-bg: #ff9fbd;--note-fold-dark: #e67f9f;--note-fold-light: #f490b0;--note-ink: #492432}.note[data-color=blue]{--note-bg: #88c9f3;--note-fold-dark: #62a8d5;--note-fold-light: #76b9e4;--note-ink: #17354a}.note[data-color=green]{--note-bg: #9ddc9b;--note-fold-dark: #79bc78;--note-fold-light: #8dce8b;--note-ink: #203c22}@keyframes note-in{0%{opacity:0;transform:scale(.96) rotate(calc(var(--note-rotation) - .8deg))}to{opacity:1;transform:scale(1) rotate(var(--note-rotation))}}.note.is-dragging{z-index:10;box-shadow:2px 6px 8px #3a2f122e,13px 28px 42px #3a2f123d;transform:scale(1.025) rotate(var(--note-rotation));transition:box-shadow .1s ease,transform .1s ease;cursor:grabbing}.note.is-arranging{transition:left .3s ease,top .3s ease,box-shadow .18s ease,transform .18s ease}.note.is-completed{filter:saturate(.55);opacity:.76}.note.is-completed .note-text{text-decoration:line-through 2px rgb(48 48 43 / 55%)}.note.is-completed .complete-button{color:#fff;background:#3c7650;opacity:1;box-shadow:0 2px 5px #1e4a2c40}.note-toolbar{position:absolute;inset:7px 7px auto 8px;display:flex;justify-content:space-between;align-items:center}.note-palette{gap:4px}.note-palette .color-option{width:18px;height:18px}.note-palette .color-option input:checked+span{border-color:#ffffffe5;box-shadow:0 0 0 1px var(--note-ink)}.note button{border:0;background:transparent;color:#66531d;cursor:pointer}.drag-handle,.delete-button{width:36px;height:36px;border-radius:50%;display:grid;place-items:center}.drag-handle{cursor:grab;font-size:1.25rem;opacity:.7}.drag-handle:active{cursor:grabbing}.delete-button{font-size:1.45rem;line-height:1;opacity:.65}.complete-button{position:absolute;left:5px;top:132px;min-width:62px;height:32px;display:flex;align-items:center;justify-content:center;gap:4px;border-radius:999px;font-size:.76rem;font-weight:750;opacity:.72}.complete-button:after{content:"完了"}.complete-button[aria-pressed=true]:after{content:"戻す"}.note button:hover{background:#6b500a1a;opacity:1}.note-text{display:block;width:100%;height:100%;padding:0 0 34px;resize:none;border:0;outline:0;background:transparent;color:var(--note-ink);font-family:Klee One,YuKyokasho,Yu Kyokasho,Tsukushi A Round Gothic,Hiragino Maru Gothic ProN,cursive;font-size:1rem;font-weight:500;letter-spacing:.035em;line-height:1.7}.note-text::placeholder{color:#8f792f;opacity:.65}.note-fold{position:absolute;right:0;bottom:0;width:28px;height:28px;background:linear-gradient(135deg,var(--note-fold-dark) 0 48%,var(--note-fold-light) 50%);border-radius:5px 0 0;box-shadow:-2px -2px 4px #5b450c1a}.control-bar{flex:0 0 auto;position:relative;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 28px;background:#faf8f2;border-bottom:1px solid #d8d3c7;box-shadow:0 2px 8px #38332714}.project-controls,.view-controls{display:flex;align-items:center;gap:8px;min-width:0}.project-controls>label{color:#706b60;font-size:.78rem;font-weight:700}.control-label{color:#706b60;font-size:.78rem;font-weight:700}.control-bar select,.control-bar input,.control-bar button{min-height:38px;border:1px solid #d0cbc0;border-radius:9px;background:#fff;color:#302e29;font-size:.84rem}.control-bar select{width:168px;padding:0 32px 0 11px;font-weight:700}.control-bar button{padding:0 11px;cursor:pointer;font-weight:650}.control-bar button:hover{border-color:#918b7e;background:#f4f1e9}.control-bar button:disabled{cursor:not-allowed;opacity:.38}.control-bar .danger-control:not(:disabled){color:#a43d3d}.arrange-button{white-space:nowrap}.arrange-button span{margin-right:3px;font-size:1rem}.theme-button{width:40px;padding:0!important;font-size:1.12rem!important}.status-tabs{display:flex;padding:3px;border-radius:11px;background:#e8e4da}.status-tabs button{min-height:32px;border:0;background:transparent;padding:0 12px}.status-tabs button[aria-pressed=true]{color:#fff;background:#34322d;box-shadow:0 2px 5px #26231d2e}.search-box{position:relative;display:block}.search-box>span{position:absolute;left:11px;top:50%;transform:translateY(-53%);color:#7f796d;font-size:1.1rem}.control-bar .search-box input{width:190px;padding:0 12px 0 34px;outline:none}.control-bar .search-box input:focus{border-color:#4f7fb9;box-shadow:0 0 0 3px #4f7fb926}.result-count{min-width:70px;color:#625d52;font-size:.82rem;font-weight:750;white-space:nowrap;text-align:right}.completed-zone{position:relative;z-index:2;width:auto;min-height:0;margin:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#69736b;background:#fafcf7db;border:2px dashed #9bab9c;border-radius:16px;pointer-events:none;transition:background .15s ease,border-color .15s ease,transform .15s ease}.completed-zone strong{font-size:.92rem}.completed-zone small{max-width:150px;font-size:.72rem;line-height:1.5;text-align:center}.completed-zone-count{margin:8px 0 2px;color:#385c41;font-size:1.6rem;font-weight:800}.completed-zone-icon{width:30px;height:30px;display:grid;place-items:center;color:#fff;background:#62856b;border-radius:50%;font-weight:800}.completed-zone.is-drag-over{background:#dff1e2;border-color:#39734a;transform:scale(1.03)}@media(max-width:900px){:root{--header-height: 80px;--note-width: 210px;--note-height: 176px}.app-header{padding:0 24px}.create-controls{gap:10px}.create-palette legend{display:none}.control-bar{align-items:stretch;flex-direction:column;gap:8px;padding:9px 18px}.project-controls,.view-controls{width:100%}.project-controls select,.search-box{flex:1}.control-bar .search-box input{width:100%}.workspace{display:flex;flex-direction:column;overflow:hidden}.completed-zone{order:-1;flex:0 0 72px;margin:8px 18px 0;flex-direction:row;gap:9px}.completed-zone-count{margin:0;font-size:1rem}.completed-zone small{max-width:none}.board-scroll{flex:1 1 auto;min-height:0}}@media(max-width:520px){:root{--header-height: 74px;--note-width: 172px;--note-height: 158px}.app-header{padding:0 14px 0 16px;gap:12px}.brand{gap:10px}.brand-mark{width:29px;height:32px;box-shadow:2px 3px #d8aa21}h1{font-size:1.02rem;white-space:nowrap}.brand p{display:none}.add-button{min-height:48px;padding:0 13px;border-radius:10px;font-size:.88rem;white-space:nowrap}.add-button span{font-size:1.2rem;margin-right:1px}.create-controls{gap:8px}.create-palette{gap:5px;padding:6px 7px}.create-palette .color-option{width:24px;height:24px}.create-palette .color-option input:checked+span{box-shadow:0 0 0 1px #24231f,inset 0 0 0 1px #46381424}.note{padding:42px 15px 15px}.drag-handle,.delete-button{width:40px;height:40px}.note-toolbar{inset:2px 2px auto 4px}.note-text{font-size:1rem;line-height:1.55}.complete-button{min-width:64px;height:38px;left:2px;top:108px}.control-bar{padding:8px 10px;gap:7px}.project-controls>label{display:none}.project-controls{gap:5px}.project-controls select{width:110px;min-width:0}.control-bar button{padding:0 9px}.project-controls #project-rename{font-size:0}.project-controls #project-rename:after{content:"変更";font-size:.8rem}.view-controls{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:7px}.view-controls .control-label{display:none}.status-tabs{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,1fr)}.status-tabs button{min-height:36px}.workspace{display:flex;flex-direction:column;overflow:hidden}.completed-zone{order:-1;flex:0 0 72px;margin:8px 10px 0;flex-direction:row;gap:8px}.completed-zone-count{margin:0;font-size:1rem}.completed-zone small{display:none}.board-scroll{flex:1 1 auto;min-height:0}}:root[data-theme=dark]{color-scheme:dark;background:#161816;color:#ecede8}:root[data-theme=dark] .app-header{background:#151715;border-bottom-color:#3b3e39}:root[data-theme=dark] .brand p{color:#aaada6}:root[data-theme=dark] .create-palette{background:#292c29}:root[data-theme=dark] .control-bar{background:#242724;border-bottom-color:#3a3e39;box-shadow:0 2px 10px #00000040}:root[data-theme=dark] .project-controls>label,:root[data-theme=dark] .control-label,:root[data-theme=dark] .result-count{color:#bec2b9}:root[data-theme=dark] .control-bar select,:root[data-theme=dark] .control-bar input,:root[data-theme=dark] .control-bar button{color:#eceee9;background:#303430;border-color:#50554e}:root[data-theme=dark] .control-bar button:hover{background:#3b403a;border-color:#747b71}:root[data-theme=dark] .control-bar .danger-control:not(:disabled){color:#ff9d9d}:root[data-theme=dark] .status-tabs{background:#171a17}:root[data-theme=dark] .status-tabs button{background:transparent}:root[data-theme=dark] .status-tabs button[aria-pressed=true]{color:#25231c;background:#f1cf5d}:root[data-theme=dark] .search-box>span{color:#aeb3aa}:root[data-theme=dark] .workspace,:root[data-theme=dark] .board{background-color:#1d201d}:root[data-theme=dark] .board-grid{background-image:radial-gradient(circle,rgb(216 222 210 / 16%) 1px,transparent 1.25px)}:root[data-theme=dark] .completed-zone{color:#c3ccc3;background:#232b24e0;border-color:#657568}:root[data-theme=dark] .completed-zone-count{color:#9bcea7}:root[data-theme=dark] .completed-zone.is-drag-over{background:#294c31;border-color:#79bd88}:root[data-theme=dark] .empty-state{color:#aeb2aa}:root[data-theme=dark] .empty-note{border-color:#737970}:root[data-theme=dark] .note{box-shadow:1px 2px 2px #0000004d,5px 11px 17px #0000004d,14px 26px 38px #0000002e}@media(prefers-reduced-motion:no-preference){body,.control-bar,.workspace,.board,.completed-zone,.control-bar input,.control-bar select,.control-bar button{transition:color .2s ease,background-color .2s ease,border-color .2s ease}}@media(max-width:390px){.app-header{padding-left:12px;padding-right:10px}.brand-mark{display:none}.create-palette{gap:4px;padding:5px 6px}.create-palette .color-option{width:22px;height:22px}.add-button{padding:0 10px}.add-button span{display:none}.control-bar .danger-control{font-size:0}.control-bar .danger-control:after{content:"削除";font-size:.8rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}