:root{font-family:Arial,Helvetica,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#1f2937;background-color:#f7f8fb;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;min-width:320px;min-height:100vh;background:linear-gradient(180deg,#f9fbff,#eef3f8)}#root{width:100%;min-height:100vh}.app-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 20px;box-sizing:border-box}.checker-panel{width:min(100%,560px);box-sizing:border-box}.checker-panel h2{margin-top:0;margin-bottom:24px}.input-group{width:100%;max-width:500px}textarea{width:100%;max-width:500px;height:50px;padding:10px;box-sizing:border-box;font-family:Arial,sans-serif;font-size:16px;letter-spacing:.08em;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#223046;box-shadow:0 1px 2px #0f172a0f;transition:background .3s,color .3s,border-color .3s,box-shadow .3s}.character-count{margin-top:0;text-align:right;font-size:.7rem;color:#78879b}textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f626}.character-key{display:inline-block;font-weight:700;padding:2px 5px;border-radius:4px;font-family:monospace;font-size:1.5em;margin-right:2px}.checker-panel>p{min-height:42px;margin:18px 0 0}.character-key-box{display:inline-block;padding:0;text-align:left;margin-top:20px}.character-key-box h3{font-size:1.2em;font-weight:700;margin-bottom:10px}.character-key-box p{display:flex;align-items:center;margin:5px 0;font-size:1em}.char-l{background-color:#fddf85;color:#000}.char-I{background-color:#b3d9ff;color:#000}.char-1{background-color:#d4a3ff;color:#000}.char-O{background-color:#ffb3b3;color:#000}.char-0{background-color:#99e699;color:#000}@media (max-width: 640px){.app-shell{align-items:flex-start;padding:48px 16px 24px}}