/* SlotIn Design System v4 — Blue Edition Enhanced */
/* 통계 카드 강조 / 수업 칩 다색 / 사이드바 강화 / 레이아웃·HTML 구조 절대 유지 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;600;700;800;900&family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
  /* === Blue Palette === */
  --red:#2563EB;--red-dark:#1d4ed8;--red-light:#eff6ff;--red-mid:#bfdbfe;

  /* === Neutral === */
  --white:#ffffff;--bg:#f0f4f8;--bg-2:#e8eef4;
  --surface:#ffffff;--surface-2:#f0f4f8;--surface2:#f0f4f8;
  --border:#dde4ed;--border-2:#c8d3e0;

  /* === Text === */
  --text:#0f172a;--text-2:#475569;--text-3:#94a3b8;--text-4:#cbd5e1;

  /* === Status === */
  --success:#16a34a;--success-light:#dcfce7;
  --warning:#d97706;--warning-light:#fef3c7;
  --danger:#dc2626;--danger-light:#fee2e2;
  --info:#0891b2;--info-light:#e0f2fe;

  /* === Sport Colors === */
  --sport-health:#2563EB;--sport-yoga:#7c3aed;--sport-pilates:#0891b2;
  --sport-health-light:#eff6ff;--sport-yoga-light:#ede9fe;--sport-pilates-light:#e0f2fe;
  --sport-health-mid:#bfdbfe;--sport-yoga-mid:#ddd6fe;--sport-pilates-mid:#bae6fd;

  /* === Radius === */
  --radius:16px;--radius-sm:10px;--radius-xs:7px;--radius-full:999px;

  /* === Shadows === */
  --shadow-sm:0 1px 4px rgba(37,99,235,.08),0 1px 2px rgba(0,0,0,.04);
  --shadow:0 4px 20px rgba(37,99,235,.12),0 2px 6px rgba(0,0,0,.05);
  --shadow-lg:0 12px 40px rgba(37,99,235,.14),0 4px 10px rgba(0,0,0,.06);
  --shadow-red:0 4px 16px rgba(37,99,235,.28);
  --shadow-card:0 2px 12px rgba(37,99,235,.09),0 1px 3px rgba(0,0,0,.05);

  /* === Fonts === */
  --font-sans:'Noto Sans KR','Inter',-apple-system,sans-serif;
  --font-num:'Inter','Noto Sans KR',sans-serif;

  /* legacy */
  --primary:#2563EB;--primary-dark:#1d4ed8;--primary-light:#eff6ff;
  --font:'Noto Sans KR','Inter',sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:var(--font-sans);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--red);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit}
ul{list-style:none}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:none;border-radius:var(--radius-sm);font-size:.875rem;font-weight:600;line-height:1;padding:.6rem 1.1rem;cursor:pointer;transition:all .18s;white-space:nowrap;text-decoration:none}
.btn--primary{background:var(--red);color:#fff;box-shadow:var(--shadow-red)}
.btn--primary:hover{background:var(--red-dark);box-shadow:0 6px 24px rgba(37,99,235,.38);transform:translateY(-1px)}
.btn--outline{background:transparent;color:var(--text);border:1.5px solid var(--border-2)}
.btn--outline:hover{border-color:var(--red);color:var(--red);background:var(--red-light)}
.btn--ghost{background:transparent;color:var(--text-2)}
.btn--ghost:hover{background:var(--surface-2);color:var(--text)}
.btn--danger{background:var(--danger);color:#fff}
.btn--danger:hover{background:#b91c1c}
.btn--success{background:var(--success);color:#fff}
.btn--success:hover{background:#15803d}
.btn--sm{padding:.4rem .75rem;font-size:.8rem;border-radius:var(--radius-xs)}
.btn--lg{padding:.85rem 1.75rem;font-size:1rem;border-radius:var(--radius)}
.btn--full{width:100%}
.btn--icon{padding:.5rem;border-radius:var(--radius-xs);background:transparent;border:1.5px solid var(--border);color:var(--text-2)}
.btn--icon:hover{border-color:var(--red);color:var(--red)}

/* Forms */
.form-group{display:flex;flex-direction:column;gap:.4rem}
.form-group label{font-size:.8rem;font-weight:600;color:var(--text-2)}
.form-control{width:100%;padding:.65rem .9rem;border:1.5px solid var(--border);border-radius:var(--radius-sm);font-size:.925rem;color:var(--text);background:var(--white);transition:border-color .15s,box-shadow .15s;outline:none}
.form-control:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.form-control::placeholder{color:var(--text-4)}
select.form-control{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394a3b8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;padding-right:2.2rem}
textarea.form-control{resize:vertical;min-height:80px}

/* Cards */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.35rem;box-shadow:var(--shadow-card)}
.card--flat{box-shadow:none}
.card--hover{transition:box-shadow .2s,transform .2s}
.card--hover:hover{box-shadow:var(--shadow);transform:translateY(-2px)}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:.2rem;padding:.2rem .6rem;border-radius:var(--radius-full);font-size:.72rem;font-weight:700;line-height:1.4}.badge svg{flex-shrink:0;vertical-align:middle}
.badge--red,.badge--primary{background:var(--red-light);color:var(--red)}
.badge--green,.badge--success{background:var(--success-light);color:var(--success)}
.badge--yellow,.badge--warning{background:var(--warning-light);color:var(--warning)}
.badge--blue,.badge--info{background:var(--info-light);color:var(--info)}
.badge--gray{background:var(--surface-2);color:var(--text-3);border:1px solid var(--border)}
.badge--danger{background:var(--danger-light);color:var(--danger)}
.badge--health{background:var(--sport-health-light);color:var(--sport-health)}
.badge--yoga{background:var(--sport-yoga-light);color:var(--sport-yoga)}
.badge--pilates{background:var(--sport-pilates-light);color:var(--sport-pilates)}

/* App Header */
.app-header{position:sticky;top:0;z-index:200;background:rgba(255,255,255,.97);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 1.75rem;height:64px;box-shadow:0 1px 6px rgba(37,99,235,.07)}
.app-header__logo{font-family:var(--font-num);font-size:1.4rem;font-weight:900;color:var(--text);letter-spacing:-.04em}
.app-header__logo span{color:var(--red)}
.admin-badge{font-size:.6rem;font-weight:700;background:var(--red);color:#fff;padding:.15rem .45rem;border-radius:var(--radius-xs);vertical-align:middle;margin-left:.4rem}
.app-header__right,.app-header__user{display:flex;align-items:center;gap:.75rem;font-size:.88rem;color:var(--text-2)}

/* Layout */
.app-layout{display:grid;grid-template-columns:260px 1fr;min-height:calc(100vh - 64px)}

/* Sidebar - 강화된 스타일 */
.sidebar{background:var(--white);border-right:1px solid var(--border);padding:1.5rem 1rem;display:flex;flex-direction:column;gap:.2rem;box-shadow:2px 0 12px rgba(37,99,235,.05)}
.sidebar__label,.sidebar__section-label{font-size:.68rem;font-weight:700;color:var(--text-4);text-transform:uppercase;letter-spacing:.1em;padding:.85rem .75rem .35rem}
.sidebar__item{display:flex;align-items:center;gap:.75rem;padding:.7rem 1rem;border-radius:var(--radius-sm);font-size:.925rem;font-weight:500;color:var(--text-2);background:none;border:none;text-align:left;width:100%;transition:all .15s;cursor:pointer;position:relative}
.sidebar__item:hover{background:var(--surface-2);color:var(--text)}
.sidebar__item.is-active{background:var(--red-light);color:var(--red);font-weight:700;box-shadow:inset 3px 0 0 var(--red)}
.sidebar__item.is-active::before{content:'';position:absolute;left:0;top:20%;bottom:20%;width:3px;background:var(--red);border-radius:0 3px 3px 0}

.app-content{padding:2rem 2rem;overflow-y:auto;background:var(--bg)}

/* Page sections */
.page-section{display:none}
.page-section.is-active{display:block}
.page-title{font-size:1.5rem;font-weight:800;color:var(--text);margin-bottom:1.75rem;letter-spacing:-.02em}
.page-title small{font-size:.875rem;font-weight:400;color:var(--text-3);margin-left:.5rem}

/* Stats grid - 강화된 통계 카드 */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;margin-bottom:2.25rem}
.stat-box{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.6rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:.6rem;
  box-shadow:var(--shadow-card);
  transition:box-shadow .2s,transform .2s;
  position:relative;
  overflow:hidden;
}
.stat-box::after{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
  background:var(--red);
  border-radius:var(--radius) var(--radius) 0 0;
  opacity:.7;
}
.stat-box--danger::after{background:var(--danger)}
.stat-box--success::after{background:var(--success)}
.stat-box--warn::after{background:var(--warning)}
.stat-box--info::after{background:var(--info)}
.stat-box:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.stat-box__icon{
  font-size:1.6rem;
  width:52px;height:52px;
  display:flex;align-items:center;justify-content:center;
  background:var(--red-light);
  border-radius:50%;
  margin-bottom:.35rem;
  color:var(--red);
  flex-shrink:0;
}
.stat-box--danger .stat-box__icon{background:var(--danger-light)}
.stat-box--success .stat-box__icon{background:var(--success-light)}
.stat-box--warn .stat-box__icon{background:var(--warning-light)}
.stat-box--info .stat-box__icon{background:var(--info-light)}
.stat-box__icon--blue{background:#eff6ff;color:#2563eb}
.stat-box__icon--indigo{background:#eef2ff;color:#4f46e5}
.stat-box__icon--green{background:#f0fdf4;color:#16a34a}
.stat-box__icon--orange{background:#fff7ed;color:#ea580c}
.stat-box__val{font-family:var(--font-num);font-size:2.6rem;font-weight:900;color:var(--red);line-height:1;letter-spacing:-.03em}
.stat-box__label{font-size:.85rem;color:var(--text-3);font-weight:500}
.stat-box__sub{font-size:.73rem;color:var(--text-4);margin-top:-.2rem}
.stat-box--danger .stat-box__val{color:var(--danger)}
.stat-box--success .stat-box__val{color:var(--success)}
.stat-box--warn .stat-box__val{color:var(--warning)}
.stat-box--info .stat-box__val{color:var(--info)}

/* Tables */
.data-table,.member-table{width:100%;border-collapse:collapse;font-size:.9rem}
.data-table th,.member-table th{text-align:left;padding:.65rem 1rem;font-size:.72rem;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;border-bottom:2px solid var(--border);background:var(--surface-2)}
.data-table td,.member-table td{padding:.85rem 1rem;border-bottom:1px solid var(--border);color:var(--text-2);vertical-align:middle}
.data-table tr:last-child td,.member-table tr:last-child td{border-bottom:none}
.data-table tr:hover td,.member-table tr:hover td{background:var(--surface-2)}

/* Week calendar */
.week-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.week-nav__title{font-size:1rem;font-weight:700;font-family:var(--font-num)}
.week-calendar{display:grid;grid-template-columns:56px repeat(7,1fr);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;font-size:.8rem;background:var(--white);box-shadow:var(--shadow-card)}
.wc-header{background:var(--surface-2);padding:.65rem .3rem;text-align:center;font-weight:700;font-size:.78rem;border-bottom:2px solid var(--border);border-right:1px solid var(--border);color:var(--text-2)}
.wc-header--time{color:var(--text-4);font-size:.7rem}
.wc-header--today{background:var(--red-light);color:var(--red)}
.wc-time{background:var(--surface-2);padding:.5rem .4rem;text-align:center;font-size:.72rem;color:var(--text-3);border-right:1px solid var(--border);border-bottom:1px solid var(--border);font-family:var(--font-num)}
.wc-cell{min-height:56px;padding:.3rem;border-right:1px solid var(--border);border-bottom:1px solid var(--border);position:relative;transition:background .1s}
.wc-cell:hover{background:var(--red-light)}
.wc-cell.drag-over{background:#eff6ff;outline:2px dashed var(--red)}

/* 수업 칩 - 다색 시스템 */
.booking-chip{
  background:var(--sport-health-light);
  color:var(--sport-health);
  border:1px solid var(--sport-health-mid);
  border-radius:var(--radius-xs);
  padding:.25rem .45rem;
  font-size:.72rem;
  font-weight:600;
  cursor:grab;
  display:flex;
  align-items:center;
  gap:.25rem;
  line-height:1.3;
  margin-bottom:.2rem;
  transition:all .15s;
}
.booking-chip:hover{
  background:var(--sport-health);
  color:#fff;
  border-color:var(--sport-health);
  transform:scale(1.02);
}
/* 종목별 칩 색상 */
.booking-chip--health{background:var(--sport-health-light);color:var(--sport-health);border-color:var(--sport-health-mid)}
.booking-chip--health:hover{background:var(--sport-health);color:#fff;border-color:var(--sport-health)}
.booking-chip--yoga{background:var(--sport-yoga-light);color:var(--sport-yoga);border-color:var(--sport-yoga-mid)}
.booking-chip--yoga:hover{background:var(--sport-yoga);color:#fff;border-color:var(--sport-yoga)}
.booking-chip--pilates{background:var(--sport-pilates-light);color:var(--sport-pilates);border-color:var(--sport-pilates-mid)}
.booking-chip--pilates:hover{background:var(--sport-pilates);color:#fff;border-color:var(--sport-pilates)}
/* 선생님 색상 기반 칩 (인라인 style 사용 시) */
.booking-chip--block{background:var(--bg-2);color:var(--text-3);border-color:var(--border)}
.booking-chip--teacher{background:#e0f2fe;color:var(--info);border-color:#bae6fd}

/* Drag panel */
.member-drag-panel{margin-top:1.25rem;padding:1.1rem;background:var(--surface-2);border-radius:var(--radius);border:1px solid var(--border)}
.member-drag-panel__title{font-size:.8rem;font-weight:700;color:var(--text-3);margin-bottom:.75rem}
.member-drag-list{display:flex;flex-wrap:wrap;gap:.5rem}
.member-drag-chip{background:var(--white);border:1.5px solid var(--border);color:var(--text);border-radius:var(--radius-sm);padding:.4rem .8rem;font-size:.82rem;font-weight:600;cursor:grab;user-select:none;transition:all .15s;display:flex;align-items:center;gap:.4rem;box-shadow:var(--shadow-sm)}
.member-drag-chip:hover{border-color:var(--red);color:var(--red);background:var(--red-light);box-shadow:var(--shadow)}
.member-drag-chip:active{cursor:grabbing;opacity:.7}
.member-drag-chip__sessions{font-size:.7rem;color:var(--text-3)}
.member-drag-chip--no-sessions{opacity:.4;cursor:not-allowed}
.member-drag-chip--block{background:var(--surface-2);border-color:var(--border-2);color:var(--text-3)}

/* Modal */
.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(4px);z-index:500;display:none;align-items:center;justify-content:center;padding:1rem}
.modal-overlay.is-open{display:flex}
.modal{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-lg);width:100%;max-width:480px;max-height:90vh;overflow-y:auto;padding:1.85rem}
.modal--lg{max-width:640px}
.modal__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}
.modal__title{font-size:1.1rem;font-weight:800}
.modal__close{background:none;border:none;font-size:1.25rem;color:var(--text-3);cursor:pointer;padding:.25rem;border-radius:var(--radius-xs);transition:all .15s}
.modal__close:hover{color:var(--text);background:var(--surface-2)}
.modal__footer{display:flex;gap:.75rem;justify-content:flex-end;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border)}
.modal__body{display:flex;flex-direction:column;gap:1rem}

/* Toast */
.toast-container{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:.5rem}
.toast{display:flex;align-items:center;gap:.6rem;background:var(--text);color:#fff;padding:.75rem 1.1rem;border-radius:var(--radius-sm);font-size:.875rem;font-weight:500;box-shadow:var(--shadow-lg);animation:slideIn .2s ease;min-width:240px;max-width:360px}
.toast--success{background:var(--success)}
.toast--error{background:var(--danger)}
.toast--warning{background:var(--warning)}
@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}

/* Notif badge */
.notif-badge{position:relative;display:inline-flex;align-items:center;gap:.4rem;background:var(--surface-2);border:1.5px solid var(--border);color:var(--text-2);padding:.4rem .85rem;border-radius:var(--radius-sm);font-size:.82rem;font-weight:600;cursor:pointer;transition:all .15s}
.notif-badge:hover{border-color:var(--red);color:var(--red)}
.notif-badge__count{background:var(--red);color:#fff;border-radius:var(--radius-full);font-size:.65rem;font-weight:700;min-width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;padding:0 .3rem}
.notif-badge--has-items{border-color:var(--red);color:var(--red)}

/* Timeline */
.timeline{display:flex;flex-direction:column;gap:0}
.timeline-item{display:flex;gap:1rem;position:relative;padding-bottom:1.25rem}
.timeline-item:last-child{padding-bottom:0}
.timeline-item__dot-wrap{display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.timeline-item__dot{width:10px;height:10px;border-radius:50%;background:var(--red);border:2px solid var(--white);box-shadow:0 0 0 2px var(--red);flex-shrink:0;margin-top:.3rem}
.timeline-item__dot--gray{background:var(--text-4);box-shadow:0 0 0 2px var(--text-4)}
.timeline-item__line{width:2px;background:var(--border);flex:1;margin-top:.25rem}
.timeline-item:last-child .timeline-item__line{display:none}
.timeline-item__content{flex:1}
.timeline-item__date{font-size:.72rem;color:var(--text-3);font-family:var(--font-num)}
.timeline-item__title{font-size:.875rem;font-weight:700;color:var(--text);margin-top:.1rem}
.timeline-item__desc{font-size:.8rem;color:var(--text-3);margin-top:.15rem}

/* Chart */
.chart-wrap{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:1.35rem;box-shadow:var(--shadow-card)}
.chart-wrap__title{font-size:.875rem;font-weight:700;color:var(--text);margin-bottom:1rem}

/* Month calendar */
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.cal-nav__title{font-size:1rem;font-weight:700;font-family:var(--font-num)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.25rem}
.cal-day-header{text-align:center;font-size:.72rem;font-weight:700;color:var(--text-3);padding:.4rem 0}
.cal-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:.3rem;border-radius:var(--radius-sm);cursor:pointer;font-size:.82rem;font-weight:500;color:var(--text-2);transition:background .15s;border:1.5px solid transparent}
.cal-day:hover{background:var(--red-light);color:var(--red)}
.cal-day--today{background:var(--red);color:#fff;font-weight:700}
.cal-day--today:hover{background:var(--red-dark)}
.cal-day--selected{border-color:var(--red);background:var(--red-light);color:var(--red)}
.cal-day--other-month{color:var(--text-4)}
.cal-day--blocked{background:var(--surface-2);color:var(--text-4);cursor:not-allowed}
.cal-day__dot{width:5px;height:5px;border-radius:50%;background:var(--red);margin-top:.15rem}
.cal-day__dot--booked{background:var(--success)}

/* Slot grid */
.slot-section{margin-top:1.5rem}
.slot-section__title{font-size:.875rem;font-weight:700;color:var(--text);margin-bottom:.75rem}
.slot-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.5rem}
.slot-btn{padding:.55rem .3rem;border-radius:var(--radius-sm);font-size:.8rem;font-weight:600;text-align:center;border:1.5px solid var(--border);background:var(--white);color:var(--text-2);cursor:pointer;transition:all .15s;font-family:var(--font-num)}
.slot-btn:hover{border-color:var(--red);color:var(--red);background:var(--red-light)}
.slot-btn--booked{background:var(--red);color:#fff;border-color:var(--red);cursor:default}
.slot-btn--my{background:var(--success);color:#fff;border-color:var(--success)}
.slot-btn--blocked{background:var(--surface-2);color:var(--text-4);cursor:not-allowed;border-color:var(--border)}

/* Ring gauge */
.ring-wrap,.session-ring-wrap{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem 0}
.ring-container{position:relative;width:130px;height:130px}
.ring-svg{transform:rotate(-90deg)}
.ring-bg{fill:none;stroke:var(--border);stroke-width:10}
.ring-fill{fill:none;stroke:var(--red);stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .6s ease}
.ring-fill--low{stroke:var(--danger)}
.ring-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.ring-center__val{font-family:var(--font-num);font-size:2rem;font-weight:900;color:var(--red);line-height:1}
.ring-center__val--low{color:var(--danger)}
.ring-center__unit{font-size:.72rem;color:var(--text-3);margin-top:.15rem}
.ring-stats{display:flex;gap:2rem}
.ring-stat{text-align:center}
.ring-stat__val{font-family:var(--font-num);font-size:1.1rem;font-weight:700;color:var(--text)}
.ring-stat__label{font-size:.72rem;color:var(--text-3);margin-top:.1rem}
.ring-stat-divider{width:1px;background:var(--border);align-self:stretch}

/* Tabs */
.tabs{display:flex;border-bottom:2px solid var(--border);margin-bottom:1.5rem;gap:0}
.tab-btn{padding:.65rem 1.1rem;font-size:.875rem;font-weight:600;color:var(--text-3);background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;cursor:pointer;transition:all .15s}
.tab-btn:hover{color:var(--text)}
.tab-btn.is-active{color:var(--red);border-bottom-color:var(--red)}
.tab-content{display:none}
.tab-content.is-active{display:block}

/* Teacher filter chips */
.teacher-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem}
.teacher-chip{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .85rem;border-radius:var(--radius-full);font-size:.8rem;font-weight:600;border:1.5px solid var(--border);background:var(--white);color:var(--text-2);cursor:pointer;transition:all .15s;box-shadow:var(--shadow-sm)}
.teacher-chip:hover{border-color:var(--red);color:var(--red)}
.teacher-chip.is-active{background:var(--red);color:#fff;border-color:var(--red);box-shadow:var(--shadow-red)}
.teacher-chip__dot{width:8px;height:8px;border-radius:50%}

/* Expiry list */
.expiry-list{display:flex;flex-direction:column;gap:.5rem}
.expiry-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--danger-light);border-radius:var(--radius-sm);border-left:3px solid var(--danger)}
.expiry-item__name{font-weight:700;font-size:.875rem}
.expiry-item__left{font-size:.78rem;color:var(--danger);font-weight:600}

/* Blocked dates */
.blocked-dates{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}
.blocked-date-chip{display:inline-flex;align-items:center;gap:.4rem;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-xs);padding:.3rem .65rem;font-size:.8rem;color:var(--text-2);font-family:var(--font-num)}
.blocked-date-chip__remove{color:var(--danger);cursor:pointer;font-size:.9rem;line-height:1}
.blocked-date-chip__remove:hover{color:#b91c1c}

/* Notif confirm */
.notif-confirm-list{max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:.6rem;margin-bottom:1rem}
.notif-confirm-item{background:var(--surface-2);border-radius:var(--radius-sm);padding:.75rem 1rem;font-size:.88rem;line-height:1.6}
.notif-confirm-item__name{font-weight:700;color:var(--red)}
.notif-confirm-item__type{font-size:.75rem;color:var(--text-3);margin-top:.15rem}

/* Settings grid */
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}

/* Bottom nav */
.bottom-nav{display:none}

/* Scrollbar */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:var(--surface-2)}
::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--text-3)}

/* Responsive */
@media(max-width:1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
  .app-layout{grid-template-columns:1fr}
  .sidebar{display:none}
  .app-content{padding:1.25rem 1rem 5rem}
  .settings-grid{grid-template-columns:1fr}
  .bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-top:1px solid var(--border);z-index:100;box-shadow:0 -2px 12px rgba(37,99,235,.08)}
  .bottom-nav__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.5rem .25rem;font-size:.65rem;font-weight:600;color:var(--text-3);background:none;border:none;cursor:pointer;gap:.2rem;transition:color .15s}
  .bottom-nav__item.is-active{color:var(--red)}
  .bottom-nav__item span:first-child{font-size:1.2rem}
}
@media(max-width:600px){
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .week-calendar{grid-template-columns:40px repeat(7,1fr)}
  .slot-grid{grid-template-columns:repeat(4,1fr)}
  .modal{padding:1.25rem}
  .ring-container{width:110px;height:110px}
}
@media(max-width:400px){.slot-grid{grid-template-columns:repeat(3,1fr)}}

/* ── 모바일 강화 ── */
@media(max-width:900px){
  .app-header{padding:0 1rem;height:54px}
  .app-header__logo{font-size:1.15rem}
  .app-header__right .btn--sm{display:none}
  .week-calendar-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .week-calendar{min-width:560px}
  .member-drag-panel{overflow-x:auto}
  .member-drag-list{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.5rem}
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .data-table,.member-table{min-width:520px}
  .chart-grid{grid-template-columns:1fr!important}
  .assign-grid{grid-template-columns:1fr!important}
  .pkg-grid{grid-template-columns:repeat(2,1fr)!important;gap:.75rem!important}
  .tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .tab-btn{white-space:nowrap;flex-shrink:0}
  .modal-overlay{padding:.5rem}
  .modal{padding:1.25rem;border-radius:var(--radius) var(--radius) 0 0;margin-top:auto;max-height:92vh}
  .modal--bottom{position:fixed;bottom:0;left:0;right:0;width:100%;max-width:100%;border-radius:var(--radius) var(--radius) 0 0}
  .day-panel{padding:1rem}
  .slot-grid{grid-template-columns:repeat(3,1fr)}
  .page-title{font-size:1.15rem;margin-bottom:1rem}
  .settings-grid{grid-template-columns:1fr}
  .expiry-item{flex-wrap:wrap;gap:.4rem}
  .toast-container{bottom:5rem;right:.75rem;left:.75rem}
  .toast{min-width:unset;max-width:100%}
}

@media(max-width:600px){
  .app-header{height:50px}
  .app-header__logo{font-size:1.05rem}
  .app-content{padding:1rem .85rem 5.5rem}
  .stat-box{padding:1rem .9rem}
  .stat-box__val{font-size:1.85rem}
  .stat-box__icon{width:40px;height:40px;font-size:1.3rem}
  .cal-day{font-size:.75rem;padding:.2rem}
  .cal-day-header{font-size:.65rem}
  .ring-stats{gap:1rem}
  .pkg-grid{grid-template-columns:1fr 1fr!important}
  .pkg-card{padding:.85rem .75rem!important}
  .pkg-card__name{font-size:.95rem!important}
  .pkg-card__sessions{font-size:1.6rem!important}
  .pkg-card__price{font-size:.85rem!important}
  .pkg-card__desc{font-size:.72rem!important}
  .teacher-filter{gap:.4rem}
  .teacher-chip{padding:.3rem .65rem;font-size:.75rem}
  .bottom-nav__item{font-size:.62rem}
  .bottom-nav__item span:first-child{font-size:1.1rem}
  .form-control{font-size:.875rem}
  .timeline-item__title{font-size:.82rem}
  .timeline-item__desc{font-size:.75rem}
  .blocked-date-chip{font-size:.75rem}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:.65rem}
}
