@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700&display=swap');

/* =========================================================
   SKC – Modern Design System (full stylesheet)
   Goals:
   - consistent spacing scale + layout rhythm
   - unified cards, inputs, buttons, badges
   - modern shadows, focus, hover, disabled states
   - fixes broken .skc-option block (was missing braces)
   ========================================================= */

:root{
  /* ===== Color system ===== */
  --skc-bg:        #f6f7fb;
  --skc-surface:   #ffffff;
  --skc-surface-2: #f9fafb;
  --skc-surface-3: #f3f4f6;

  --skc-text:      #0f172a;
  --skc-muted:     #64748b;
  --skc-border:    #e5e7eb;

  --skc-primary:   #3b82f6;
  --skc-primary-600:#2563eb;

  --skc-success:   #10b981;
  --skc-danger:    #ef4444;
  --skc-warning:   #f59e0b;

  /* ===== Typography ===== */
  --skc-font: "Barlow",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --skc-fs-12: 0.75rem;
  --skc-fs-14: 0.875rem;
  --skc-fs-16: 1rem;
  --skc-fs-18: 1.125rem;

  /* ===== Spacing scale (8px base) ===== */
  --skc-2:  8px;
  --skc-3: 12px;
  --skc-4: 16px;
  --skc-5: 20px;
  --skc-6: 24px;
  --skc-8: 32px;
  --skc-10:40px;

  /* ===== Radius ===== */
  --skc-r-2: 10px;
  --skc-r-3: 14px;
  --skc-r-4: 18px;

  /* ===== Elevation ===== */
  --skc-shadow-1: 0 1px 2px rgba(15,23,42,.06), 0 6px 18px rgba(15,23,42,.07);
  --skc-shadow-2: 0 6px 18px rgba(15,23,42,.12), 0 12px 32px rgba(15,23,42,.10);

  /* ===== Focus ring ===== */
  --skc-focus: 0 0 0 4px rgba(59,130,246,.18);

  /* ===== Motion ===== */
  --skc-ease: 160ms cubic-bezier(.2,.8,.2,1);

  /* ===== Component sizes ===== */
  --skc-control-h: 44px;
  --skc-control-pad-x: 14px;
  --skc-control-pad-y: 10px;

  /* ===== Content width ===== */
  --skc-max: 1000px;
}

/* ===== Base / Reset-ish ===== */
html,body{
  background: var(--skc-bg);
  color: var(--skc-text);
}

.skc-frontend,
.skc-admin{
  font-family: var(--skc-font);
  color: var(--skc-text);
}

.skc-hidden{ display:none !important; }

*{ box-sizing: border-box; }

a{ color: var(--skc-primary-600); }
a:hover{ color: var(--skc-primary); }

/* ===== Layout ===== */
.skc-frontend{
  max-width: var(--skc-max);
  margin: 0 auto;
  padding: var(--skc-6) var(--skc-4) var(--skc-10);
  display: flex;
  flex-direction: column;
  gap: var(--skc-4);
}

.skc-dashboard{
  display:flex;
  flex-direction:column;
  gap: var(--skc-4);
}

.skc-dashboard-header{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
  gap: var(--skc-3);
}

/* ===== Unified Surfaces ===== */
.skc-surface,
.skc-card,
.skc-panel,
.skc-login-bar,
.skc-poll-view,
.skc-resources-card,
.skc-list-row{
  background: var(--skc-surface);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  box-shadow: var(--skc-shadow-1);
}

.skc-card,
.skc-panel,
.skc-login-bar,
.skc-poll-view,
.skc-resources-card{
  padding: var(--skc-4);
}

.skc-card{
  text-decoration:none;
  color: inherit;
  transition: transform var(--skc-ease), box-shadow var(--skc-ease), border-color var(--skc-ease);
}
.skc-card:hover{
  transform: translateY(-2px);
  box-shadow: var(--skc-shadow-2);
  border-color: rgba(59,130,246,.25);
}

/* ===== Headings / text rhythm ===== */
.skc-poll-title,
.skc-list-title,
.skc-note h4{
  letter-spacing: -0.01em;
}

.skc-list-title .skc-poll-title{
  display: block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.skc-poll-title{ font-size: var(--skc-fs-18); font-weight: 700; }
.skc-poll-desc,
.skc-poll-description,
.skc-phase-note{ color: var(--skc-muted); }

.skc-poll-title-small{
  font-size: var(--skc-fs-14);
  font-weight: 800;
  color: var(--skc-text);
  margin-bottom: var(--skc-2);
}

.skc-poll-desc{
  margin: 0 0 var(--skc-4) 0;
}

.skc-empty{
  color: var(--skc-muted);
  font-style: italic;
}

/* ===== Hint / Info blocks ===== */
.skc-hint{
  display:flex;
  gap: var(--skc-3);
  align-items:flex-start;
  color: var(--skc-muted);
  background: var(--skc-surface-2);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-2);
  padding: var(--skc-3) var(--skc-4);
}

/* ===== Unified Form Controls ===== */
.skc-form textarea,
.skc-form input[type="text"],
.skc-form-inline input[type="text"],
.skc-admin input[type="text"],
.skc-admin textarea,
.skc-admin select,
.skc-login-bar input,
.skc-login-bar select,
.skc-resource-input,
.skc-note-input{
  width: 100%;
  height: var(--skc-control-h);
  padding: var(--skc-control-pad-y) var(--skc-control-pad-x);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-2);
  background: #fff;
  color: var(--skc-text);
  font-size: var(--skc-fs-14);
  transition: border-color var(--skc-ease), box-shadow var(--skc-ease), transform var(--skc-ease);
}

.skc-form textarea,
.skc-admin textarea{
  height: auto;
  min-height: 110px;
  resize: vertical;
}

.skc-login-bar input:focus-visible,
.skc-login-bar select:focus-visible,
.skc-form textarea:focus-visible,
.skc-form input[type="text"]:focus-visible,
.skc-form-inline input[type="text"]:focus-visible,
.skc-admin input[type="text"]:focus-visible,
.skc-admin textarea:focus-visible,
.skc-admin select:focus-visible,
.skc-resource-input:focus-visible,
.skc-note-input:focus-visible{
  outline: none;
  border-color: rgba(59,130,246,.55);
  box-shadow: var(--skc-focus);
}

.skc-login-bar input:disabled,
.skc-login-bar select:disabled,
.skc-form input:disabled,
.skc-form textarea:disabled{
  opacity: .65;
  cursor: not-allowed;
}

/* ===== Buttons ===== */
.skc-btn{
  height: var(--skc-control-h);
  padding: 0 var(--skc-4);
  border-radius: var(--skc-r-2);
  border: 1px solid transparent;
  background: var(--skc-primary);
  color: #fff;
  font-weight: 700;
  font-size: var(--skc-fs-14);
  cursor: pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  transition: transform var(--skc-ease), box-shadow var(--skc-ease), background var(--skc-ease), opacity var(--skc-ease);
  box-shadow: 0 8px 18px rgba(59,130,246,.18);
}

.skc-btn:hover{
  background: var(--skc-primary-600);
  box-shadow: 0 14px 26px rgba(59,130,246,.22);
  transform: translateY(-1px);
}

.skc-btn:active{
  transform: translateY(0px);
  opacity: .95;
}

.skc-btn-secondary{
  background: var(--skc-surface-2);
  color: var(--skc-text);
  border-color: var(--skc-border);
  box-shadow: none;
}

.skc-btn-secondary:hover{
  background: var(--skc-surface-3);
  box-shadow: var(--skc-shadow-1);
}

.skc-btn-danger{
  background: var(--skc-danger);
  box-shadow: 0 10px 18px rgba(239,68,68,.18);
}
.skc-btn-danger:hover{
  background: #dc2626;
  box-shadow: 0 14px 26px rgba(239,68,68,.22);
}

.skc-btn:disabled{
  opacity: .6;
  cursor:not-allowed;
  box-shadow:none;
  transform:none;
}

/* Icon button */
.skc-icon-btn{
  width: 40px;
  height: 40px;
  border-radius: var(--skc-r-2);
  border: 1px solid var(--skc-border);
  background: #fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform var(--skc-ease), box-shadow var(--skc-ease), border-color var(--skc-ease);
}
.skc-icon-btn:hover{
  transform: translateY(-1px);
  box-shadow: var(--skc-shadow-1);
  border-color: rgba(59,130,246,.25);
}
.skc-icon-danger{ color: #b91c1c; }

/* ===== Login Bar ===== */
.skc-login-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: var(--skc-4);
  margin-bottom: var(--skc-4);
  padding: var(--skc-4);
  background: linear-gradient(90deg, #f8fafc 0%, #ffffff 40%);
}

.skc-login-bar::before{ content: none; }

.skc-brand{
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--skc-primary-600);
  padding: 6px 12px;
  border-radius: 999px;
  background: #eaf2ff;
  border: 1px solid rgba(59,130,246,.2);
  cursor: pointer;
  transition: transform var(--skc-ease), box-shadow var(--skc-ease);
}

.skc-brand:hover{
  transform: translateY(-1px);
  box-shadow: var(--skc-shadow-1);
}

.skc-brand:active{
  transform: translateY(0);
}

.skc-easter-egg{
  animation: skc-wiggle 0.7s ease;
}

@keyframes skc-wiggle{
  0%{ transform: rotate(0deg); }
  20%{ transform: rotate(-2deg); }
  40%{ transform: rotate(2deg); }
  60%{ transform: rotate(-1.5deg); }
  80%{ transform: rotate(1.5deg); }
  100%{ transform: rotate(0deg); }
}


.skc-login-section{
  display:flex;
  flex:1;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-start;
  gap: var(--skc-3);
}

.skc-login-block{
  display:flex;
  flex:1;
  flex-wrap:nowrap;
  gap: var(--skc-2);
  align-items:center;
}

#skc-login-toggle{
  margin-left: auto;
}

.skc-login-block input,
.skc-login-block select{
  max-width: 200px;
}

.skc-login-block .skc-btn{
  height: var(--skc-control-h);
  padding: 0 var(--skc-4);
  border-radius: 999px;
}

.skc-login-block label{
  font-weight:700;
  color: var(--skc-muted);
  font-size: var(--skc-fs-14);
}

.skc-login-bar.skc-logged-in .skc-login-block input,
.skc-login-bar.skc-logged-in .skc-login-block select,
.skc-login-bar.skc-logged-in .skc-login-block label,
.skc-login-bar.skc-logged-in .skc-role-status{
  display:none;
}

.skc-privacy-box{
  margin-top: var(--skc-4);
  background: var(--skc-surface);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  box-shadow: var(--skc-shadow-1);
  padding: var(--skc-4);
  color: var(--skc-text);
}

.skc-privacy-box h4{
  margin: 0 0 var(--skc-2) 0;
  color: var(--skc-text);
  font-size: var(--skc-fs-16);
}

.skc-privacy-box ul{
  margin: var(--skc-2) 0 var(--skc-2) var(--skc-4);
}

.skc-login-bar.skc-logged-in + .skc-privacy-box{
  display: none;
}

.skc-role-status{
  font-weight:800;
  color: var(--skc-danger);
}
.skc-role-status.ok{ color: var(--skc-success); }

.skc-cache-info{
  display:flex;
  gap: var(--skc-3);
  font-weight:700;
  align-items:center;
  flex-wrap:nowrap;
  margin-left: auto;
}

.skc-role-chip{
  background: #eef4ff;
  border-color: rgba(59,130,246,.25);
  color: var(--skc-primary-600);
}

.skc-status-chip{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--skc-surface-2);
  border: 1px solid var(--skc-border);
  font-size: var(--skc-fs-14);
  position: relative;
}

.skc-status-chip[data-tooltip]:hover::after{
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(100% + 8px);
  background: #0f172a;
  color: #fff;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: var(--skc-fs-12);
  white-space: nowrap;
  z-index: 10;
}

.skc-online-chip{
  padding-right: 12px;
}

.skc-cache-info .skc-online-chip{
  margin-left: auto;
}

.skc-online-dot{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--skc-success);
  box-shadow: 0 0 0 0 rgba(16,185,129,0.6);
  animation: skc-pulse 1.4s infinite;
}

@keyframes skc-pulse{
  0%{ box-shadow: 0 0 0 0 rgba(16,185,129,0.6); }
  70%{ box-shadow: 0 0 0 8px rgba(16,185,129,0); }
  100%{ box-shadow: 0 0 0 0 rgba(16,185,129,0); }
}

.skc-status-icon{
  font-size: 1.1rem;
}

.skc-admin-token{
  display:flex;
  gap: var(--skc-2);
  align-items:center;
}

#skc-admin-login-status.ok{ color: var(--skc-success); }

/* ===== Admin only ===== */
.skc-admin-only{ display:none; }
.skc-dashboard.skc-admin-mode .skc-admin-only{ display:grid; }

/* ===== Resources ===== */
.skc-resources-card{ margin-top: var(--skc-4); }

.skc-resource-list{
  display:grid;
  gap: var(--skc-3);
  margin:0;
  padding:0;
  list-style:none;
}

.skc-resource-tiles{
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.skc-resource-item{
  display:grid;
  gap: var(--skc-3);
  grid-template-columns: 1fr 1fr auto;
  align-items:center;
  background: var(--skc-surface-2);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  padding: var(--skc-3) var(--skc-4);
  transition: transform var(--skc-ease), box-shadow var(--skc-ease), border-color var(--skc-ease);
}

.skc-resource-item:hover{
  transform: translateY(-1px);
  box-shadow: var(--skc-shadow-1);
  border-color: rgba(59,130,246,.20);
}

.skc-resource-item.view-only{
  grid-template-columns: 1fr;
}

.skc-resource-item.view-only a{
  text-decoration:none;
  color: var(--skc-text);
  font-weight:700;
}

.skc-resource-actions{
  display:flex;
  gap: var(--skc-2);
}

.skc-resource-admin{
  display:grid;
  gap: var(--skc-3);
  margin-top: var(--skc-4);
}

.skc-resource-add{
  display:grid;
  grid-template-columns: 1fr 1fr auto;
  gap: var(--skc-3);
}

.skc-subgrid{
  display:grid;
  gap: var(--skc-3);
  margin-top: var(--skc-4);
}

/* ===== Notes (yellow variant, but modern) ===== */
.skc-note-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--skc-3);
  margin:0;
  padding:0;
  list-style:none;
}

.skc-note{
  background: #fff7c2;
  border: 1px solid #f1e08a;
  border-radius: var(--skc-r-3);
  padding: var(--skc-4);
  position:relative;
  min-height: 130px;
  box-shadow: var(--skc-shadow-1);
  transition: transform var(--skc-ease), box-shadow var(--skc-ease);
}

.skc-note:hover{
  transform: translateY(-2px);
  box-shadow: var(--skc-shadow-2);
}

.skc-note h4{
  margin: 0 0 var(--skc-2) 0;
  font-size: var(--skc-fs-16);
  font-weight: 800;
}

.skc-note p{
  margin: 0 0 var(--skc-3) 0;
  font-size: var(--skc-fs-14);
  color: #334155;
}

.skc-note a{
  font-size: var(--skc-fs-14);
  font-weight: 800;
  text-decoration:none;
  color: var(--skc-primary-600);
}

.skc-dashboard-title{
  margin-bottom: var(--skc-2);
}

.skc-note-admin{
  margin-top: 0;
  margin-bottom: var(--skc-4);
  display: flex;
  flex-wrap: wrap;
  gap: var(--skc-2);
}

.skc-note-link{
  display:block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.skc-note-delete{
  position:absolute;
  top: 10px;
  right: 10px;
  background: transparent;
  border: none;
  cursor:pointer;
  color: #b91c1c;
  font-size: 16px;
}

.skc-note-input{
  height: auto;
  min-height: 40px;
  border-style: dashed;
  border-color: rgba(148,163,184,.75);
  background: rgba(255,255,255,.70);
}

@media (max-width: 640px){
  .skc-frontend{
    padding: var(--skc-4) var(--skc-3) var(--skc-8);
  }
  .skc-login-bar{
    flex-direction: column;
    align-items: stretch;
  }
  .skc-login-bar::before{
    align-self: flex-start;
  }
  .skc-login-section,
  .skc-login-block{
    flex-wrap: wrap;
    width: 100%;
  }
  .skc-login-block input,
  .skc-login-block select,
  .skc-login-block .skc-btn,
  #skc-login-toggle{
    width: 100%;
    max-width: none;
    margin-left: 0;
  }
  .skc-cache-info{
    margin-left: 0;
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .skc-list-header{
    display: none;
  }
  .skc-list-row{
    grid-template-columns: 1fr;
    gap: var(--skc-2);
    align-items: flex-start;
  }
  .skc-poll-item > summary.skc-list-row{
    grid-template-columns: 1fr;
  }
  .skc-form-inline{
    flex-direction: column;
    align-items: stretch;
  }
  .skc-form-inline .skc-btn{
    width: 100%;
  }
  .skc-poll-admin-bar{
    flex-direction: column;
    align-items: stretch;
  }
  .skc-note-grid{
    grid-template-columns: 1fr;
  }
  .skc-note{
    width: 100%;
  }
  .skc-card,
  .skc-panel,
  .skc-resources-card,
  .skc-list-header,
  .skc-list-row{
    width: 100%;
  }
}

/* ===== List ===== */
.skc-list{
  margin-top: var(--skc-4);
  display:grid;
  gap: var(--skc-3);
  padding: 0;
}

.skc-list-footer{
  display:flex;
  justify-content:center;
  margin-top: var(--skc-3);
}

#skc-create-blank{
  background: var(--skc-primary);
  color: #fff;
  border-color: var(--skc-primary);
}

#skc-create-blank:hover{
  background: var(--skc-primary-600);
  border-color: var(--skc-primary-600);
}

.skc-list-header,
.skc-list-row{
  display:grid;
  grid-template-columns: 2fr 1fr 1.2fr 0.8fr 0.8fr;
  gap: var(--skc-3);
  align-items:center;
}

.skc-list-row > span,
.skc-list-header > span{
  min-width: 0;
}

.skc-list-header{
  font-weight: 800;
  color: var(--skc-text);
  padding: var(--skc-3) var(--skc-4);
  background: var(--skc-surface);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-2);
}

.skc-list-header .skc-btn{
  height: 36px;
  padding: 0 var(--skc-3);
  font-size: var(--skc-fs-14);
}

.skc-list-row{
  padding: var(--skc-4) var(--skc-4);
  text-decoration:none;
}

.skc-list-title small{
  display:block;
  color: var(--skc-muted);
  margin-top: 2px;
}

/* ===== Poll item (details) ===== */
.skc-poll-item{
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  background: var(--skc-surface);
  box-shadow: var(--skc-shadow-1);
  overflow:hidden;
  width: 100%;
}


.skc-poll-item > summary{
  list-style:none;
  cursor:pointer;
  padding: var(--skc-4);
  position: relative;
}
.skc-poll-item > summary::-webkit-details-marker{ display:none; }

.skc-poll-item > summary.skc-list-row{
  background: transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  padding: var(--skc-4);
}

.skc-poll-item > summary.skc-list-row .skc-poll-title-row::before{
  content: "▸";
  display: inline-block;
  margin-right: var(--skc-2);
  transition: transform var(--skc-ease);
  color: var(--skc-muted);
}

.skc-poll-item[open] > summary.skc-list-row .skc-poll-title-row::before{
  transform: rotate(90deg);
  color: var(--skc-primary-600);
}

.skc-poll-body{
  padding: var(--skc-4);
  border-top: 1px solid var(--skc-border);
  animation: skc-slide .2s ease;
  display: flex;
  flex-direction: column;
  gap: var(--skc-4);
}

@keyframes skc-slide{
  from{ opacity:0; transform: translateY(-4px); }
  to  { opacity:1; transform: translateY(0); }
}

.skc-poll-view{ padding: var(--skc-5); }

/* ===== Poll meta / badges ===== */
.skc-status-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--skc-surface-2);
  border: 1px solid var(--skc-border);
  color: var(--skc-muted);
  font-weight: 800;
  font-size: var(--skc-fs-12);
}

.skc-icon-btn[data-tooltip]{
  position: relative;
}

.skc-icon-btn[data-tooltip]:hover::after{
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(100% + 8px);
  background: #0f172a;
  color: #fff;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: var(--skc-fs-12);
  white-space: nowrap;
  z-index: 10;
}

.skc-status-badge.skc-status-closed{
  background: #e9f7ef;
  border-color: #c9f0dd;
  color: var(--skc-success);
}

.skc-poll-admin-bar{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap: var(--skc-3);
  flex-wrap:wrap;
  margin-bottom: var(--skc-4);
}

.skc-poll-description p{
  margin: 0;
}

.skc-poll-description{
  margin-bottom: var(--skc-4);
}

.skc-accordion-body > .skc-panel{
  margin: 0 0 var(--skc-4) 0;
}

.skc-accordion-body > .skc-panel:last-child{
  margin-bottom: 0;
}

.skc-poll-head-main{
  display:flex;
  flex-direction:column;
  gap: var(--skc-2);
}

.skc-poll-title-row,
.skc-poll-desc-row{
  display:flex;
  align-items:center;
  gap: var(--skc-2);
  flex-wrap:nowrap;
  min-width: 0;
}

.skc-poll-title-row .skc-poll-title{
  flex: 1 1 auto;
  min-width: 0;
}

.skc-poll-meta{
  display:flex;
  gap: var(--skc-2);
  flex-wrap:wrap;
}

/* Inline editing highlight */
.skc-poll-title.skc-editing,
.skc-poll-title-small.skc-editing,
.skc-poll-desc.skc-editing{
  outline: 2px solid rgba(59,130,246,.28);
  background: #f8fbff;
  border-radius: 10px;
  padding: 4px 8px;
}

.skc-poll-edit,
.skc-poll-save{
  width: 18px;
  height: 18px;
  font-size: 11px;
  padding: 0;
}

/* Poll delete button */
.skc-poll-delete{
  display:none;
  color: var(--skc-danger);
}
.skc-poll-edit-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: var(--skc-3);
  margin-bottom: var(--skc-3);
}
.skc-poll-edit-bar .skc-poll-delete{ display:inline-flex; }
.skc-admin-actions-inline .skc-poll-delete{ display:inline-flex; }
.skc-admin-actions-inline .skc-poll-delete{
  color: var(--skc-danger);
}

.skc-admin-actions-inline{
  display: inline-flex;
  align-items: center;
  gap: var(--skc-2);
}

.skc-admin-select{
  height: var(--skc-control-h);
  padding: 0 var(--skc-4);
  border-radius: 999px;
  border: 1px solid var(--skc-border);
  background: var(--skc-surface-2);
  font-weight: 700;
  color: var(--skc-text);
}

/* ===== Phases ===== */
.skc-phase{ border-left: 4px solid transparent; }
.skc-phase-current{
  border-left-color: var(--skc-primary);
  background: #eef4ff;
}
.skc-phase-future{ opacity: .65; }
.skc-phase-past{ opacity: .9; }

/* ===== Accordion ===== */
.skc-accordion{
  border:none;
  background: transparent;
  margin-bottom: var(--skc-3);
  box-shadow:none;
}
.skc-accordion summary{
  cursor:pointer;
  padding: var(--skc-3) var(--skc-4);
  font-weight: 800;
  list-style:none;
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  background: var(--skc-surface-2);
}
.skc-accordion summary::-webkit-details-marker{ display:none; }
.skc-accordion-current summary{ background: #eef4ff; }
.skc-accordion.locked{ opacity:.6; }
.skc-accordion.locked summary{
  color: var(--skc-muted);
  pointer-events:none;
}
.skc-accordion-body{
  padding: var(--skc-4);
  border: 1px solid var(--skc-border);
  border-top: none;
  border-radius: 0 0 var(--skc-r-3) var(--skc-r-3);
  background: transparent;
}

/* ===== Proposals ===== */
.skc-proposals{
  display:grid;
  gap: var(--skc-3);
}

.skc-proposal{
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  background: var(--skc-surface-2);
  padding: var(--skc-4);
}

.skc-proposal-header{
  display:flex;
  gap: var(--skc-2);
  align-items:center;
  flex-wrap:wrap;
}

.skc-proposal-text.skc-editing{
  outline: 2px solid rgba(59,130,246,.35);
  border-radius: 10px;
  padding: 4px 8px;
  background: #fff;

.skc-proposal-original {
  margin-top: 6px;
  font-size: 0.85rem;
  color: var(--skc-muted);
  background: var(--skc-surface-2);
  border: 1px dashed var(--skc-border);
  border-radius: var(--skc-r-2);
  padding: 6px 8px;
}
}

.skc-proposal-status{
  font-size: var(--skc-fs-12);
  padding: 4px 10px;
  border-radius: 999px;
  background: #f3f4f6;
  border: 1px solid var(--skc-border);
  color: var(--skc-muted);
  font-weight: 800;
}

.skc-admin-actions{
  margin-top: var(--skc-3);
  display:flex;
  justify-content:flex-end;
  gap: var(--skc-2);
}

.skc-edit-text{ min-height: 70px; }

/* ===== Options / Voting (FIXED) ===== */
.skc-options{
  display:grid;
  gap: var(--skc-2);
}

.skc-option{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding: var(--skc-3) var(--skc-4);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  background: var(--skc-surface-2);
}

.skc-count{
  font-weight: 900;
  color: var(--skc-primary-600);
}

.skc-vote-phase3,
.skc-vote-phase4{
  margin-top: var(--skc-2);
}

.skc-vote-status{
  margin-top: var(--skc-2);
  color: var(--skc-success);
  font-weight: 800;
}

/* ===== Results ===== */
.skc-results{
  display:grid;
  gap: var(--skc-2);
}

.skc-result-row{
  display:flex;
  justify-content:space-between;
  padding: var(--skc-2) 0;
  border-bottom: 1px solid var(--skc-border);
}

/* ===== Comment ===== */
.skc-comment{
  margin-top: var(--skc-4);
  background: var(--skc-surface-2);
  border: 1px solid var(--skc-border);
  border-radius: var(--skc-r-3);
  padding: var(--skc-4);
}

/* ===== Forms inline ===== */
.skc-form-inline{
  display:flex;
  gap: var(--skc-2);
  align-items:center;
  margin-bottom: var(--skc-3);
}
.skc-form-inline > *{ flex: 1 1 auto; }
.skc-form-inline .skc-btn{ flex: 0 0 auto; }

/* ===== Admin grids ===== */
.skc-admin .skc-card{ margin-bottom: var(--skc-4); }

.skc-admin .skc-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--skc-3);
  margin-bottom: var(--skc-3);
}

/* ===== Small helpers ===== */
.skc-inline{ display:inline-block; margin-right: var(--skc-2); }