*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;background-color:#f5f5f5;color:#333;line-height:1.6}.license-plate-container{max-width:600px;margin:0 auto;background-color:#fff;min-height:100vh;padding:20px}.license-plate-header{text-align:center;margin-bottom:30px;padding-top:20px}.license-plate-header h2{font-size:24px;font-weight:600;margin-bottom:8px;color:#333}.license-plate-header p{font-size:14px;color:#666}.license-type-tabs{width:500px;margin:auto auto 30px;display:flex;position:relative;padding:0 10px;box-sizing:border-box}@media (max-width:768px){.license-type-tabs{width:100%;margin-bottom:20px;padding:0 10px;box-sizing:border-box}.license-type-tab{font-size:14px;padding:8px 0}.license-type-tabs::after{height:30px}.license-input-area{margin-bottom:20px}.license-code-display{gap:5px}.code-item{width:45px;height:60px;font-size:18px}.code-divider{font-size:20px}.form-section{margin-bottom:25px}.form-item{margin-bottom:20px}.input-with-suffix input{height:42px;font-size:14px}.radio-item{width:100%;margin-bottom:8px}.radio-item input[type=radio]{width:18px;height:18px}.submit-section{margin-top:25px;padding:0 15px}.cancel-btn,.submit-btn{height:44px;font-size:14px}.keyboard-container{padding:10px}.keyboard-row{flex-wrap:wrap;gap:8px;margin-bottom:8px}.keyboard-key{width:30px;height:30px;font-size:14px;padding:0}.keyboard-key.keyboard-delete,.keyboard-key.keyboard-space{width:80px}.vehicle-info-container{padding:20px 15px}.form-group{margin-bottom:15px}.form-group label{font-size:14px;margin-bottom:6px}.form-group input,.form-group select{padding:10px 12px;font-size:14px}.btn{padding:12px 0;font-size:14px}.btn-primary{width:100%}.keyboard-header{padding:12px 15px}.keyboard-header h3{font-size:16px}}.license-type-tabs::after{content:'';width:100%;height:8px;position:absolute;bottom:-8px;left:0;background:#d8d8d8;z-index:2}.tab-item{cursor:pointer;transition:.3s;font-weight:400;font-size:19px;color:#000;width:87px;text-align:center;position:relative}.tab-item.active::before{content:'';position:absolute;bottom:-8px;left:0;width:87px;height:8px;background:#202122;z-index:3}.license-input-area{margin:auto auto 20px;width:100%;padding:0 10px;box-sizing:border-box}.license-code-display{display:flex;align-items:center;justify-content:center;width:100%;gap:8px;flex-wrap:nowrap;padding:5px 0;box-sizing:border-box}.code-item{width:60px;height:80px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:500;cursor:pointer;position:relative;background-color:#f7f7f7;flex-shrink:0;transition:.3s;box-sizing:border-box}.license-code-display .code-item:hover{border-color:#d0d0d0;border-width:3px;box-shadow:0 2px 8px rgba(0,0,0,.1)}.license-code-display .code-item.active,.license-code-display .code-item:not(.location).active{border-color:#d0d0d0;border-width:3px;box-shadow:0 2px 8px rgba(0,0,0,.15)}.code-item.location{border-color:#ff4d4f}.yellow-plate .code-item.location{border-color:#ce9b22;background-color:#f5bc2f}.blue-plate .code-item.location{border-color:#3e75b4;background-color:#84bbf9}.code-item.letter{border-color:#e0e0e0}.code-text{display:inline-block;width:100%;text-align:center}.code-arrow{position:absolute;bottom:8px;left:50%;transform:translate(-50%);width:10px;height:4px}.code-arrow img{display:block;width:100%;height:100%}.code-divider{font-size:28px;color:#999;margin:0 8px;flex-shrink:0}.form-section{width:500px;margin:auto auto 40px;padding:0 10px;box-sizing:border-box}.form-item{margin-bottom:24px;display:flex;flex-direction:column;align-items:flex-start;width:100%}.form-item-row{display:flex;align-items:center;width:100%}.form-item-row>label{width:100px;display:block;font-size:14px;color:#333;font-weight:500}.form-item-content{flex:1}.error-message{margin-left:100px;text-align:left}.license-input-area .error-message{margin-left:0;text-align:center;margin-top:10px;margin-bottom:10px}.input-with-suffix{position:relative;display:flex;align-items:center;flex:1}.input-with-suffix input{flex:1;height:48px;padding:0 40px 0 12px;border-radius:8px;font-size:16px;transition:.3s;background-color:#f7f7f7;border:none}.input-with-suffix input:focus{outline:0;box-shadow:0 2px 8px rgba(0,0,0,.15)}.suffix{position:absolute;right:12px;color:#999;font-size:16px}.radio-group{display:flex;justify-content:space-between;flex-wrap:wrap;flex:1;gap:10px}.radio-item{position:relative;display:inline-block;cursor:pointer;width:calc(33.333% - 7px);text-align:center}.radio-item input[type=radio]{position:absolute;opacity:0;cursor:pointer}.radio-text{display:block;width:100%;padding:8px 0;background-color:#f7f7f7;border-radius:5px;font-size:14px;color:#000;cursor:pointer;transition:.3s}.radio-item input[type=radio]:checked+.radio-text{background-color:#f5bc2f;font-weight:500;box-shadow:0 2px 8px rgba(245,188,47,.3)}@media (max-width:768px){.form-section{width:100%}.radio-group{gap:12px}.radio-text{padding:8px 16px;font-size:14px;border-radius:16px}.code-item{width:45px;height:60px;font-size:18px}.code-divider{font-size:20px}}@media (max-width:480px){.radio-group{gap:10px}.radio-text{padding:6px 14px;font-size:13px;border-radius:14px}.code-item{width:37px;height:55px;font-size:16px}.code-divider{font-size:18px}}.submit-section{display:flex;justify-content:center;gap:16px;margin-top:30px;width:100%;padding:0 10px;box-sizing:border-box;flex-direction:column}.cancel-btn,.submit-btn{width:100%;height:48px;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:.3s;border:none}.submit-btn{background-color:#1677ff;color:#fff}.submit-btn:hover:not(:disabled){background-color:#4096ff;box-shadow:0 2px 8px rgba(22,119,255,.3)}.submit-btn:disabled{background-color:#d9d9d9;color:#999;cursor:not-allowed}.cancel-btn{background-color:#fff;color:#333;border:2px solid #e0e0e0}.cancel-btn:hover{border-color:#1677ff;color:#1677ff}.keyboard-container{z-index:20000;display:none}.keyboard-container.active{display:block}.license-input-area{position:relative}@media (min-width:768px){.keyboard-container{position:absolute;top:90px;left:50%;transform:translateX(-50%);z-index:20000;display:none}.keyboard-container.active{display:block}.keyboard-overlay{display:none}.keyboard-content{background-color:#fff;border-radius:8px;box-shadow:0 4px 20px rgba(0,0,0,.15);display:flex;flex-direction:column;min-width:500px;position:relative}}@media (max-width:767px){.keyboard-container{position:fixed;top:0;left:0;width:100%;height:100%;display:none}.keyboard-container.active{display:flex}.keyboard-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:block}.keyboard-content{position:absolute;bottom:0;left:0;right:0;background-color:#fff;border-radius:16px 16px 0 0;max-height:80vh;display:flex;flex-direction:column;z-index:1001}}.keyboard-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #e0e0e0}.keyboard-header h3{font-size:18px;font-weight:500;margin:0}.keyboard-close{width:36px;height:36px;border:none;background-color:transparent;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:.3s}.keyboard-close:hover{background-color:#f0f0f0}.keyboard-body{padding:20px;overflow-y:auto;flex:1}.keyboard-keys{display:grid;grid-template-columns:repeat(9,1fr);gap:8px}.keyboard-key{height:40px;border:1px solid #e0e0e0;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:500;cursor:pointer;transition:.3s;background-color:#fafafa}.keyboard-key:hover:not(.disabled){background-color:#222;color:#fff;border-color:#222}.keyboard-key.disabled{background-color:#f0f0f0;color:#999;cursor:not-allowed}@media (max-width:768px){.license-code-display{gap:6px;padding:0 5px}.code-item{width:55px;height:55px;font-size:22px}.code-divider{font-size:24px;margin:0 6px}}@media (max-width:480px){.license-plate-container{padding:16px}.license-code-display{gap:4px;padding:0 5px}.code-item{width:37px;height:45px;font-size:18px}.code-divider{font-size:20px;margin:0 4px}.keyboard-keys{grid-template-columns:repeat(8,1fr);gap:8px}.keyboard-key{height:45px;font-size:16px}.submit-section{flex-direction:column}.input-with-suffix{width:100%}.form-item,.form-item-row{flex-direction:column;align-items:flex-start}.form-item-row label{width:100px;margin-bottom:8px;margin-right:0}.form-item-content{width:100%}.radio-group{width:100%;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto}.radio-item{flex-shrink:0}.form-actions{flex-direction:row;justify-content:center;align-items:center}.form-actions .btn{width:40%}}.error-message{color:#ff4d4f;font-size:12px;margin-top:5px;display:none}.error-message.show{display:block}.form-item.error .input-with-suffix,.form-item.error input{border-color:#ff4d4f}