body{font-family:Arial,sans-serif;margin:0;background-color:#202}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}button{background-color:#202;color:#fff;border:1px solid #ffffff;border-radius:4px;padding:8px 16px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .3s ease}button:hover{background-color:#303}.app-controls{width:200px;position:fixed;top:16px;right:16px;z-index:1000;display:flex;flex-direction:column;gap:8px}.app-controls div{padding:16px;border-radius:8px;border:1px solid #ffffff;background-color:#303;display:flex;flex-direction:column;gap:8px;align-items:center;color:#fff}input[type=range]{-webkit-appearance:none;outline:none;border:none;background-color:#202;color:#fff;border-radius:4px;padding:8px 16px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .3s ease}