:root{--bg:#0f172a;--bg2:#1e293b;--card:#1e293b;--card-hover:#334155;--text:#f8fafc;--text2:#94a3b8;--text3:#64748b;--accent:#ffc72c;--accent-hover:#e6b800;--accent-glow:rgba(255,199,44,0.3);--success:#22c55e;--danger:#ef4444;--border:rgba(255,255,255,.1);--shadow:0 4px 20px rgba(0,0,0,.3);--r:16px;--r-sm:10px}
[data-theme="light"]{--bg:#f1f5f9;--bg2:#fff;--card:#fff;--card-hover:#f8fafc;--text:#1e293b;--text2:#475569;--text3:#94a3b8;--border:rgba(0,0,0,.1);--shadow:0 4px 20px rgba(0,0,0,.08);--accent:#d97706;--accent-hover:#b45309;--accent-glow:rgba(217,119,6,0.2)}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;padding:60px 0 100px;transition:padding-top 0.3s cubic-bezier(0.4,0,0.2,1)}
body.gmp-visible{padding-top:110px !important}
.container{max-width:800px;margin:0 auto;padding:10px 16px !important}

/* === Компактная карточка профиля === */
.profile-card-compact{background:var(--card);border-radius:20px;padding:20px;margin-bottom:20px;box-shadow:var(--shadow);border:1px solid var(--border);position:relative;overflow:visible}
/* TOP-3 карточка с цветным бордером */
.profile-card-compact.top-1{border-color:#ffd700;box-shadow:0 0 30px rgba(255,215,0,.15),var(--shadow)}
.profile-card-compact.top-2{border-color:#c0c0c0;box-shadow:0 0 25px rgba(192,192,192,.12),var(--shadow)}
.profile-card-compact.top-3{border-color:#cd7f32;box-shadow:0 0 25px rgba(205,127,50,.12),var(--shadow)}
.pcc-main{display:flex;align-items:flex-start;gap:16px}
.pcc-avatar-block{display:flex;flex-direction:column;align-items:center;gap:8px;flex-shrink:0;width:96px}
.pcc-avatar-wrapper{position:relative;width:90px;height:90px;cursor:pointer;overflow:visible}

/* New avatar wrapper styles for scalable avatar + badge */
.avatar-wrapper{position:relative;display:inline-block;width:100px;height:100px;flex-shrink:0;--avatar-scale:1;transform-origin:50% 50%;transform:scale(var(--avatar-scale));transition:transform .22s cubic-bezier(.2,.8,.2,1)}
.avatar-wrapper.scale-110{--avatar-scale:1.1}
.avatar-wrapper.scale-125{--avatar-scale:1.25}
.avatar-wrapper.scale-140{--avatar-scale:1.4}
.avatar-wrapper .avatar{width:100px;height:100px;border-radius:50%;object-fit:cover;border:none;display:block}
.avatar-wrapper .crown-badge{position:absolute;bottom:-4px;left:-4px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;box-shadow:0 2px 8px rgba(0,0,0,0.4);border:2px solid #1f2937;z-index:5}
.avatar-wrapper .rating-badge{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#1e293b,#0f172a);border:1.5px solid rgba(255,215,0,0.45);border-radius:999px;padding:2px 10px;display:flex;align-items:center;gap:4px;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,0.4);z-index:6}
.avatar-wrapper .rating-badge .star-icon{color:#ffd700;font-size:11px}
.avatar-wrapper .rating-badge .score{color:#f8fafc;font-size:12px;font-weight:700}
.avatar-wrapper .rating-badge .count{color:#94a3b8;font-size:10px}
.profile-header{padding-bottom:1.8rem}
/* TOP badge overlay */
.pcc-top-badge{position:absolute;top:-6px;left:50%;transform:translateX(-50%);z-index:5;padding:2px 10px;border-radius:8px;font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase;line-height:1.4;white-space:nowrap;pointer-events:none}
.pcc-top-badge.gold{background:linear-gradient(135deg,#ffd700,#ffb800);color:#422006;box-shadow:0 2px 12px rgba(255,215,0,.5);animation:topPulse 2.5s ease-in-out infinite}
.pcc-top-badge.silver{background:linear-gradient(135deg,#e8e8e8,#c0c0c0);color:#1e293b;box-shadow:0 2px 10px rgba(192,192,192,.4);animation:topPulse 3s ease-in-out infinite}
.pcc-top-badge.bronze{background:linear-gradient(135deg,#e8a45c,#cd7f32);color:#3b1a00;box-shadow:0 2px 10px rgba(205,127,50,.4);animation:topPulse 3.5s ease-in-out infinite}
@keyframes topPulse{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.08)}}
/* TOP glow on avatar — убрано свечение, только цветное кольцо */
.pcc-avatar-wrapper.top-glow-1 .pcc-avatar{border-color:transparent}
.pcc-avatar-wrapper.top-glow-1{animation:none}
.pcc-avatar-wrapper.top-glow-2 .pcc-avatar{border-color:transparent}
.pcc-avatar-wrapper.top-glow-2{animation:none}
.pcc-avatar-wrapper.top-glow-3 .pcc-avatar{border-color:transparent}
.pcc-avatar-wrapper.top-glow-3{animation:none}
@keyframes avatarGlowGold{0%,100%{filter:drop-shadow(0 0 8px rgba(255,215,0,.3))}50%{filter:drop-shadow(0 0 18px rgba(255,215,0,.6))}}
@keyframes avatarGlowSilver{0%,100%{filter:drop-shadow(0 0 6px rgba(192,192,192,.25))}50%{filter:drop-shadow(0 0 14px rgba(192,192,192,.5))}}
@keyframes avatarGlowBronze{0%,100%{filter:drop-shadow(0 0 6px rgba(205,127,50,.25))}50%{filter:drop-shadow(0 0 14px rgba(205,127,50,.5))}}
/* TOP ring colors */
/* TOP ring цвета — переопределяют градиент на свой цвет */
.pcc-avatar-wrapper.top-glow-1 .pcc-ring-progress{stroke:#ffd700;filter:drop-shadow(0 0 7px rgba(255,215,0,.6))}
.pcc-avatar-wrapper.top-glow-2 .pcc-ring-progress{stroke:#c0c0c0;filter:drop-shadow(0 0 6px rgba(192,192,192,.5))}
.pcc-avatar-wrapper.top-glow-3 .pcc-ring-progress{stroke:#cd7f32;filter:drop-shadow(0 0 6px rgba(205,127,50,.5))}
.pcc-avatar-wrapper.top-glow-1 .pcc-ring-bg{stroke:rgba(255,215,0,0.15)}
.pcc-avatar-wrapper.top-glow-2 .pcc-ring-bg{stroke:rgba(192,192,192,0.15)}
.pcc-avatar-wrapper.top-glow-3 .pcc-ring-bg{stroke:rgba(205,127,50,0.15)}

/* Reset colored rings for top-glow variants: make rings neutral and remove glow */
.pcc-avatar-wrapper.top-glow-1 .pcc-avatar,
.pcc-avatar-wrapper.top-glow-2 .pcc-avatar,
.pcc-avatar-wrapper.top-glow-3 .pcc-avatar{
    border-color: transparent !important;
}
.pcc-rating-ring{position:absolute;inset:-9px;width:calc(110% + 10px);height:calc(110% + 10px);transform:rotate(-90deg);pointer-events:none}
.pcc-ring-bg{fill:none;stroke:rgba(255,255,255,0.1);stroke-width:2.5}
.pcc-ring-progress{fill:none;stroke:url(#ratingGradient);stroke-width:2.5;stroke-linecap:round;filter:drop-shadow(0 0 5px rgba(255,199,44,0.4))}
.pcc-avatar{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;object-fit:cover;border:3px solid var(--card);transition:transform .3s,box-shadow .3s}
.pcc-avatar-wrapper:hover .pcc-avatar{transform:translate(-50%,-50%) scale(1.05);box-shadow:0 0 20px var(--accent-glow)}
.pcc-rating-badge {
    z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: -18px;
  background: linear-gradient(135deg, #fff9e1 0%, #fde68a 100%);
  padding: 3px 10px;
  border-radius: 8px;
  line-height: 1;
  box-shadow: 0 1px 2px rgba(245, 158, 11, 0.1);
}.pcc-rating-badge i{color:#f59e0b;font-size:12px}
.pcc-rating-badge strong{font-size:15px;font-weight:700;color:#92400e}
.pcc-rating-badge small{font-size:11px;color:#b45309;opacity:.8}
[data-theme="light"] .pcc-rating-badge {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 1px solid rgba(217, 119, 6, 0.45);
    box-shadow: 0 1px 3px rgba(180, 83, 9, 0.12);
}
[data-theme="light"] .pcc-rating-badge i { color: #b45309; }
[data-theme="light"] .pcc-rating-badge strong { color: #78350f; }
[data-theme="light"] .pcc-rating-badge small { color: #92400e; opacity: 0.95; }
.pcc-online-status{display:inline-flex;align-items:center;gap:5px;margin-top:5px;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:600;background:rgba(0,0,0,.18);backdrop-filter:blur(4px);white-space:normal;flex-wrap:wrap;width:100%;box-sizing:border-box;justify-content:center;line-height:1.4}
.pcc-online-status--online{background:rgba(34,197,94,.18)}
.pcc-online-status--offline{background:rgba(100,116,139,.15)}
.pcc-online-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.pcc-online-status--online .pcc-online-dot{background:#22c55e;box-shadow:0 0 5px #22c55e}
.pcc-online-status--offline .pcc-online-dot{background:#64748b}
.pcc-online-text{color:var(--text2);line-height:1}
.pcc-online-status--online .pcc-online-text{color:#4ade80}
.pcc-device-icon{font-size:12px;opacity:.75}
.pcc-dev-apple{color:#e5e7eb}
.pcc-dev-android{color:#3ddc84}
.pcc-dev-desktop{color:#94a3b8}
.pcc-dev-web{color:#60a5fa}
[data-theme="light"] .pcc-online-status{background:rgba(0,0,0,.07)}
[data-theme="light"] .pcc-online-status--online{background:rgba(34,197,94,.12)}
[data-theme="light"] .pcc-online-text{color:#475569}
[data-theme="light"] .pcc-online-status--online .pcc-online-text{color:#16a34a}
[data-theme="light"] .pcc-dev-apple{color:#374151}
[data-theme="light"] .pcc-dev-desktop{color:#475569}
.pcc-info{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0;padding-top:4px}
.pcc-name-row{display:flex;align-items:center;gap:8px}
.pcc-name{font-size:20px;font-weight:700;color:var(--text);word-break:break-word;white-space:normal}
.pcc-name--toggle{transition:all .2s ease;border-bottom:1px dashed rgba(255,255,255,0.2)}
.pcc-name--toggle:hover{border-bottom-color:var(--accent);color:var(--accent)}
[data-theme="light"] .pcc-name--toggle{border-bottom-color:rgba(0,0,0,0.2)}
.pcc-verified{color:var(--success);font-size:16px;cursor:pointer;flex-shrink:0}
.pcc-pending{color:#f59e0b;font-size:14px;cursor:help;flex-shrink:0}
.pcc-title-mode-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;font-size:11px;color:var(--text2,#94a3b8)}
.pcc-title-mode-label{font-weight:600;color:var(--text2,#94a3b8)}
.pcc-title-mode-select{font-size:11px;padding:5px 10px;border-radius:10px;border:1px solid var(--border,rgba(255,255,255,.12));background:rgba(255,255,255,.06);color:var(--text,#e2e8f0);max-width:100%}
[data-theme="light"] .pcc-title-mode-select{background:#fff;border-color:#e2e8f0;color:#1e293b}

.pcc-role-badge{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#b8860b,#d4a017,#b8860b);color:#fff8dc;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:700;width:fit-content;border:1px solid rgba(212,160,23,0.5);box-shadow:0 2px 10px rgba(184,134,11,0.3);letter-spacing:0.3px;text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.pcc-role-badge .pcc-role-admin-svg,.pcc-role-badge .pcc-role-admin-svg svg{width:14px;height:14px;display:block;flex-shrink:0;color:currentColor}
.pcc-equipment-pill{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.05);border:1px solid var(--border);padding:8px 12px;border-radius:12px;width:fit-content;transition:all .18s}
.pcc-equipment-pill.skill-card--openable{cursor:pointer}
.pcc-equipment-pill.skill-card--openable:hover{background:rgba(255,210,0,0.1);border-color:rgba(255,210,0,0.35)}
[data-theme="light"] .pcc-equipment-pill{background:#f8fafc;border-color:#e2e8f0}
.pcc-eq-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:var(--accent)}
.pcc-eq-icon svg{width:30px;height:30px}
.pcc-eq-icon svg path,.pcc-eq-icon svg rect,.pcc-eq-icon svg circle{fill:currentColor}
.pcc-eq-text{display:flex;flex-direction:column;gap:1px}
.pcc-eq-name{font-size:13px;font-weight:600;color:var(--text)}
.pcc-eq-sub{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.3px}
.pcc-meta{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--text2)}
.pcc-meta span{display:inline-flex;align-items:center;gap:5px}
.pcc-meta i{color:var(--accent);font-size:11px}
.pcc-status{margin-top:4px}
.pcc-status-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:16px;font-size:12px;font-weight:600}
.pcc-status-available{background:rgba(34,197,94,.12);color:var(--success);border:1px solid var(--success)}
.pcc-status-busy{background:rgba(239,68,68,.12);color:var(--danger);border:1px solid var(--danger)}
.pcc-status-working{background:rgba(59,130,246,.12);color:#3b82f6;border:1px solid #3b82f6}
.pcc-status-badge[onclick]:hover,.pcc-role-badge[onclick]:hover{opacity:0.8;transform:scale(0.97)}
/* === Фантомный профиль === */
.pcc-phantom-row{display:flex;align-items:center;gap:8px;margin-top:2px;flex-wrap:wrap}
.pcc-phantom-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:20px;font-size:12px;font-weight:700;background:rgba(251,191,36,.12);border:1px solid rgba(251,191,36,.35);color:#fbbf24;letter-spacing:0.2px}
.pcc-phantom-unreg{font-size:11px;color:var(--text3);background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:20px;padding:3px 9px;white-space:nowrap}

/* === Info Modal (роль / статус) === */
.info-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(6px);z-index:9997;display:none;align-items:center;justify-content:center;padding:24px}
.info-modal-overlay.open{display:flex;animation:smFadeIn .2s ease}
.info-modal{background:var(--card);border-radius:22px;padding:28px 22px 22px;width:100%;max-width:320px;position:relative;border:1px solid rgba(255,255,255,0.1);animation:smSlideUp .22s cubic-bezier(.2,.8,.2,1)}
.info-modal-icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:26px}
.info-modal-icon .info-modal-admin-svg,.info-modal-icon .info-modal-admin-svg svg{width:32px;height:32px;display:block;color:var(--accent,#ffc72c)}
.info-modal-title{font-size:18px;font-weight:700;text-align:center;margin-bottom:6px}
.info-modal-desc{font-size:13px;color:var(--text2);text-align:center;line-height:1.6;margin-bottom:16px}
.info-modal-cta{margin:-6px 0 14px;text-align:center}
.info-modal-cta-link{font-size:10px;font-weight:500;letter-spacing:.02em;color:var(--text-secondary,#94a3b8);opacity:.55;text-decoration:none;border-bottom:1px dotted rgba(148,163,184,.35);padding-bottom:1px;display:inline-block}
.info-modal-cta-link:hover{opacity:.9;color:#f1c40f;border-bottom-color:rgba(241,196,15,.45)}
.info-modal-note{padding:12px 14px;border-radius:12px;font-size:13px;line-height:1.5;text-align:left}
.info-modal-close{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,0.07);border:none;color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:15px}
/* WhatsApp кнопка компактная рядом с именем */
.pcc-wa-inline{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600;text-decoration:none;background:rgba(37,211,102,.12);border:1px solid rgba(37,211,102,.3);color:#25d366;transition:all .2s;white-space:nowrap;margin-left:auto;flex-shrink:0}
.pcc-wa-inline:hover{background:rgba(37,211,102,.22);transform:translateY(-1px)}
.pcc-wa-inline i{font-size:14px}
/* Status inline рядом с навыками */
.pcc-status-inline{display:inline-flex;align-items:center;gap:5px;margin-left:auto}
.pcc-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.pcc-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 14px;border-radius:10px;font-size:13px;font-weight:600;text-decoration:none;border:1px solid var(--border);cursor:pointer;transition:all .2s;background:var(--bg2);color:var(--text)}
.pcc-btn:hover{background:var(--card-hover);transform:translateY(-1px)}
.pcc-btn i{color:var(--accent)}
.pcc-share{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.pcc-share-label{font-size:12px;color:var(--text2)}
.pcc-share-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.pcc-share-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:8px;font-size:12px;font-weight:500;text-decoration:none;background:var(--bg2);border:1px solid var(--border);color:var(--text);cursor:pointer;transition:all .2s}
.pcc-share-btn:hover{background:var(--card-hover)}

/* === Dot menu === */
.pcc-dot-menu-wrap{position:absolute;top:14px;right:14px;z-index:20}
.pcc-dot-btn{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,0.07);border:1px solid var(--border);color:var(--text2);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;backdrop-filter:blur(4px)}
.pcc-dot-btn:hover{background:rgba(255,255,255,0.13);color:var(--text)}
.pcc-dot-dropdown{display:none;position:absolute;top:44px;right:0;background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,0.35);min-width:180px;padding:6px;z-index:100;animation:dotMenuIn .18s ease}
.pcc-dot-dropdown.open{display:block}
@keyframes dotMenuIn{from{opacity:0;transform:scale(0.92) translateY(-6px)}to{opacity:1;transform:scale(1) translateY(0)}}
.pcc-dot-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;font-size:13px;font-weight:500;color:var(--text);text-decoration:none;cursor:pointer;background:none;border:none;width:100%;transition:background .15s}
.pcc-dot-item:hover{background:rgba(255,255,255,0.07)}
[data-theme="light"] .pcc-dot-dropdown{background:#fff;border-color:#e2e8f0;box-shadow:0 12px 40px rgba(15,23,42,.12),0 0 0 1px rgba(15,23,42,.06)}
[data-theme="light"] .pcc-dot-item{color:#0f172a}
[data-theme="light"] .pcc-dot-item:hover{background:#f1f5f9}
[data-theme="light"] .pcc-dot-btn{background:#f8fafc;border-color:#e2e8f0;color:#475569}
[data-theme="light"] .pcc-dot-btn:hover{background:#f1f5f9;color:#0f172a}

/* === Phone link === */
.pcc-phone-trigger{cursor:pointer;transition:color .2s}
.pcc-phone-trigger:hover .pcc-phone-link{color:#25d366}
.pcc-phone-link{color:var(--text);border-bottom:1px dashed rgba(255,255,255,0.25);font-weight:500;transition:all .2s}
[data-theme="light"] .pcc-phone-link{border-bottom-color:rgba(0,0,0,0.2)}

/* === Mini ratings === */
.pcc-mini-ratings{margin-top:14px;padding-top:14px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:6px}
.pcc-mini-rating-row{display:flex;align-items:center;gap:8px}
.pcc-mini-rating-label{font-size:11px;color:var(--text2);width:100px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcc-mini-rating-bar{flex:1;height:4px;background:rgba(255,255,255,0.08);border-radius:4px;overflow:hidden}
.pcc-mini-rating-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--accent),#ffb800)}
.pcc-mini-rating-val{font-size:11px;font-weight:700;color:var(--accent);width:24px;text-align:right;flex-shrink:0}
[data-theme="light"] .pcc-mini-rating-bar{background:rgba(0,0,0,0.08)}

/* TOP ring — шире для топовых */

/* === Портфолио === */
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.portfolio-item{aspect-ratio:1;border-radius:10px;overflow:hidden;cursor:pointer;position:relative;background:rgba(255,255,255,0.04);border:1px dashed rgba(255,255,255,0.15);display:flex;align-items:center;justify-content:center;transition:all .2s}
.portfolio-item:hover{border-color:var(--accent);background:rgba(255,199,44,0.05)}
.portfolio-item img{width:100%;height:100%;object-fit:cover;border-radius:10px;display:block}
.portfolio-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:28px;color:var(--text3);font-size:13px}
.portfolio-empty i{font-size:28px;opacity:0.4}

/* === Phone action modal (центр экрана, как карточка) === */
.phone-modal-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.72);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    z-index:10060;
    display:none;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    padding:max(16px, env(safe-area-inset-top, 0px)) 18px max(24px, env(safe-area-inset-bottom, 0px));
    box-sizing:border-box;
}
.phone-modal-overlay.open{display:flex}
.phone-modal-sheet{
    position:relative;
    background:var(--card);
    border-radius:22px;
    width:100%;
    max-width:400px;
    padding:22px 20px 18px;
    border:1px solid var(--border);
    box-shadow:0 24px 60px rgba(0,0,0,0.45);
    animation:phoneModalCenterIn .28s cubic-bezier(0.32, 0.72, 0, 1) both;
}
@keyframes phoneModalCenterIn{
    from{opacity:0;transform:scale(0.94) translateY(12px)}
    to{opacity:1;transform:scale(1) translateY(0)}
}
.phone-modal-close{
    position:absolute;
    top:12px;
    right:12px;
    width:38px;
    height:38px;
    border-radius:12px;
    border:none;
    background:rgba(255,255,255,0.08);
    color:var(--text2);
    font-size:16px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:background .15s,color .15s;
}
.phone-modal-close:hover{background:rgba(255,255,255,0.14);color:var(--text)}
[data-theme="light"] .phone-modal-close{background:rgba(0,0,0,0.06)}
[data-theme="light"] .phone-modal-close:hover{background:rgba(0,0,0,0.1)}
.phone-modal-title{font-size:13px;color:var(--text2);text-align:center;margin:6px 36px 12px;padding:0 4px}
.phone-modal-number{font-size:20px;font-weight:700;color:var(--text);text-align:center;margin-bottom:18px}
.phone-modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.phone-modal-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 12px;border-radius:14px;border:1px solid var(--border);background:var(--bg2);cursor:pointer;transition:all .2s;text-decoration:none;color:var(--text)}
.phone-modal-btn:hover{transform:translateY(-2px)}
.phone-modal-btn.call{border-color:rgba(34,197,94,0.4);background:rgba(34,197,94,0.07)}
.phone-modal-btn.call i{color:#22c55e;font-size:22px}
.phone-modal-btn.wa{border-color:rgba(37,211,102,0.4);background:rgba(37,211,102,0.07)}
.phone-modal-btn.wa i{color:#25d366;font-size:22px}
.phone-modal-btn span{font-size:12px;font-weight:600}
.phone-modal-cancel{width:100%;padding:12px;background:none;border:none;color:var(--text2);font-size:14px;cursor:pointer;border-radius:10px;transition:background .2s}
.phone-modal-cancel:hover{background:rgba(255,255,255,0.06)}

@media (max-width:600px){
    .profile-card-compact{padding:16px}
    .pcc-main{gap:12px}
    .pcc-avatar-wrapper{width:80px;height:80px}
    .pcc-avatar{width:88px;height:88px}
    .pcc-name{font-size:17px}
    .pcc-role-badge{font-size:11px;padding:4px 10px}
}

/* === Карточки контента === */
.card{background:var(--card);border-radius:20px;padding:20px;box-shadow:0 4px 24px rgba(0,0,0,0.35),inset 0 1px 0 rgba(255,255,255,0.06);border:1.5px solid rgba(255,255,255,0.14);margin-bottom:16px;overflow:hidden}
[data-theme="light"] .card{border-color:rgba(0,0,0,0.09);box-shadow:0 4px 24px rgba(0,0,0,0.07),inset 0 1px 0 rgba(255,255,255,0.8)}
.card-title{font-size:17px;font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.card-title i{color:var(--accent)}
/* Техника - сетка с SVG */
.equipment-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.equipment-item{background:var(--bg2);border-radius:12px;padding:16px 12px;text-align:center;transition:transform .2s,box-shadow .2s;position:relative}
.equipment-item:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(0,0,0,.2)}
a.equipment-item.for-rent{display:block;text-decoration:none;color:inherit;cursor:pointer;border:2px solid #22c55e}
a.equipment-item.for-rent:hover{border-color:#16a34a;box-shadow:0 6px 20px rgba(34,197,94,.3)}
.rent-badge{position:absolute;top:6px;right:6px;background:#22c55e;color:#fff;font-size:10px;padding:2px 6px;border-radius:6px;font-weight:600}
.equipment-icon{width:50px;height:50px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center}
.equipment-icon svg{width:40px;height:40px;fill:var(--accent)}
.equipment-icon i{font-size:32px;color:var(--accent)}
.equipment-name{font-size:12px;color:var(--text2);font-weight:500}
/* Навыки оператора — дизайн 2.0 */
.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
/* Карточка: горизонтальная, плоская */
.skill-card{display:flex;flex-direction:row;align-items:center;gap:10px;padding:10px 12px 8px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:12px;transition:all .18s;cursor:default;position:relative;overflow:hidden}
.skill-card:active{transform:scale(0.98)}
[data-theme="light"] .skill-card{background:#f1f5f9;border-color:#e2e8f0}
/* Primary — золотая рамка */
.skill-card.primary{background:rgba(255,210,0,0.07);border-color:rgba(255,210,0,0.4);box-shadow:0 2px 12px rgba(255,210,0,0.1)}
/* Иконка — квадрат с тёмным фоном как на img1 */
/* .skill-card-icon{width:44px;height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:10px;background:rgba(0,0,0,0.35)} */
/* .skill-card.primary .skill-card-icon{background:rgba(0,0,0,0.45)} */
.skill-card-icon svg{width:30px;height:30px;fill:#468df7}
.skill-card.primary .skill-card-icon svg{fill:#ffd700}
.skill-card-icon i{font-size:24px;color:var(--accent)}
/* Правая часть: название + уровень вертикально */
.skill-card-body{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}
.skill-card-name{font-size:10px;font-weight:700;color:var(--text);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;max-width:100%}
.skill-card.primary .skill-card-name{color:#fff}
/* Уровень: метка над полосой; полоса на новой строке во всю ширину */
.skill-card-level{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%}
.skill-card-level-label{font-size:9px;font-weight:700;letter-spacing:0.2px;text-transform:none;white-space:normal;flex-shrink:0;color:var(--text2)}
.skill-card.primary .skill-card-level-label{color:#ffc72c}
.skill-card:not(.primary) .skill-card-level-label{color:#60a5fa}
.skill-card-level-bar{width:100%;height:3px;border-radius:3px;background:rgba(255,255,255,0.08);overflow:hidden}
.skill-card.primary .skill-card-level-bar{background:rgba(255,215,0,0.12)}
.skill-card-level-fill{height:100%;border-radius:3px;transition:width .28s ease}
.skill-card.primary .skill-card-level-fill{background:linear-gradient(90deg,#ffd700,#ff8c00);width:100%}
.skill-card:not(.primary) .skill-card-level-fill{background:linear-gradient(90deg,#60a5fa,#3b82f6);width:65%}

/* === Skill Modal === */
.skill-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.75);backdrop-filter:blur(6px);z-index:9998;display:none;align-items:center;justify-content:center;padding:24px}
.skill-modal-overlay.open{display:flex;animation:smFadeIn .22s ease}
@keyframes smFadeIn{from{opacity:0}to{opacity:1}}
.skill-modal{background:var(--card);border-radius:22px;padding:28px 24px 24px;width:100%;max-width:340px;position:relative;animation:smSlideUp .25s cubic-bezier(.2,.8,.2,1);border:1px solid rgba(255,255,255,0.1)}
.skill-modal.primary{border-color:rgba(255,210,0,0.4);box-shadow:0 0 40px rgba(255,210,0,0.12)}
@keyframes smSlideUp{from{opacity:0;transform:scale(0.88) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}
.skill-modal-close{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,0.07);border:none;color:var(--text2);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}
.skill-modal-close:hover{background:rgba(255,255,255,0.13)}
.skill-modal-icon{width:72px;height:72px;border-radius:18px;background:rgba(0,0,0,0.4);display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.skill-modal.primary .skill-modal-icon{background:rgba(0,0,0,0.5)}
.skill-modal-icon svg{width:46px;height:46px;fill:#468df7}
.skill-modal.primary .skill-modal-icon svg{fill:#ffd700}
.skill-modal-icon i{font-size:38px;color:var(--accent)}
.skill-modal-name{font-size:20px;font-weight:700;color:var(--text);text-align:center;margin-bottom:6px}
.skill-modal.primary .skill-modal-name{color:#ffd700}
.skill-modal-sublabel{font-size:12px;color:var(--text2);text-align:center;margin-bottom:22px}
.skill-modal-level-wrap{background:rgba(255,255,255,0.04);border-radius:14px;padding:16px 18px}
.skill-modal.primary .skill-modal-level-wrap{background:rgba(255,210,0,0.06);border:1px solid rgba(255,210,0,0.15)}
.skill-modal-level-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.skill-modal-level-label{font-size:11px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase}
.skill-modal.primary .skill-modal-level-label{color:#ffc72c}
.skill-modal:not(.primary) .skill-modal-level-label{color:#60a5fa}
.skill-modal-level-pct{font-size:13px;font-weight:700;color:var(--text2)}
.skill-modal-bar-bg{width:100%;height:8px;border-radius:8px;background:rgba(255,255,255,0.08);overflow:hidden}
.skill-modal.primary .skill-modal-bar-bg{background:rgba(255,215,0,0.15)}
.skill-modal-bar-fill{height:100%;border-radius:8px;width:0;transition:width 0.9s cubic-bezier(.2,.8,.2,1)}
.skill-modal.primary .skill-modal-bar-fill{background:linear-gradient(90deg,#ffd700,#ff8c00)}
.skill-modal:not(.primary) .skill-modal-bar-fill{background:linear-gradient(90deg,#60a5fa,#3b82f6)}
@keyframes barPulse{0%{opacity:1}50%{opacity:0.5}100%{opacity:1}}
.skill-modal-bar-fill.pulse{animation:barPulse 0.45s ease 0.95s 1}
.skill-card--openable{cursor:pointer}
.skill-card--openable:hover{background:rgba(255,255,255,0.08)}
.skill-card--openable.primary:hover{background:rgba(255,210,0,0.12)}

/* Admin owner equipment editor */
.admin-equipment-add-btn{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(255,199,44,.35);border-radius:10px;background:rgba(255,199,44,.12);color:#ffc72c;padding:8px 11px;font-family:inherit;font-size:12px;font-weight:800;cursor:pointer}
.admin-equipment-add-btn:hover{background:rgba(255,199,44,.2);transform:translateY(-1px)}
.admin-equipment-card{width:100%;border:1px solid rgba(255,255,255,0.08);font-family:inherit;text-align:left;color:inherit}
.admin-equipment-card:hover{background:rgba(255,199,44,0.08);border-color:rgba(255,199,44,0.35);transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,0.18)}
.admin-equipment-edit-hint{display:inline-flex;align-items:center;gap:4px;margin-left:auto;color:#ffc72c;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.2px}
.admin-equipment-modal-overlay{position:fixed;inset:0;z-index:10020;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,6,23,.76);backdrop-filter:blur(8px)}
.admin-equipment-modal-overlay.open{display:flex;animation:smFadeIn .18s ease}
.admin-equipment-modal{width:100%;max-width:640px;max-height:92vh;overflow:auto;background:linear-gradient(180deg,rgba(31,29,55,.98),rgba(22,21,42,.98));border:1px solid rgba(255,255,255,.12);border-radius:18px;box-shadow:0 28px 80px rgba(0,0,0,.48);animation:smSlideUp .22s cubic-bezier(.2,.8,.2,1)}
.admin-equipment-modal-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 20px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.admin-equipment-modal-titlewrap{display:flex;align-items:center;gap:12px;min-width:0}
.admin-equipment-modal-icon{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(255,199,44,.14);color:#ffc72c}
.admin-equipment-modal-kicker{font-size:11px;color:#a5b4fc;font-weight:800;text-transform:uppercase;letter-spacing:.35px}
.admin-equipment-modal h3{margin:2px 0 0;color:#fff;font-size:18px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:460px}
.admin-equipment-modal-close{width:34px;height:34px;border:0;border-radius:10px;background:rgba(255,255,255,.07);color:#a7a7c5;cursor:pointer;display:flex;align-items:center;justify-content:center}
.admin-equipment-modal-close:hover{background:rgba(255,255,255,.13);color:#fff}
.admin-equipment-tabs{display:flex;gap:8px;padding:12px 20px 0}
.admin-equipment-tab{border:1px solid transparent;border-radius:10px;padding:8px 12px;background:rgba(255,255,255,.05);color:#a7a7c5;font-size:12px;font-weight:800;cursor:pointer}
.admin-equipment-tab.active{background:#ffc72c;color:#171322;border-color:#ffc72c}
.admin-equipment-form{padding:16px 20px 20px}
.admin-equipment-tabpane{display:none;grid-template-columns:1fr 1fr;gap:12px}
.admin-equipment-tabpane.active{display:grid}
.admin-equipment-field{display:flex;flex-direction:column;gap:7px}
.admin-equipment-field--wide{grid-column:1/-1}
.admin-equipment-field span,.admin-equipment-toggle span,.admin-equipment-meta-grid span{font-size:11px;font-weight:800;color:#a7a7c5;text-transform:uppercase;letter-spacing:.25px}
.admin-equipment-field input,.admin-equipment-field select,.admin-equipment-field textarea{width:100%;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(15,23,42,.55);color:#fff;padding:11px 12px;font-family:inherit;font-size:13px;outline:none}
.admin-equipment-field textarea{resize:vertical;min-height:98px;line-height:1.45}
.admin-equipment-field input:focus,.admin-equipment-field select:focus,.admin-equipment-field textarea:focus{border-color:rgba(255,199,44,.65);box-shadow:0 0 0 3px rgba(255,199,44,.1)}
.admin-equipment-meta-grid{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.admin-equipment-meta-grid>div{padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.04)}
.admin-equipment-meta-grid strong{display:block;margin-top:4px;color:#fff;font-size:13px}
.admin-equipment-toggle{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:12px;border-radius:12px;border:1px solid rgba(34,197,94,.2);background:rgba(34,197,94,.07);cursor:pointer}
.admin-equipment-toggle input{width:18px;height:18px;accent-color:#22c55e}
.admin-equipment-toggle span{color:#86efac}
.admin-equipment-rent-grid{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.admin-equipment-service-links{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.admin-equipment-service-links a{display:inline-flex;align-items:center;gap:7px;padding:9px 11px;border-radius:10px;background:rgba(96,165,250,.1);color:#93c5fd;text-decoration:none;font-size:12px;font-weight:800}
.admin-equipment-service-links a:hover{background:rgba(96,165,250,.18)}
.admin-equipment-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08)}
.admin-equipment-save-status{margin-right:auto;font-size:12px;color:#f87171;font-weight:700}
.admin-equipment-save-status.success{color:#22c55e}
.admin-equipment-btn{border:0;border-radius:12px;padding:11px 14px;font-family:inherit;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.admin-equipment-btn.ghost{background:rgba(255,255,255,.06);color:#d8d8eb}
.admin-equipment-btn.primary{background:linear-gradient(135deg,#ffc72c,#f59e0b);color:#171322}
.admin-equipment-btn:disabled{opacity:.65;cursor:wait}
[data-theme="light"] .admin-equipment-modal{background:#fff;border-color:#e2e8f0}
[data-theme="light"] .admin-equipment-modal h3{color:#0f172a}
[data-theme="light"] .admin-equipment-field input,[data-theme="light"] .admin-equipment-field select,[data-theme="light"] .admin-equipment-field textarea{background:#f8fafc;color:#0f172a;border-color:#e2e8f0}
[data-theme="light"] .admin-equipment-meta-grid>div{background:#f8fafc;border-color:#e2e8f0}
[data-theme="light"] .admin-equipment-meta-grid strong{color:#0f172a}
@media(max-width:640px){.admin-equipment-modal{max-height:94vh}.admin-equipment-tabpane,.admin-equipment-rent-grid,.admin-equipment-meta-grid{grid-template-columns:1fr}.admin-equipment-modal h3{max-width:260px}.admin-equipment-actions{flex-wrap:wrap}.admin-equipment-save-status{width:100%;margin-right:0}.admin-equipment-btn{flex:1;justify-content:center}}

/* Admin panel: remote owner cabinet strip */
.ap-remote-cabinet{margin-bottom:0}
.ap-remote-cabinet-desc{font-size:12px;color:var(--text2);line-height:1.55;margin:0 0 14px}
.ap-remote-cabinet-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ap-remote-cabinet-actions .ap-btn{text-decoration:none;white-space:nowrap}

/* Owner equipment card: link to my_equipment */
.admin-eq-remote-toolbar__btn{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:11px;font-size:12px;font-weight:800;text-decoration:none;border:1px solid rgba(255,199,44,.38);background:rgba(255,199,44,.1);color:#ffc72c;transition:background .15s,border-color .15s,transform .15s}
.admin-eq-remote-toolbar__btn:hover{background:rgba(255,199,44,.2);border-color:rgba(255,199,44,.55);transform:translateY(-1px)}
[data-theme="light"] .admin-eq-remote-toolbar__btn{color:#b45309;border-color:rgba(230,168,0,.45);background:rgba(230,168,0,.1)}
[data-theme="light"] .admin-eq-remote-toolbar__btn:hover{background:rgba(230,168,0,.18)}

/* Modal tab «Кабинет» */
.admin-equipment-tabpane[data-pane="cabinet"]{grid-template-columns:1fr}
.admin-equipment-cabinet-grid{display:flex;flex-direction:column;gap:10px}
.admin-equipment-cabinet-link{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);text-decoration:none;color:#e8e8f0;font-size:13px;font-weight:700;transition:background .15s,border-color .15s}
.admin-equipment-cabinet-link:hover{background:rgba(255,199,44,.12);border-color:rgba(255,199,44,.4);color:#fff}
.admin-equipment-cabinet-link i{width:22px;text-align:center;color:#ffc72c;flex-shrink:0}
.admin-equipment-cabinet-link--wide{grid-column:1/-1}
.admin-equipment-cabinet-note{font-size:12px;color:#94a3b8;line-height:1.5;margin:0}
[data-theme="light"] .admin-equipment-cabinet-link{color:#0f172a;background:#f8fafc;border-color:#e2e8f0}
[data-theme="light"] .admin-equipment-cabinet-link:hover{background:#fffbeb;border-color:#fcd34d}

/* Старые теги — оставляем для совместимости */
.skills-list{display:flex;flex-wrap:wrap;gap:8px}
.skill-tag{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:linear-gradient(135deg,#e0f2fe,#bae6fd);color:#075985;border-radius:20px;font-size:12px;font-weight:500;transition:all .2s}
.skill-tag svg{width:18px;height:18px;fill:#0369a1}
.skill-tag i{font-size:14px;color:#0369a1}
.skill-tag.primary{background:linear-gradient(135deg,#ffd700,#ffb800);color:#0f172a;font-size:14px;padding:10px 18px;font-weight:700;box-shadow:0 4px 12px rgba(255,215,0,0.3);border:2px solid rgba(255,215,0,0.5);position:relative}
.skill-tag.primary svg{width:20px;height:20px;fill:#0f172a}
.skill-tag.primary i{font-size:16px;color:#0f172a}
.skill-tag.primary::before{content:'⭐';margin-right:4px;font-size:14px}
.skill-tag.primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(255,215,0,0.4)}
/* Компания */
.company-card{display:flex;align-items:center;gap:16px;padding:16px;background:var(--bg2);border-radius:12px}
.company-logo{width:70px;height:70px;border-radius:12px;object-fit:contain;background:var(--card);padding:8px;border:1px solid var(--border)}
.company-info h4{font-size:16px;font-weight:600;margin-bottom:4px}
.company-info p{font-size:13px;color:var(--text2)}
/* Кнопки */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:10px;font-size:13px;font-weight:600;text-decoration:none;border:none;cursor:pointer;transition:all .3s}
.btn-primary{background:linear-gradient(135deg,var(--accent),#e6b800);color:#0f172a}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(255,199,44,.3)}
.btn-secondary{background:var(--bg2);color:var(--text);border:1px solid var(--border)}
.btn-success{background:linear-gradient(135deg,#25d366,#128c7e);color:#fff}
/* Отзывы */
.reviews-toggle{width:100%;padding:12px;background:var(--bg2);border:1px solid var(--border);border-radius:10px;color:var(--text);font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.reviews-toggle:hover{background:var(--card)}
.reviews-list{display:none;margin-top:14px}
.reviews-list.show{display:block}
.review-item{background:var(--bg2);border-radius:10px;padding:14px;margin-bottom:10px}
.review-header{display:flex;justify-content:space-between;margin-bottom:10px}
.reviewer-name{font-weight:600;color:var(--accent);text-decoration:none}
.reviewer-name:hover{text-decoration:underline}
.review-date{color:var(--text2);font-size:12px}
.review-criteria{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.criteria-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:rgba(255,199,44,.1);border-radius:16px;font-size:11px}
.review-comment{color:var(--text2);font-size:13px;line-height:1.5;padding-top:10px;border-top:1px solid var(--border)}
/* Модалка */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:9999;padding:20px}
.modal-overlay.show{display:flex}
.modal-content{background:var(--card);border-radius:var(--r);padding:28px;max-width:500px;width:100%;max-height:90vh;overflow-y:auto;position:relative}
.modal-close{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;background:var(--bg2);border:none;color:var(--text);font-size:16px;cursor:pointer}
.modal-title{font-size:18px;font-weight:700;margin-bottom:20px}
.rating-group{margin-bottom:18px}
.rating-label{display:block;margin-bottom:6px;font-weight:600;color:var(--text2);font-size:13px}
.stars{color:var(--accent);font-size:20px;display:flex;gap:2px}
.stars-sm{font-size:13px}
.stars-input{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:3px}
.stars-input input{display:none}
.stars-input label{font-size:26px;color:var(--text2);cursor:pointer;transition:color .2s}
.stars-input input:checked~label,.stars-input label:hover,.stars-input label:hover~label{color:var(--accent)}
.form-textarea{width:100%;padding:12px;background:var(--bg2);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:13px;font-family:inherit;resize:vertical;min-height:80px}
.form-textarea:focus{outline:none;border-color:var(--accent)}
.form-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer;margin-bottom:10px;font-size:13px}
.form-checkbox input{width:18px;height:18px;accent-color:var(--accent)}
@media(max-width:600px){.company-card{flex-direction:column;text-align:center}}
/* Аватар-модал */
.avatar-btn{background:none;border:none;padding:0;margin:0;display:inline-block;cursor:pointer}
.avatar-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:10000;align-items:center;justify-content:center;padding:16px}
.avatar-modal.show{display:flex}
.avatar-modal-content{max-width:90vw;max-height:90vh;border-radius:12px;overflow:hidden;position:relative}
.avatar-modal-content img{display:block;max-width:100%;max-height:90vh;object-fit:contain;border-radius:8px}
.avatar-modal-close{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.08);border:none;color:#fff;font-size:20px;cursor:pointer}
.card {
    background: var(--card);
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06);
    border: 1.5px solid rgba(255,255,255,0.14);
    margin-bottom: 16px;
    overflow: hidden;
}

[data-theme="light"] .card {
    border-color: rgba(0,0,0,0.09);
    box-shadow: 0 4px 24px rgba(0,0,0,0.07), inset 0 1px 0 rgba(255,255,255,0.8);
}

/* ===== БЛОК ТЕХНИКИ ВЛАДЕЛЬЦА — skill-card стиль ===== */

/* Бейдж "В аренде" поверх карточки */
/* Старый абсолютный бейдж — больше не используется, оставляем для совместимости */
.owner-rent-badge {
    display: none;
}

/* Инлайн-бейдж рядом с названием техники — заменён на точку */
.owner-rent-badge-inline {
    display: none; /* устарело */
}

/* Строка уровня с пульсирующей точкой */
.skill-card-level-rent-row {
    display: flex;
    align-items: center;
    gap: 5px;
}

/* Пульсирующая точка «в аренде» */
.owner-rent-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22c55e;
    flex-shrink: 0;
    box-shadow: 0 0 0 0 rgba(34,197,94,0.5);
    animation: rentDotPulse 2s ease-in-out infinite;
}

@keyframes rentDotPulse {
    0%   { box-shadow: 0 0 0 0 rgba(34,197,94,0.5); }
    60%  { box-shadow: 0 0 0 5px rgba(34,197,94,0); }
    100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}

/* ── Lightbox логотипа компании ── */
.logo-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0,0,0,0.82);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .22s ease;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.logo-lightbox--visible {
    opacity: 1;
}
.logo-lightbox-img {
    max-width: min(88vw, 400px);
    max-height: 80vh;
    border-radius: 20px;
    object-fit: contain;
    background: var(--card, #1e293b);
    padding: 16px;
    box-shadow: 0 24px 80px rgba(0,0,0,0.6);
    transform: scale(0.88);
    transition: transform .22s ease;
}
.logo-lightbox--visible .logo-lightbox-img {
    transform: scale(1);
}
.logo-lightbox-close {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
    color: #fff;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s;
    backdrop-filter: blur(4px);
}
.logo-lightbox-close:hover {
    background: rgba(255,255,255,0.22);
}

/* Базовые стили арендной карточки-ссылки (дублируем .skill-card для <a>) */
a.skill-card--rent-link {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    padding: 10px 12px 8px;
    background: rgba(34,197,94,0.07);
    border: 1px solid rgba(34,197,94,0.35);
    border-radius: 12px;
    transition: all .18s;
    position: relative;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

a.skill-card--rent-link:hover {
    background: rgba(34,197,94,0.13);
    border-color: rgba(34,197,94,0.6);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(34,197,94,0.2);
}
a.skill-card--rent-link:active { transform: scale(0.98); }

/* Пояснение под блоком техники */
.owner-equipment-hint {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin-top: 12px;
    padding: 9px 12px;
    background: rgba(34,197,94,0.06);
    border: 1px solid rgba(34,197,94,0.18);
    border-radius: 10px;
    font-size: 12px;
    color: var(--text2);
    line-height: 1.5;
}

.owner-equipment-hint i {
    color: #22c55e;
    font-size: 13px;
    margin-top: 1px;
    flex-shrink: 0;
}

/* ===== БЛОК КОМПАНИИ — PREMIUM DESIGN ===== */
.company-card-premium {
    position: relative;
    overflow: hidden;
}

.company-card-premium::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at top right, rgba(59,130,246,0.07) 0%, transparent 65%);
    pointer-events: none;
    border-radius: inherit;
}

.company-card-premium--owner::before {
    background: radial-gradient(ellipse at top right, rgba(250,204,21,0.07) 0%, transparent 65%);
}

.company-premium-inner {
    display: flex;
    gap: 18px;
    align-items: flex-start;
}

.company-logo-wrap {
    position: relative;
    flex-shrink: 0;
    width: 72px;
    height: 72px;
}

.company-logo-img {
    width: 72px;
    height: 72px;
    border-radius: 16px;
    object-fit: contain;
    background: var(--bg2);
    padding: 8px;
    border: none;
    display: block;
    position: relative;
    z-index: 1;
}

.company-logo-zoomable {
    cursor: zoom-in;
    transition: transform .18s, box-shadow .18s;
}
.company-logo-zoomable:hover {
    transform: scale(1.06);
    box-shadow: 0 4px 18px rgba(0,0,0,0.25);
}

.company-logo-placeholder {
    width: 72px;
    height: 72px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(59,130,246,0.12), rgba(37,99,235,0.08));
    border: 1.5px solid rgba(59,130,246,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: #3b82f6;
    position: relative;
    z-index: 1;
}

.company-logo-placeholder--owner {
    background: linear-gradient(135deg, rgba(250,204,21,0.12), rgba(245,158,11,0.08));
    border-color: rgba(250,204,21,0.3);
    color: var(--accent);
}

.company-logo-glow {
    position: absolute;
    inset: -4px;
    border-radius: 20px;
    background: radial-gradient(circle, rgba(59,130,246,0.25) 0%, transparent 70%);
    filter: blur(8px);
    z-index: 0;
    animation: companyGlow 3s ease-in-out infinite;
}

.company-logo-glow--owner {
    background: radial-gradient(circle, rgba(250,204,21,0.2) 0%, transparent 70%);
}

@keyframes companyGlow {
    0%, 100% { opacity: 0.6; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.08); }
}

.company-details {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.company-name-row {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 8px;
}

.company-name-text {
    font-size: 16px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.3;
}

.company-role-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    background: linear-gradient(135deg, rgba(59,130,246,0.15), rgba(37,99,235,0.1));
    border: 1px solid rgba(59,130,246,0.3);
    color: #60a5fa;
    white-space: nowrap;
    flex-shrink: 0;
}

.company-role-chip--owner {
    background: linear-gradient(135deg, rgba(250,204,21,0.15), rgba(245,158,11,0.1));
    border-color: rgba(250,204,21,0.35);
    color: var(--accent);
}

.company-desc-text {
    font-size: 13px;
    color: var(--text2);
    line-height: 1.55;
    margin: 0;
}

.company-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 2px;
}

.company-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: var(--text3);
}

.company-meta-item i {
    color: var(--accent);
    font-size: 10px;
}

@media (max-width: 768px) {
    .container {
        padding: 13px !important;
    }

    .profile-card-compact,
    .card {
        margin-bottom: 13px;
    }
}

@media (max-width: 420px) {
    .company-premium-inner { gap: 14px; }
    .company-logo-wrap,
    .company-logo-img,
    .company-logo-placeholder { width: 58px; height: 58px; }
    .company-name-text { font-size: 14px; }
}
/* ==================== СВЕТЛАЯ ТЕМА: skill-card + модалки ==================== */

/* --- SVG иконки: обводка через filter в светлой теме --- */
[data-theme="light"] .skill-card-icon svg,
[data-theme="light"] .skill-modal-icon svg {
    filter: drop-shadow(1px 0 0 rgba(0,0,0,0.35))
            drop-shadow(-1px 0 0 rgba(0,0,0,0.35))
            drop-shadow(0 1px 0 rgba(0,0,0,0.35))
            drop-shadow(0 -1px 0 rgba(0,0,0,0.35));
}

/* Иконка обычного навыка — синий, оставляем, просто добавляем обводку */
[data-theme="light"] .skill-card-icon svg { fill: #468df7; }
[data-theme="light"] .skill-modal-icon svg { fill: #468df7; }

/* Иконка основного навыка — янтарная */
[data-theme="light"] .skill-card.primary .skill-card-icon svg,
[data-theme="light"] .skill-modal.primary .skill-modal-icon svg {
    fill: #d97706;
}

/* --- Тёмный текст для skill-card-name --- */
[data-theme="light"] .skill-card-name {
    color: #1e293b;
}

/* Основная техника — тоже тёмный, не белый */
[data-theme="light"] .skill-card.primary .skill-card-name {
    color: #1e293b;
}

/* Уровень-метка обычный (синий) */
[data-theme="light"] .skill-card:not(.primary) .skill-card-level-label {
    color: #3b82f6;
}

/* Уровень-метка основного навыка */
[data-theme="light"] .skill-card.primary .skill-card-level-label {
    color: #b45309;
}

/* Полоса прогресса основного навыка */
[data-theme="light"] .skill-card.primary .skill-card-level-fill {
    background: linear-gradient(90deg, #d97706, #92400e);
}

/* Карточка primary — рамка */
[data-theme="light"] .skill-card.primary {
    background: rgba(217,119,6,0.06);
    border-color: rgba(217,119,6,0.35);
    box-shadow: 0 2px 12px rgba(217,119,6,0.1);
}

/* ==================== СВЕТЛАЯ ТЕМА: skill-modal ==================== */

/* Фон самой модалки */
[data-theme="light"] .skill-modal {
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.08);
    box-shadow: 0 20px 60px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.04);
}

/* Кнопка закрытия */
[data-theme="light"] .skill-modal-close {
    background: rgba(0,0,0,0.05);
    border: 1px solid rgba(0,0,0,0.08);
    color: #64748b;
}

[data-theme="light"] .skill-modal-close:hover {
    background: rgba(0,0,0,0.1);
    color: #1e293b;
}

/* Иконка-квадрат */
[data-theme="light"] .skill-modal-icon {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

[data-theme="light"] .skill-modal.primary .skill-modal-icon {
    background: #fef3c7;
    border-color: rgba(217,119,6,0.2);
}

/* Название и подпись */
[data-theme="light"] .skill-modal-name {
    color: #1e293b;
}

[data-theme="light"] .skill-modal.primary .skill-modal-name {
    color: #92400e;
}

[data-theme="light"] .skill-modal-sublabel {
    color: #64748b;
}

/* Блок уровня */
[data-theme="light"] .skill-modal-level-wrap {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

[data-theme="light"] .skill-modal.primary .skill-modal-level-wrap {
    background: #fffbeb;
    border-color: rgba(217,119,6,0.2);
}

/* Метка уровня */
[data-theme="light"] .skill-modal:not(.primary) .skill-modal-level-label {
    color: #3b82f6;
}

[data-theme="light"] .skill-modal.primary .skill-modal-level-label {
    color: #b45309;
}

/* Процент */
[data-theme="light"] .skill-modal-level-pct {
    color: #475569;
}

/* Фон бара */
[data-theme="light"] .skill-modal-bar-bg {
    background: rgba(0,0,0,0.07);
}

[data-theme="light"] .skill-modal.primary .skill-modal-bar-bg {
    background: rgba(217,119,6,0.12);
}

/* Заливка бара основного */
[data-theme="light"] .skill-modal.primary .skill-modal-bar-fill {
    background: linear-gradient(90deg, #d97706, #92400e);
}

/* primary рамка модалки */
[data-theme="light"] .skill-modal.primary {
    border-color: rgba(217,119,6,0.3);
    box-shadow: 0 20px 60px rgba(0,0,0,0.12), 0 0 30px rgba(217,119,6,0.08);
}