body{background-color:#f5f7fa;color:#333;font-family:PingFang SC,Helvetica Neue,sans-serif;line-height:1.6;margin:0;padding:0}.nav-bar{color:#333;font-weight:500}.container{margin:0 auto;max-width:800px;padding:24px}.page-title{color:#1989fa;font-size:24px;margin-bottom:16px;text-align:center}.sub-title{color:#666;font-size:14px;margin-bottom:32px;text-align:center}.card{background:#fff;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.05);margin-bottom:24px;padding:24px}.card-header{padding-bottom:24px;text-align:center}.qrcode-preview{background:#f0f2f5;border-radius:8px;height:200px;margin:0 auto;width:200px}.card-body{display:flex;flex-direction:column;gap:16px}.form-group{position:relative}.input-with-border{border:1px solid #e4e7ed;border-radius:8px;font-size:14px;padding:12px 16px;transition:border-color .2s ease}.input-with-border:focus{border-color:#1989fa;box-shadow:0 0 0 2px rgba(25,137,250,.1);outline:none}.primary-button{background:#1989fa;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;padding:12px 24px;transition:opacity .2s ease}.primary-button:hover{opacity:.9}.primary-button:disabled{background:#e4e7ed;cursor:not-allowed}.example-link{background:#f0f2f5;border-radius:8px;color:#666;font-size:13px;padding:16px}.link-preview{background:#fff;border:1px solid #e4e7ed;border-radius:4px;display:block;margin-top:8px;overflow-x:auto;padding:8px 12px;white-space:nowrap}.form-input{border:1px solid #e4e7ed;border-radius:8px;font-size:14px;outline:none;padding:12px 16px;transition:border-color .2s ease;width:100%}.form-input:focus{border-color:#1989fa;box-shadow:0 0 0 2px rgba(25,137,250,.1)}