/* Vyber si papagája — Wizard v2 */
.vp-main{max-width:900px;margin:0 auto;padding:20px}

/* Hero */
.vp-hero{text-align:center;padding:50px 20px 36px;background:linear-gradient(135deg,#e8f5e9,#c8e6c9);border-radius:16px;margin-bottom:32px;transition:all .5s ease}
.vp-hero h1{font-size:clamp(1.6rem,4vw,2.2rem);color:#1a332a;margin-bottom:10px}
.vp-hero p{font-size:1.05rem;color:#5a6b5a;margin-bottom:24px}
.vp-hero-svg{margin-bottom:16px}
.vp-hero-hidden{opacity:0;transform:translateY(-30px) scale(.95);pointer-events:none;max-height:0;padding:0 20px;margin-bottom:0;overflow:hidden}

/* Parrot anim */
.vp-parrot-anim{animation:vpBob 3s ease-in-out infinite}
@keyframes vpBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* Start button */
.vp-start-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 36px;background:#2E7D32;color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s;box-shadow:0 4px 16px rgba(46,125,50,.25)}
.vp-start-btn:hover{background:#1B5E20;transform:translateY(-2px);box-shadow:0 6px 20px rgba(46,125,50,.35)}
.vp-start-btn svg{flex-shrink:0}

/* Wizard container */
.vp-wizard{opacity:0;transform:translateY(20px);transition:opacity .4s ease,transform .4s ease}
.vp-wizard-in{opacity:1;transform:translateY(0)}

/* Progress dots */
.vp-dots{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:32px;padding:0 20px}
.vp-dot{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#c8e6c9;transition:all .3s ease;flex-shrink:0}
.vp-dot.active{color:#4CAF50;transform:scale(1.15)}
.vp-dot.done{color:#2E7D32}
.vp-dot-line{flex:1;height:2px;background:#e0e0e0;max-width:60px;transition:background .3s ease}
.vp-dot-line.active{background:#4CAF50}

/* Steps */
.vp-step{display:none}
.vp-step.active{display:block;animation:vpFade .3s ease}
@keyframes vpFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.vp-step h2{font-size:1.4rem;color:#1a332a;text-align:center;margin-bottom:8px}
.vp-hint{text-align:center;color:#888;font-size:.9rem;margin-bottom:24px}

/* Step icon */
.vp-step-icon{text-align:center;margin-bottom:16px}

/* Slide transitions */
.vp-slide-out{animation:vpSlideOut .3s ease forwards}
@keyframes vpSlideOut{to{opacity:0;transform:translateX(-40px)}}
.vp-slide-in{animation:vpSlideIn .4s ease}
@keyframes vpSlideIn{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}

/* Options grid */
.vp-options{display:grid;gap:12px;max-width:700px;margin:0 auto}
.vp-grid-3{grid-template-columns:repeat(3,1fr)}
.vp-grid-4{grid-template-columns:repeat(4,1fr)}

/* Option buttons */
.vp-opt{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 12px;background:#fff;border:2px solid #e8f5e9;border-radius:12px;cursor:pointer;transition:all .2s;font-family:inherit;font-size:1rem}
.vp-opt:hover{border-color:#4CAF50;background:#f0fdf0;transform:translateY(-2px)}
.vp-opt.selected{border-color:#2E7D32;background:#e8f5e9;box-shadow:0 4px 12px rgba(46,125,50,.15)}
.vp-opt svg{flex-shrink:0}
.vp-opt span{font-weight:600;color:#1a332a;font-size:.95rem;text-align:center}
.vp-opt small{font-size:.78rem;color:#888;text-align:center}

/* Pop animation on select */
.vp-opt-pop{animation:vpPop .35s ease}
@keyframes vpPop{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}

/* Nav */
.vp-nav{text-align:center;margin-top:24px}
.vp-back{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;background:#f5f7f5;border:1px solid #e8f5e9;border-radius:8px;color:#5a6b5a;cursor:pointer;font-family:inherit;font-size:.9rem;transition:background .2s}
.vp-back:hover{background:#e8f5e9;color:#2E7D32}
.vp-back svg{flex-shrink:0}

/* Analyzing */
.vp-analyzing{text-align:center;padding:40px 20px}
.vp-spinner{margin-bottom:20px}
.vp-spin-circle{animation:vpSpin 1.2s linear infinite;transform-origin:50% 50%}
@keyframes vpSpin{to{transform:rotate(360deg)}}
.vp-analyzing-text{font-size:1.3rem;color:#1a332a;margin-bottom:20px}
.vp-analyzing-steps{display:flex;flex-direction:column;gap:8px;max-width:280px;margin:0 auto}
.vp-a-step{font-size:.9rem;color:#bbb;padding:6px 12px;border-radius:8px;transition:all .4s ease}
.vp-a-step.done{color:#2E7D32;background:#e8f5e9;font-weight:600}

/* Results header */
.vp-results-header{display:flex;align-items:center;gap:16px;justify-content:center;margin-bottom:24px}
.vp-results-header h2{margin:0;text-align:left}
.vp-results-header .vp-hint{margin:0;text-align:left}

/* Results grid */
.vp-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-bottom:24px}

/* Result card */
.vp-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid #e8f5e9;box-shadow:0 2px 8px rgba(0,0,0,.04);transition:transform .2s,box-shadow .2s;text-decoration:none;color:inherit;position:relative;opacity:0;animation:vpCardIn .4s ease forwards}
@keyframes vpCardIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.vp-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(46,125,50,.12)}
.vp-card-great{border-color:#C8E6C9}
.vp-card-good{border-color:#FFE0B2}
.vp-card-ok{border-color:#E0E0E0}

/* Card rank badge */
.vp-card-rank{position:absolute;top:10px;left:10px;width:28px;height:28px;border-radius:50%;background:#1a332a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;z-index:2}

/* Card match ring */
.vp-card-match{position:absolute;top:8px;right:8px;z-index:2}
.vp-ring{position:relative;display:flex;align-items:center;justify-content:center}
.vp-ring svg{display:block}
.vp-ring span{position:absolute;font-size:.7rem;font-weight:700;color:#1a332a}
.vp-ring-fill{animation:vpRingIn 1s ease forwards;transition:stroke-dasharray .5s ease}
@keyframes vpRingIn{from{stroke-dasharray:0 100}}

/* Card image */
.vp-card-img{height:160px;background:#f0f7f0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.vp-card-img img{width:100%;height:100%;object-fit:cover}
.vp-card-noimg{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:#f5faf5}

/* Card body */
.vp-card-body{padding:16px}
.vp-card-body h3{font-size:1.05rem;color:#1a332a;margin:0 0 2px}
.vp-latin{font-size:.8rem;color:#888;font-style:italic;display:block;margin-bottom:10px}

/* Bar charts */
.vp-card-bars{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.vp-bar-row{display:flex;align-items:center;gap:8px}
.vp-bar-row span{min-width:70px;font-size:.78rem;color:#5a6b5a}
.vp-bars{display:flex;gap:3px}
.vp-bar{width:14px;height:8px;border-radius:2px;background:#e0e0e0;transition:background .3s ease}
.vp-bar.fill{background:currentColor}

/* Card tags */
.vp-card-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.vp-tag-level{padding:2px 8px;background:#e8f5e9;color:#2E7D32;border-radius:4px;font-size:.75rem;font-weight:600}
.vp-tag-price{padding:2px 8px;background:#fff3e0;color:#E65100;border-radius:4px;font-size:.75rem;font-weight:600}
.vp-verdict{font-size:.82rem;color:#5a6b5a;line-height:1.5;margin:0}

/* Results footer */
.vp-results-footer{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:24px}
.vp-restart{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;background:#2E7D32;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;font-family:inherit;transition:background .2s}
.vp-restart:hover{background:#1B5E20}
.vp-restart svg{flex-shrink:0}
.vp-share{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;background:#fff;color:#2E7D32;border:2px solid #2E7D32;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s}
.vp-share:hover{background:#e8f5e9}
.vp-share svg{flex-shrink:0}

/* Info section */
.vp-info{background:#f8faf8;border-radius:12px;padding:28px;margin-top:40px;border:1px solid #e8f5e9}
.vp-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.vp-info-item{display:flex;align-items:center;gap:12px}
.vp-info-item strong{color:#1a332a;font-size:.95rem}
.vp-info-item small{color:#888;font-size:.8rem}

/* Mobile */
@media(max-width:700px){
    .vp-main{padding:12px}
    .vp-grid-4{grid-template-columns:repeat(2,1fr)}
    .vp-grid-3{grid-template-columns:1fr 1fr 1fr}
    .vp-results{grid-template-columns:1fr}
    .vp-card-img{height:140px}
    .vp-info-grid{grid-template-columns:1fr}
    .vp-results-header{flex-direction:column;text-align:center}
    .vp-dots{padding:0 10px}
    .vp-dot-line{max-width:30px}
}
@media(max-width:480px){
    .vp-grid-3{grid-template-columns:1fr}
    .vp-grid-4{grid-template-columns:1fr 1fr}
    .vp-hero{padding:30px 16px 24px}
    .vp-results-footer{flex-direction:column;align-items:center}
}