:root{font-family:Hiragino Sans,Yu Gothic UI,Yu Gothic,sans-serif;color:#2f302c;background:#f7f4ed;font-synthesis:none;--ink: #2f302c;--muted: #7b7b72;--green: #477161;--paper: #fffdf8}*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%}body{min-height:100vh;background:radial-gradient(circle at 13% 12%,rgba(255,255,255,.9) 0 2px,transparent 3px),linear-gradient(135deg,rgba(80,107,91,.035) 25%,transparent 25%) 0 0 / 28px 28px,#f7f4ed}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.theme-toggle{display:flex;align-items:center;justify-content:center;gap:7px;min-height:46px;padding:0 13px;border:1px solid rgba(69,72,62,.16);border-radius:12px;color:var(--ink);background:#fffdf8c7;font-size:.75rem;font-weight:700;cursor:pointer}.theme-toggle:hover{border-color:#47716173;background:var(--paper)}.theme-toggle:focus-visible{outline:3px solid rgba(71,113,97,.3);outline-offset:2px}.theme-icon{font-size:1.15rem;line-height:1}.app-shell{width:min(100% - 48px,1440px);margin:0 auto;padding:28px 0 36px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px}.brand{display:flex;align-items:center;gap:14px}.brand-mark{width:11px;height:47px;border-radius:10px;background:var(--green);box-shadow:0 5px 14px #4771612e}h1{margin:0;font-family:Yu Mincho,Hiragino Mincho ProN,serif;font-size:clamp(1.35rem,2vw,1.9rem);letter-spacing:.04em}.brand p{margin:5px 0 0;color:var(--muted);font-size:.83rem;letter-spacing:.06em}.create-controls{display:flex;align-items:flex-end;gap:10px}.new-color-label{display:grid;gap:4px;color:var(--muted);font-size:.7rem;font-weight:700}.new-color-label select{min-height:46px;padding:0 34px 0 13px;border:1px solid rgba(69,72,62,.16);border-radius:12px;color:var(--ink);background:#fffdf8;cursor:pointer}.add-button{min-height:46px;padding:0 20px;border:0;border-radius:13px;color:#fff;background:var(--green);box-shadow:0 7px 18px #35554a38;font-weight:700;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}.add-button span{margin-right:4px;font-size:1.35rem;font-weight:400;vertical-align:-1px}.add-button:hover{transform:translateY(-2px);box-shadow:0 10px 22px #35554a42}.add-button:active{transform:translateY(0)}.add-button:focus-visible,.delete-button:focus-visible,.complete-button:focus-visible,.color-button:focus-visible,.new-color-label select:focus-visible,.note textarea:focus-visible{outline:3px solid rgba(71,113,97,.35);outline-offset:3px}.project-bar{display:flex;align-items:center;gap:8px;margin:-3px 0 13px}.project-bar>label{color:#62645d;font-size:.78rem;font-weight:700}.project-bar select{min-width:210px;min-height:39px;padding:0 34px 0 12px;border:1px solid rgba(69,72,62,.17);border-radius:10px;color:var(--ink);background:#fffdf8;font-weight:700;cursor:pointer}.project-action{min-height:37px;padding:0 11px;border:1px solid rgba(69,72,62,.16);border-radius:9px;color:#62645d;background:#fffdf8bf;font-size:.75rem;font-weight:700;cursor:pointer}.project-action:hover{border-color:#47716173;color:var(--green);background:#fff}.project-add{color:var(--green)}.project-delete:hover{border-color:#8b484459;color:#8b4844}.arrange-button{color:var(--green)}.arrange-button span{margin-right:3px;font-size:1rem}.project-bar select:focus-visible,.project-action:focus-visible{outline:3px solid rgba(71,113,97,.3);outline-offset:2px}.search-bar{display:flex;align-items:center;gap:10px;margin:-4px 0 13px}.search-bar>label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.search-field{position:relative;width:min(360px,100%)}.search-field span{position:absolute;left:14px;top:50%;translate:0 -52%;color:#7b7b72;font-size:1.25rem;pointer-events:none}.search-field input{width:100%;min-height:42px;padding:0 40px 0 42px;border:1px solid rgba(69,72,62,.16);border-radius:12px;color:var(--ink);background:#fffdf8e6;outline:0}.search-field input:focus{border-color:var(--green);box-shadow:0 0 0 3px #47716121}.search-field input::placeholder{color:#999990}.search-bar output{min-width:74px;margin-left:auto;color:var(--muted);font-size:.82rem;font-weight:700;text-align:right;white-space:nowrap}.status-tabs{display:flex;padding:3px;border:1px solid rgba(69,72,62,.12);border-radius:11px;background:#ebe8dfb8}.status-tabs button{min-height:34px;padding:0 13px;border:0;border-radius:8px;color:#707169;background:transparent;font-size:.78rem;font-weight:700;cursor:pointer}.status-tabs button[aria-pressed=true]{color:#fff;background:var(--green);box-shadow:0 2px 7px #35554a33}.status-tabs button:focus-visible{outline:3px solid rgba(71,113,97,.3);outline-offset:2px}.board-workspace{display:grid;grid-template-columns:minmax(0,1fr) 174px;gap:14px}.board{position:relative;min-height:calc(100vh - 139px);overflow:hidden;border:1px solid rgba(69,72,62,.13);border-radius:22px;background-color:var(--paper);background-image:radial-gradient(rgba(71,113,97,.17) 1px,transparent 1px);background-size:22px 22px;box-shadow:0 18px 45px #373a3017,inset 0 1px #fff;touch-action:none}.completed-drop-zone{min-height:210px;align-self:start;display:grid;place-content:center;justify-items:center;padding:20px 12px;border:2px dashed rgba(71,113,97,.34);border-radius:18px;color:#66766e;background:#e4ede773;text-align:center;transition:border-color .18s ease,background .18s ease,transform .18s ease}.completed-drop-zone.is-target{border-color:var(--green);background:#cfe8d8e6;transform:scale(1.025)}.completed-icon{display:grid;place-items:center;width:45px;height:45px;margin-bottom:10px;border-radius:50%;color:#fff;background:var(--green);font-size:1.35rem}.completed-drop-zone strong{font-size:.93rem}.completed-drop-zone span{margin-top:7px;color:#858e88;font-size:.72rem;line-height:1.5}.empty-state{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;color:#8c8d84;pointer-events:none}.empty-state[hidden]{display:none}.empty-icon{display:grid;place-items:center;width:54px;height:54px;margin-bottom:13px;border:1px dashed #a9aaa1;border-radius:50%;font-size:1.7rem;color:#777970}.empty-state p{margin:0 0 6px;color:#5e605a;font-weight:700}.empty-state span{font-size:.8rem}.note{--note-color: #fff0a6;position:absolute;width:236px;height:190px;padding:14px 14px 13px;border-radius:3px 3px 12px;background:linear-gradient(105deg,rgba(255,255,255,.14),transparent 36%),var(--note-color);box-shadow:1px 2px 2px #3f3a271c,4px 8px 13px #3f3a2724,10px 16px 25px #3f3a2714,inset 0 1px #ffffff85;transform-origin:center center;transition:box-shadow .18s ease;touch-action:none}.note.search-hidden{display:none}.note.completed{opacity:.68;filter:saturate(.55)}.note.completed textarea{color:#686961;text-decoration:line-through;text-decoration-thickness:1.5px}.note:after{content:"";position:absolute;right:0;bottom:0;width:19px;height:19px;border-radius:9px 0 10px;background:linear-gradient(135deg,#ffffff5c 0 48%,#50411e14 52% 100%);pointer-events:none}.note.dragging{z-index:1000!important;box-shadow:2px 4px 5px #3330231f,12px 22px 38px #3330233d;cursor:grabbing}.note-header{display:flex;align-items:center;gap:5px;height:30px;cursor:grab;-webkit-user-select:none;user-select:none}.drag-dots{color:#413e307a;font-size:1.15rem;letter-spacing:2px;line-height:1}.color-palette{display:flex;align-items:center;gap:4px;margin-left:auto}.color-button{width:21px;height:21px;padding:0;border:2px solid rgba(255,255,255,.72);border-radius:50%;background:var(--swatch);box-shadow:0 0 0 1px #3a3a321f;cursor:pointer}.color-button[aria-pressed=true]{box-shadow:0 0 0 2px #4e554e;transform:scale(.86)}.complete-button{display:grid;flex:0 0 auto;place-items:center;width:29px;height:29px;padding:0;border:2px solid rgba(65,78,69,.42);border-radius:50%;color:transparent;background:#ffffff42;font-size:.95rem;font-weight:900;cursor:pointer}.complete-button[aria-pressed=true]{color:#fff;border-color:var(--green);background:var(--green)}.delete-button{display:grid;place-items:center;width:34px;height:34px;margin:0 -7px 0 1px;border:0;border-radius:50%;background:transparent;color:#35342d9e;font-size:1.2rem;cursor:pointer}.delete-button:hover{color:#713f3c;background:#ffffff5c}.note textarea{width:100%;height:calc(100% - 31px);padding:5px 2px;resize:none;border:0;outline:0;background:transparent;color:#38372f;font-family:UD デジタル 教科書体 N-R,HGP行書体,HGS行書体,cursive;font-size:1.05rem;font-weight:400;line-height:1.65;letter-spacing:.035em}.note textarea::placeholder{color:#4340327a}:root[data-theme=dark]{color-scheme:dark;--ink: #e6e8e3;--muted: #a9afa9;--green: #72a892;--paper: #202622;color:var(--ink);background:#171b19}:root[data-theme=dark] body{background:radial-gradient(circle at 13% 12%,rgba(255,255,255,.07) 0 2px,transparent 3px),linear-gradient(135deg,rgba(114,168,146,.035) 25%,transparent 25%) 0 0 / 28px 28px,#171b19}:root[data-theme=dark] .new-color-label select,:root[data-theme=dark] .project-bar select,:root[data-theme=dark] .search-field input,:root[data-theme=dark] .theme-toggle,:root[data-theme=dark] .project-action{border-color:#dce6df26;color:var(--ink);background:#252b27}:root[data-theme=dark] .project-bar>label,:root[data-theme=dark] .project-action,:root[data-theme=dark] .status-tabs button{color:#b5bbb5}:root[data-theme=dark] .project-action:hover,:root[data-theme=dark] .theme-toggle:hover{color:#91c5af;background:#2c342f}:root[data-theme=dark] .search-field span{color:#9ba39d}:root[data-theme=dark] .search-field input::placeholder{color:#858c87}:root[data-theme=dark] .status-tabs{border-color:#dce6df1a;background:#090c0a6b}:root[data-theme=dark] .board{border-color:#d7e5db1f;background-color:var(--paper);background-image:radial-gradient(rgba(134,177,158,.2) 1px,transparent 1px);box-shadow:0 18px 45px #00000047,inset 0 1px #ffffff0a}:root[data-theme=dark] .completed-drop-zone{color:#b5c5bd;background:#415c4e47}:root[data-theme=dark] .completed-drop-zone span{color:#8f9d96}:root[data-theme=dark] .empty-state{color:#939c96}:root[data-theme=dark] .empty-state p{color:#c2c8c3}:root[data-theme=dark] .empty-icon{border-color:#6f7972;color:#aab2ac}@media(max-width:767px){.app-shell{width:calc(100% - 24px);padding:18px 0 24px}.toolbar{align-items:flex-start;gap:12px;margin-bottom:15px}.brand{gap:9px}.brand-mark{width:8px;height:41px}.brand p{font-size:.71rem;letter-spacing:0}.create-controls{align-items:center;gap:6px}.theme-toggle{width:50px;min-height:50px;padding:0}.theme-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.new-color-label>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.new-color-label select{width:98px;min-height:50px;padding:0 25px 0 9px;font-size:.78rem}.add-button{min-width:50px;min-height:50px;padding:0 13px;font-size:0}.add-button span{margin:0;font-size:1.7rem}.project-bar{display:grid;grid-template-columns:1fr auto auto auto;gap:6px}.project-bar>label{grid-column:1 / -1}.project-bar select{min-width:0;width:100%;min-height:44px}.project-action{min-width:44px;min-height:44px;padding:0 9px;font-size:0}.project-action span{font-size:1.25rem}.project-action:after{font-size:1rem}#rename-project:after{content:"✎"}#delete-project:after{content:"×"}.arrange-button{grid-column:1 / -1;font-size:.82rem}.arrange-button span{margin-right:5px;font-size:1.05rem}.search-bar{flex-wrap:wrap;margin-top:-1px}.search-field{order:1;width:calc(100% - 84px)}.search-bar output{order:2}.status-tabs{order:3;width:100%}.status-tabs button{flex:1;min-height:42px}.search-field input{min-height:46px;font-size:1rem}.board-workspace{grid-template-columns:1fr}.completed-drop-zone{order:-1;min-height:104px;grid-template-columns:auto auto;column-gap:10px}.completed-drop-zone .completed-icon{grid-row:1 / 3;margin:0}.completed-drop-zone span{margin:2px 0 0}.board{min-height:calc(100vh - 111px);border-radius:16px;background-size:18px 18px}.note{width:min(220px,calc(100vw - 48px));height:174px;padding:12px}.color-palette{gap:4px}.color-button{width:21px;height:21px}.complete-button{width:31px;height:31px}.delete-button{width:34px;height:42px;margin:0 -10px 0 -2px}}@media(max-width:430px){.brand p{display:none}h1{max-width:118px;line-height:1.25}.new-color-label select{width:88px}.drag-dots{display:none}}@media(min-width:768px)and (max-width:1020px){.search-bar{flex-wrap:wrap}.search-field{flex:1}.search-bar output{order:3;width:100%;text-align:left}.board-workspace{grid-template-columns:1fr}.completed-drop-zone{min-height:105px}}@media(min-width:768px)and (max-width:1279px){.app-shell{width:calc(100% - 36px)}.note{width:224px;height:184px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}