:root{font-family:Noto Sans JP,sans-serif;color:#303d36;background:#f6f7f2;font-synthesis:none;font-weight:400;font-size:14px}*{box-sizing:border-box}body{margin:0}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #48775b;outline-offset:4px}.app-header{height:94px;border-bottom:1px solid #e1e5dc;display:flex;align-items:center;justify-content:space-between;padding:0 5.3%;gap:20px}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-weight:700;font-size:25px;letter-spacing:3px}.brand-icon{display:grid;place-items:center;background:#31563e;color:#f5f7eb;width:40px;height:43px;border-radius:10px 10px 17px;font-size:31px;transform:rotate(-7deg)}.brand-en{display:block;font-size:9px;letter-spacing:2px;font-weight:400;margin-top:0}.header-caption{font-size:9px;letter-spacing:2px;color:#90978e;margin-right:60px}.local-badge{display:flex;align-items:center;gap:8px;font-size:11px;color:#687566}.local-badge>span{width:6px;height:6px;background:#709572;border-radius:50%}main{max-width:1440px;padding:0 5.3%;margin:auto}.intro{display:flex;align-items:center;justify-content:space-between;min-height:225px;padding:35px 0}.eyebrow{font-size:10px;letter-spacing:2.4px;color:#65826c;margin:0 0 17px}h1{font-size:clamp(23px,2.4vw,33px);font-weight:500;letter-spacing:1px;margin:0 0 14px}.description{color:#7c8379;font-size:12px;line-height:1.9;margin:0}.mobile-break{display:none}.intro-decoration{position:relative;width:155px;height:110px;margin-right:30px}.intro-decoration>span{position:absolute;top:12px;left:12px;width:72px;height:79px;background:#e3e9d6;transform:rotate(-13deg);border:1px solid #d8dfc9}.intro-decoration>span+span{top:25px;left:52px;background:#f6edb4;transform:rotate(10deg);border-color:#eee3a2}.intro-decoration i{position:absolute;top:41px;left:65px;transform:rotate(10deg);font-family:Georgia,serif;color:#8b8251;font-size:15px;line-height:1.3}.workspace{border:1px solid #dce1d6;border-radius:15px;overflow:hidden;background:#fff;box-shadow:0 6px 24px #25372104}.toolbar{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 26px;border-bottom:1px solid #e3e7de}.board-heading{display:flex;align-items:center;gap:11px;white-space:nowrap}.board-symbol{color:#718570;font-size:22px}h2{font-size:14px;font-weight:600;margin:0}.count{background:#f0f2eb;border-radius:6px;min-width:25px;padding:3px 7px;text-align:center;font-size:11px;color:#7e8777}.board-actions{display:flex;gap:23px;align-items:center}.palette{display:flex;gap:5px;border:0;padding:0;margin:0}.color-choice{display:grid;place-items:center;position:relative;width:30px;height:36px;cursor:pointer}.color-choice input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.color-dot{display:block;width:21px;height:21px;border:1px solid #00000008;border-radius:50%;background:var(--swatch)}.color-choice input:checked+.color-dot{outline:1px solid #6c7966;outline-offset:3px}.color-choice input:focus-visible+.color-dot{outline:3px solid #31563e;outline-offset:3px}.add-button{display:flex;gap:9px;align-items:center;background:#345b43;border:1px solid #345b43;color:#fff;padding:11px 18px;border-radius:8px;font-size:12px;font-weight:500;min-height:44px}.add-button:hover{background:#274733}.add-button>span{font-size:21px;line-height:1}.board{position:relative;min-height:470px;background-color:#fbfcf8;background-image:radial-gradient(#d9dfd2 1px,transparent 1px);background-size:20px 20px;transition:height .15s}.note{position:absolute;width:240px;height:226px;border:1px solid #00000006;border-radius:3px 3px 15px;background:var(--note-color);box-shadow:2px 5px 8px #4343290d;display:flex;flex-direction:column;transition:box-shadow .15s}.note:hover,.note:focus-within{box-shadow:2px 7px 16px #43432918}.note.dragging{z-index:10;box-shadow:5px 12px 24px #43432926;transition:none}.note-top{height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 5px 0 10px}.drag-handle{flex:1;height:44px;background:transparent;border:0;text-align:left;color:#6b725d;cursor:grab;touch-action:none;display:flex;align-items:center;gap:9px;padding:0 8px}.drag-handle:active{cursor:grabbing}.grip{font-size:20px;opacity:.45}.note-label{font-size:9px;letter-spacing:1.7px;opacity:.65}.delete-button{width:38px;height:38px;border:0;border-radius:6px;background:transparent;color:#686f5c;font-size:23px;opacity:.65}.delete-button:hover{background:#00000009;opacity:1}.note textarea{display:block;width:100%;flex:1;min-height:0;resize:none;background:transparent;border:0;padding:6px 20px 8px;color:#41493a;font-size:14px;line-height:1.85;outline:none}.note textarea::placeholder{color:#8f947e}.note textarea:focus{background:#ffffff15}.note-bottom{font-size:9px;color:#6d745d99;padding:10px 20px 14px;letter-spacing:.6px}.board-footer{display:flex;gap:12px;justify-content:space-between;align-items:center;padding:15px 24px;font-size:10px;color:#8a9182;border-top:1px solid #e3e7de}.gesture-hint>span:first-child{font-size:15px;margin-right:4px}#save-status:before{content:"✓";margin-right:6px;color:#6d8b68}#save-status.error{color:#a44834}#save-status.error:before{content:"!";color:inherit}.privacy-note{text-align:center;color:#93998b;font-size:10px;line-height:1.8;margin:23px 0 30px}.privacy-note span{margin-left:10px;font-family:Georgia,serif;font-style:italic;letter-spacing:.4px}.empty-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;text-align:center;pointer-events:none}.empty-state[hidden]{display:none}.empty-state>span{width:54px;height:60px;background:#eef0e3;border-radius:3px 3px 14px;display:grid;place-items:center;font-size:28px;color:#8e9c82;transform:rotate(-7deg);margin-bottom:15px}.empty-state h3{font-size:16px;font-weight:500;margin:12px 0}.empty-state p{font-size:12px;color:#8b9382;line-height:1.8}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%);z-index:50;background:#304c39;color:#fff;border-radius:10px;padding:12px 16px;display:flex;align-items:center;gap:20px;box-shadow:0 5px 25px #0002;font-size:12px;max-width:calc(100% - 24px);width:max-content}.toast[hidden]{display:none}.toast button{color:#f4e9a5;background:transparent;border:0;min-height:44px;white-space:nowrap}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1440px){.board{min-height:530px}}@media(max-width:800px){.header-caption{display:none}.app-header{height:80px}.intro-decoration{margin-right:0}.toolbar{padding:16px}.board-actions{gap:14px}.board-footer{padding:13px 16px}.desktop-hint{display:none}}@media(max-width:520px){.app-header{padding:0 20px;height:76px}.brand{font-size:22px}.brand-icon{width:34px;height:37px}.local-badge{font-size:10px}main{padding:0 16px}.intro{min-height:210px;padding:32px 5px}.eyebrow{font-size:9px;margin-bottom:13px}h1{font-size:23px;letter-spacing:0}.description{font-size:11px}.mobile-break{display:block}.intro-decoration{display:none}.toolbar{flex-wrap:wrap;padding:16px;gap:14px}.board-actions{width:100%;justify-content:space-between;gap:8px}.color-choice{width:31px;height:44px}.palette{gap:2px}.add-button{padding:10px 12px}.board{min-height:400px}.note{height:226px}.note textarea{font-size:16px}.delete-button{width:44px;height:44px}.board-footer{flex-wrap:wrap;gap:7px;font-size:9px}.privacy-note span{display:block;margin:6px 0 0}.toast{gap:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}.search-row{display:flex;align-items:center;gap:10px;padding:12px 26px;background:#fff;border-bottom:1px solid #e3e7de}#note-search{flex:1;min-width:0;min-height:44px;padding:10px 14px;border:1px solid #dce1d6;border-radius:8px;background:#fbfcf8;color:#303d36;font-size:14px}#note-search::placeholder{color:#8a9182}#clear-search{min-width:64px;min-height:44px;border:1px solid #dce1d6;border-radius:8px;background:#f6f7f2;color:#345b43;font-size:12px}#clear-search:disabled{opacity:.45;cursor:default}#clear-search:not(:disabled):hover{background:#e9eee4}.note[hidden]{display:none}@media(max-width:800px){.search-row{padding:12px 16px}}@media(max-width:520px){#note-search{font-size:16px;padding:10px}.search-row{gap:8px}}.brand{letter-spacing:1px;white-space:nowrap}.brand-icon{flex-shrink:0}@media(max-width:1000px){.header-caption{display:none}}@media(max-width:520px){.app-header{gap:12px}.brand{font-size:17px;letter-spacing:0;gap:8px}.brand-en{font-size:8px;letter-spacing:1px}.local-badge{font-size:9px}}:root{color-scheme:light}.header-actions{display:flex;align-items:center;gap:18px;flex-shrink:0}.header-caption{margin-right:0}#theme-toggle{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:8px 12px;border:1px solid #dce1d6;border-radius:8px;background:#fff;color:#345b43;font-size:12px;white-space:nowrap}#theme-toggle:hover{background:#e9eee4}#theme-icon{font-size:20px;line-height:1}:root[data-theme=dark]{color-scheme:dark;color:#e6ece4;background:#18211e}[data-theme=dark] .app-header{border-color:#35463d}[data-theme=dark] .brand-icon{background:#52765c}[data-theme=dark] .header-caption,[data-theme=dark] .local-badge,[data-theme=dark] .description,[data-theme=dark] .privacy-note,[data-theme=dark] .board-footer,[data-theme=dark] .empty-state p{color:#aab8ac}[data-theme=dark] .eyebrow,[data-theme=dark] .board-symbol{color:#a5c5a9}[data-theme=dark] .workspace,[data-theme=dark] .search-row{background:#222e28;border-color:#3c4d42}[data-theme=dark] .toolbar,[data-theme=dark] .board-footer{border-color:#3c4d42}[data-theme=dark] .board{background-color:#1c2721;background-image:radial-gradient(#3c4b40 1px,transparent 1px)}[data-theme=dark] .count,[data-theme=dark] .empty-state>span{background:#354639;color:#d3e0cb}[data-theme=dark] #note-search{background:#18211e;color:#e6ece4;border-color:#546657}[data-theme=dark] #note-search::placeholder{color:#aab8ac}[data-theme=dark] #clear-search,[data-theme=dark] #theme-toggle{background:#2c3c31;color:#dfebdb;border-color:#546657}[data-theme=dark] #clear-search:not(:disabled):hover,[data-theme=dark] #theme-toggle:hover{background:#3c5041}[data-theme=dark] .add-button{background:#a9cba5;color:#17271b;border-color:#a9cba5}[data-theme=dark] .add-button:hover{background:#c2debb}[data-theme=dark] .note{background:color-mix(in srgb,var(--note-color) 20%,#26312d);border-color:#ffffff14;box-shadow:2px 5px 12px #0003}[data-theme=dark] .note textarea{color:#f0f3e9}[data-theme=dark] .note textarea::placeholder{color:#c0c7b8}[data-theme=dark] .drag-handle,[data-theme=dark] .delete-button,[data-theme=dark] .note-bottom{color:#d2dacb}[data-theme=dark] .delete-button{opacity:1}[data-theme=dark] .delete-button:hover{background:#ffffff15}[data-theme=dark] .note-label,[data-theme=dark] .grip{opacity:.85}[data-theme=dark] #save-status:before{color:#b3d8a9}[data-theme=dark] #save-status.error,[data-theme=dark] #save-status.error:before{color:#ffb29d}[data-theme=dark] .toast{background:#354e3d;border:1px solid #627c67}[data-theme=dark] :is(button,a,input):focus-visible{outline-color:#c1dfa5}[data-theme=dark] .color-choice input:checked+.color-dot{outline-color:#c1dfa5}[data-theme=dark] .color-choice input:focus-visible+.color-dot{outline:3px solid #c1dfa5}@media(max-width:1100px){.header-caption{display:none}}@media(max-width:650px){.header-actions .local-badge{display:none}.header-actions{gap:0}}