*{box-sizing:border-box}body,html{margin:0;font-family:Arial,Helvetica,sans-serif}button,input,textarea{font:inherit}.page{background-color:#fff;min-height:100vh}.main{flex-direction:column;flex:1;justify-content:center;align-items:center;width:100%;max-width:800px;margin:0 auto;padding:2rem;display:flex}.title{text-align:center;color:#1f2937;width:100%;margin-bottom:2rem;font-size:1.75rem;font-weight:500;line-height:1.2}.highlight{color:#2563eb;font-weight:600}.header{color:#fff;background-color:#2563eb;width:100%;padding:1rem 0}.headerContent{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:0 1rem;display:flex}.headerTitle{margin:0;font-size:1.25rem;font-weight:500}.userInfo{align-items:center;gap:1rem;display:flex}.logoutButton{color:#fff;cursor:pointer;background-color:#fff3;border:none;border-radius:.375rem;padding:.375rem .75rem;font-size:.875rem;transition:background-color .2s}.logoutButton:hover{background-color:#ffffff4d}.inputContainer{background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;width:100%;padding:1.5rem;box-shadow:0 1px 3px #0000000d}.motdInput{resize:vertical;color:#374151;background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;outline:none;width:100%;padding:.75rem;font-family:monospace;font-size:1rem;transition:border-color .2s,box-shadow .2s}.motdInput:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.motdInput::placeholder{color:#9ca3af}.controls{flex-direction:column;align-items:center;width:100%;margin-top:1.5rem;display:flex}.submitButton{color:#fff;cursor:pointer;background-color:#2563eb;border:none;border-radius:.375rem;width:100%;max-width:200px;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;transition:background-color .2s}.submitButton:hover{background-color:#1d4ed8}.submitButton:active{background-color:#1e40af}.submitButton:disabled{cursor:not-allowed;background-color:#93c5fd}.helpText{color:#6b7280;margin-top:1rem}.footer,.helpText{text-align:center;font-size:.875rem}.footer{color:#4b5563;background-color:#f3f4f6;border-top:1px solid #e5e7eb;padding:1rem}.loginContainer{text-align:center;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;width:100%;max-width:400px;padding:2rem;box-shadow:0 1px 3px #0000000d}.loginText{color:#4b5563;margin-bottom:1.5rem}.loading{color:#4b5563;flex-direction:column;justify-content:center;align-items:center;display:flex}.errorContainer{text-align:center;background-color:#fee2e2;border:1px solid #fecaca;border-radius:.5rem;width:100%;max-width:500px;padding:2rem}.errorTitle{color:#b91c1c;margin-bottom:1rem;font-size:1.5rem}.errorMessage{color:#ef4444;margin-bottom:1.5rem}.settingsContainer{flex-direction:column;gap:1.5rem;width:100%;display:flex}.settingsTabs{scrollbar-width:none;border-bottom:1px solid #e5e7eb;margin-bottom:1rem;display:flex;overflow-x:auto}.settingsTabs::-webkit-scrollbar{display:none}.tabButton{color:#6b7280;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;padding:.75rem 1.25rem;font-weight:500;transition:all .2s}.tabButton:hover{color:#4b5563}.activeTab{color:#2563eb;border-bottom:2px solid #2563eb}.settingsContent{width:100%}.settingsCard{background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;margin-bottom:1.5rem;padding:1.5rem;box-shadow:0 1px 3px #0000000d}.settingsCardHeader{margin-bottom:1.25rem}.settingsCardTitle{color:#1f2937;margin-bottom:.5rem;font-size:1.25rem;font-weight:500}.settingsCardDescription{color:#6b7280;font-size:.875rem}.inputWrapper,.settingsCardContent{width:100%}.numberInputContainer{align-items:center;margin-bottom:1rem;display:flex}.numberInput{color:#374151;text-align:center;background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;outline:none;flex:1;width:100%;padding:.75rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}.numberInput:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.numberControls{flex-direction:column;height:100%;display:flex}.numberButton{cursor:pointer;background-color:#f3f4f6;border:1px solid #d1d5db;border-left:none;justify-content:center;align-items:center;padding:.25rem .5rem;font-weight:700;display:flex}.numberButton:first-child{border-bottom:none;border-radius:0 .375rem 0 0}.numberButton:last-child{border-radius:0 0 .375rem}.numberButton:hover{background-color:#e5e7eb}.radioGroup{flex-direction:column;gap:.75rem;margin-bottom:1.5rem;display:flex}.radioLabel{cursor:pointer;align-items:center;gap:.5rem;display:flex}.radioInput{cursor:pointer;accent-color:#2563eb;width:1rem;height:1rem}.statusMessage{text-align:center;border-radius:.375rem;width:100%;margin-top:1rem;padding:.75rem;font-size:.875rem}.success{color:#065f46;background-color:#d1fae5;border:1px solid #a7f3d0}.error{color:#b91c1c;background-color:#fee2e2;border:1px solid #fecaca}.selectContainer{margin-bottom:1.5rem}.selectInput{color:#374151;appearance:none;background-color:#fff;background-image:url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20stroke%3D%22%236b7280%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22m19%209-7%207-7-7%22%2F%3E%3C%2Fsvg%3E);background-position:right .75rem center;background-repeat:no-repeat;background-size:1rem;border:1px solid #d1d5db;border-radius:.375rem;outline:none;width:100%;max-width:300px;padding:.75rem 2.5rem .75rem .75rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}.selectInput:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.checkboxContainer{align-items:center;gap:.5rem;margin-bottom:1rem;display:flex}.checkboxInput{accent-color:#2563eb;cursor:pointer;width:1.25rem;height:1.25rem}.checkboxLabel{color:#374151;cursor:pointer;font-size:1rem}@media (width<=640px){.title{font-size:1.5rem}.main{padding:1.5rem}.inputContainer,.loginContainer,.settingsCard{padding:1rem}.headerContent{flex-direction:column;align-items:flex-start;gap:.5rem}.userInfo{justify-content:space-between;width:100%}.settingsCard{padding:1rem}.tabButton{padding:.5rem 1rem}.numberInputContainer{max-width:100%}}