*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#1a1a2e;min-height:100vh;display:flex;align-items:center;justify-content:center}#app{width:100%;max-width:414px;margin:0 auto}.phone-frame{background:#000;border-radius:40px;padding:12px;box-shadow:0 20px 60px #00000080}.phone-screen{background:#fff;border-radius:30px;overflow:hidden;height:780px;display:flex;flex-direction:column}.nav-bar{display:flex;align-items:center;padding:48px 16px 12px;background:#fff;border-bottom:1px solid #f0f0f0}.nav-back{font-size:28px;color:#333;cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}.nav-back:hover{background:#f0f0f0}.nav-title{flex:1;text-align:center;font-size:17px;font-weight:600;color:#333}.nav-right{width:36px}.page-content{flex:1;overflow-y:auto;display:flex;flex-direction:column}.warning-banner{background:#fff8e1;border-bottom:1px solid #ffe082;padding:12px 16px;display:flex;align-items:flex-start;gap:10px}.warning-icon{width:28px;height:28px;flex-shrink:0}.warning-text h3{color:#e65100;font-size:14px;font-weight:700;margin-bottom:2px}.warning-text p{color:#795548;font-size:12px;line-height:1.5}.step-body{flex:1;padding:16px 20px;display:flex;flex-direction:column;align-items:center}.step-description{font-size:15px;color:#333;line-height:1.6;margin-bottom:12px;width:100%;font-weight:500}.step-hint{font-size:13px;line-height:1.5;margin-bottom:8px;width:100%;font-weight:500}.step-hint.hint-green{color:#4caf50}.step-hint.hint-red{color:#e53935}.step-hint.hint-dark{color:#333}.step-image{width:100%;max-width:320px;height:180px;background:#f5f0eb;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;overflow:hidden;border:1px solid #e8e0d8}.step-image svg{width:100%;height:100%}.confirm-checkbox{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#fafafa;border-radius:10px;cursor:pointer;width:100%;transition:background .2s;-webkit-user-select:none;user-select:none;margin-top:auto}.confirm-checkbox:hover{background:#fff3e0}.checkbox-custom{width:22px;height:22px;border:2px solid #ccc;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.confirm-checkbox.checked .checkbox-custom{background:#ff9800;border-color:#ff9800}.confirm-checkbox.checked .checkbox-custom svg{opacity:1}.checkbox-custom svg{width:14px;height:14px;fill:#fff;opacity:0;transition:opacity .2s}.checkbox-label{font-size:14px;color:#333;font-weight:500}.bottom-buttons{display:flex;gap:12px;padding:12px 20px 28px;background:#fff;border-top:1px solid #f0f0f0}.btn{flex:1;padding:14px;border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;border:none;transition:all .2s}.btn-cancel{background:#f5f5f5;color:#333;border:1px solid #e0e0e0}.btn-cancel:hover{background:#eee}.btn-next{background:#ff9800;color:#fff}.btn-next:hover{background:#f57c00}.btn-next.disabled{background:#ffcc80;color:#fff;cursor:not-allowed;pointer-events:none;opacity:.6}.demo-badge{position:fixed;top:16px;right:16px;background:#ffffffe6;padding:8px 16px;border-radius:20px;font-size:12px;color:#666;box-shadow:0 2px 8px #0000001a}.lang-switch{position:fixed;top:16px;left:16px;background:#ff9800;color:#fff;padding:8px 16px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 2px 8px #ff98004d;transition:background .2s;-webkit-user-select:none;user-select:none}.lang-switch:hover{background:#f57c00}@media(max-width:440px){.phone-frame{border-radius:0;padding:0}.phone-screen{border-radius:0;height:100vh}.demo-badge{display:none}}