*{margin:0;padding:0;box-sizing:border-box}body{font-family:Noto Sans,Noto Sans TC,Noto Sans SC,Noto Sans JP,sans-serif;font-synthesis:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f7fa;display:flex;justify-content:center;align-items:center;min-height:100vh;min-height:100dvh;color:#333;padding:16px}.container{background:#fff;padding:2.5rem 2rem;border-radius:16px;box-shadow:0 4px 24px #0000000f,0 1px 4px #0000000a;text-align:center;width:100%;max-width:400px;min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center}.logo{width:120px;margin-bottom:.25rem}.brand-label{font-size:.7rem;font-weight:600;color:#aaa;letter-spacing:.14em;text-transform:uppercase}.divider{width:100%;height:1px;background:#eee;margin:1.25rem 0}h2{font-size:1.2rem;font-weight:600;color:#1a1a1a;margin-bottom:.5rem}p{font-size:.88rem;line-height:1.6;color:#555;margin-bottom:.35rem}.hint-text{margin-top:.75rem;font-size:.78rem;color:#999}form{text-align:left;margin-top:1.25rem;width:100%}label{display:block;font-size:.78rem;font-weight:600;color:#444;margin-bottom:.3rem}input{width:100%;padding:.7rem .85rem;margin-bottom:1rem;border:1.5px solid #dfe3e8;border-radius:8px;font-size:.88rem;outline:none;transition:border-color .2s,box-shadow .2s;background:#fafbfc}input:focus{border-color:#c62828;box-shadow:0 0 0 3px #c6282814;background:#fff}button{width:100%;padding:.75rem;background:#c62828;color:#fff;border:none;border-radius:8px;font-size:.88rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s}button:hover:not(:disabled){background:#a31f1f}button:active:not(:disabled){transform:scale(.98)}button:disabled{background:#d5d5d5;cursor:not-allowed}.method-toggle{display:flex;margin:0 0 1rem;border:1.5px solid #dfe3e8;border-radius:8px;overflow:hidden}.method-btn{flex:1;padding:10px 8px;border:none;border-radius:0;background:#fafbfc;color:#666;font-size:.8rem;font-weight:500;cursor:pointer;transition:background .2s,color .2s}.method-btn+.method-btn{border-left:1.5px solid #dfe3e8}.method-btn:hover:not(.active){background:#f0f2f5}.method-btn.active{background:#c62828;color:#fff;font-weight:600}.otp-input{text-align:center;letter-spacing:8px;font-size:1.5rem;font-weight:700;padding:.85rem 1rem;font-family:SF Mono,Fira Code,monospace}.status-icon{font-size:2.25rem;margin-bottom:.75rem}.error-text{color:#c62828;font-size:.8rem;margin-top:.75rem;font-weight:500;text-align:center}.footer{margin-top:auto;padding-top:1.5rem;font-size:.7rem;color:#ccc}.spinner{display:inline-block;width:28px;height:28px;border:3px solid #eee;border-top-color:#c62828;border-radius:50%;animation:spin .7s linear infinite;margin-bottom:.75rem}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 480px){body{padding:12px;align-items:flex-start;padding-top:10vh}.container{padding:2rem 1.5rem;min-height:380px;border-radius:12px;box-shadow:0 2px 16px #0000000f}.logo{width:100px}h2{font-size:1.1rem}.otp-input{font-size:1.3rem;letter-spacing:6px}}@media (max-width: 360px){.container{padding:1.5rem 1.25rem;min-height:360px}.method-btn{font-size:.75rem;padding:9px 6px}}.lang-switcher{margin-top:16px;padding:6px 12px;border:1px solid #dcdcdc;border-radius:6px;background:#fff;font-size:13px;color:#555;cursor:pointer;outline:none}.lang-switcher:focus{border-color:#0052cc}