.yd-nfc-app{max-width:600px;margin:0 auto;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;background:#f5f5f5;min-height:100vh}
.yd-nfc-header{background:#1a472a;color:white;padding:20px;text-align:center;font-size:20px;font-weight:bold;position:sticky;top:0;z-index:100}
.yd-nfc-title{margin-bottom:8px}
.yd-nfc-status{font-size:12px;background:rgba(255,255,255,0.2);display:inline-block;padding:4px 12px;border-radius:20px}
.yd-nfc-status.active{background:#4caf50;animation:pulse 1s infinite}
.yd-nfc-company-select{padding:15px;background:white;margin:15px;border-radius:15px;box-shadow:0 2px 5px rgba(0,0,0,0.05)}
.yd-nfc-company-select select{width:100%;padding:12px;border:1px solid #ddd;border-radius:25px;font-size:16px;background:white}
.yd-nfc-route-list{background:white;margin:15px;border-radius:15px;overflow:hidden;box-shadow:0 2px 5px rgba(0,0,0,0.05)}
.yd-nfc-route-item{padding:18px;border-bottom:1px solid #eee;cursor:pointer;transition:background 0.2s}
.yd-nfc-route-item:hover{background:#f9f9f9}
.yd-nfc-route-name{font-weight:bold;font-size:18px;margin-bottom:4px}
.yd-nfc-route-company{font-size:12px;color:#888}
.yd-nfc-route-steps{font-size:11px;color:#1a472a;margin-top:4px}
.yd-nfc-compass{background:linear-gradient(135deg,#1a472a,#0a2a1a);margin:15px;padding:20px;border-radius:30px;text-align:center;color:white;box-shadow:0 5px 15px rgba(0,0,0,0.1)}
.yd-nfc-compass-arrow{width:0;height:0;border-left:20px solid transparent;border-right:20px solid transparent;border-bottom:50px solid white;margin:0 auto;transition:transform 0.2s;transform-origin:center;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2))}
.yd-nfc-compass-direction{margin-top:15px;font-size:18px;font-weight:bold}
.yd-nfc-instruction{background:white;margin:15px;padding:25px;border-radius:25px;box-shadow:0 5px 15px rgba(0,0,0,0.1)}
.yd-nfc-instruction-text{font-size:20px;font-weight:bold;text-align:center;margin-bottom:10px;color:#333}
.yd-nfc-instruction-detail{font-size:14px;color:#666;text-align:center;margin-bottom:20px}
.yd-nfc-scan-area{background:#f8f9fa;border:2px dashed #ddd;border-radius:20px;padding:20px;text-align:center}
.yd-nfc-scan-icon{font-size:40px;margin-bottom:10px}
.yd-nfc-scan-target{font-weight:bold;color:#1a472a;margin-top:8px}
.yd-nfc-progress{margin:15px;height:4px;background:#e0e0e0;border-radius:2px;overflow:hidden}
.yd-nfc-progress-bar{height:100%;background:#1a472a;width:0%;transition:width 0.3s}
.yd-nfc-buttons{display:flex;gap:12px;padding:15px;margin-top:auto}
.yd-nfc-btn{flex:1;padding:14px;border:none;border-radius:30px;font-size:16px;font-weight:bold;cursor:pointer;transition:transform 0.1s}
.yd-nfc-btn:active{transform:scale(0.97)}
.yd-nfc-btn-reset{background:#666;color:white}
.yd-nfc-btn-stop{background:#f44336;color:white}
.yd-nfc-voice{position:fixed;bottom:20px;right:20px;width:55px;height:55px;background:#1a472a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;cursor:pointer;box-shadow:0 4px 15px rgba(0,0,0,0.2);z-index:1000;color:white;transition:opacity 0.3s}
.yd-nfc-toast{position:fixed;bottom:100px;left:20px;right:20px;padding:12px 20px;border-radius:30px;text-align:center;font-weight:bold;z-index:1000;display:none;animation:slideUp 0.3s}
.yd-nfc-toast.success{background:#4caf50;color:white}
.yd-nfc-toast.warning{background:#f44336;color:white}
.yd-nfc-loading,.yd-nfc-empty{text-align:center;padding:40px;color:#888}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.6}}
@keyframes slideUp{from{transform:translateY(100px);opacity:0}to{transform:translateY(0);opacity:1}}
@media (max-width:768px){.yd-nfc-instruction-text{font-size:18px}.yd-nfc-compass-arrow{border-left:15px solid transparent;border-right:15px solid transparent;border-bottom:40px solid white}.yd-nfc-voice{width:45px;height:45px;font-size:22px;bottom:15px;right:15px}}