body{background-color:#2b3a32;margin:0}.login-wrapper{display:flex;justify-content:center;align-items:center;min-height:100vh;width:100%}.border{background-color:#3a4f44;border:3px solid #8ebd9e;border-radius:8px;width:100%;max-width:450px;padding:40px 30px;box-sizing:border-box;margin:auto!important}.login-label{text-align:center;margin-bottom:30px}.login-label-string{font-size:28px;font-weight:700;color:#f0f4f0;margin:0}.login-form{display:flex;flex-direction:column}.login-table{width:100%;border-collapse:collapse;margin-bottom:30px}.login-table td{padding:15px 0}.login-table td:first-child{width:35%;font-size:18px;font-weight:700;color:#e0e8e0;vertical-align:middle}.login-table td:last-child{width:65%}.login-table input[type=text],.login-table input[type=password]{width:100%;padding:15px;border:2px solid #2b3a32;border-radius:6px;box-sizing:border-box;font-size:18px;background-color:#e6eedf;color:#1a241e}.login-table input[type=text]:focus,.login-table input[type=password]:focus{outline:none;border-color:#d97b29;background-color:#fff;box-shadow:0 0 0 3px #d97b294d}.login-button{background-color:#d97b29;color:#fff;border:2px solid #b5621b;padding:16px;border-radius:6px;font-size:20px;font-weight:700;cursor:pointer;width:100%}.login-button:hover{background-color:#b5621b}@media(max-width:480px){.border{padding:30px 20px;border-width:2px}.login-label-string{font-size:24px}.login-table td{display:block;width:100%!important;padding:5px 0}.login-table td:first-child{padding-top:10px;padding-bottom:2px}.login-table td:last-child{padding-bottom:15px}}#message-box{margin-top:15px;text-align:center;font-weight:700;min-height:24px;color:red}.error-msg{color:#ff8e8e}.success-msg{color:#8ebd9e}body{background-color:#2b3a32;font-family:BIZ UDPGothic,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif;margin:0;padding:0;color:#f0f4f0}.memo-wrapper{height:100vh;height:100dvh;width:100%;display:flex;flex-direction:column}.header{background-color:#1a241e;padding:15px 20px;border-bottom:3px solid #8ebd9e;display:flex;justify-content:space-between;align-items:center}.header-buttons{display:flex;gap:15px}.header-btn{background-color:#3a4f44;color:#f0f4f0;border:2px solid #8ebd9e;padding:8px 16px;border-radius:4px;cursor:pointer;font-weight:700;font-size:16px;transition:background-color .2s}.header-btn:hover{background-color:#4a6356}.container{display:flex;flex-grow:1;overflow:hidden}.left-pane{width:300px;min-width:200px;max-width:50vw;background-color:#3a4f44;border-right:4px solid #8ebd9e;resize:horizontal;overflow:auto;padding:20px;box-sizing:border-box;display:flex;flex-direction:column}.right-pane{flex-grow:1;background-color:#2b3a32;padding:20px;box-sizing:border-box;display:flex;flex-direction:column}.left-pane-header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #8ebd9e;padding-bottom:10px;margin-bottom:20px}.pane-title{margin:0;font-size:20px}.add-btn{background-color:#d97b29;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-weight:700;font-size:14px;transition:background-color .2s}.add-btn:hover{background-color:#b5621b}.memo-list{list-style:none;padding:0;margin:0}.memo-list li{padding:15px;margin-bottom:12px;background-color:#2b3a32;border:2px solid #8ebd9e;border-radius:6px;cursor:pointer;font-size:18px;font-weight:700;color:#e0e8e0;display:flex;justify-content:space-between;align-items:center}.memo-list li:hover{background-color:#4a6356}.memo-list li.active{border-color:#d97b29;background-color:#1a241e}.memo-title-span{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:10px}.delete-btn{background-color:transparent;color:#8ebd9e;border:none;cursor:pointer;font-size:16px;padding:6px 10px;border-radius:4px;transition:all .2s;line-height:1}.delete-btn:hover{color:#fff;background-color:#e53e3e}.memo-editor{flex-grow:1;width:100%;padding:20px;border:3px solid #8ebd9e;border-radius:8px;background-color:#e6eedf;color:#1a241e;font-size:18px;line-height:1.6;font-family:inherit;box-sizing:border-box;resize:none}.memo-editor:focus{outline:none;border-color:#d97b29;background-color:#fff;box-shadow:0 0 0 3px #d97b294d}@media(max-width:768px){.container{flex-direction:column}.left-pane{width:100%;max-width:none;height:35%;min-height:150px;resize:vertical;border-right:none;border-bottom:4px solid #8ebd9e}.right-pane{height:65%}}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s}.modal-overlay.active{opacity:1;pointer-events:auto}.modal-content{background-color:#2b3a32;border:3px solid #8ebd9e;padding:30px;border-radius:8px;text-align:center;max-width:400px;width:90%;color:#f0f4f0}.modal-actions{display:flex;justify-content:center;gap:15px;margin-top:25px}.modal-btn{padding:10px 20px;border:none;border-radius:4px;cursor:pointer;font-weight:700;font-size:16px}.btn-cancel{background-color:#3a4f44;color:#f0f4f0}.btn-cancel:hover{background-color:#4a6356}.btn-danger{background-color:#e53e3e;color:#fff}.btn-danger:hover{background-color:#c53030}