/* etoolly.com — Blue Gradient Theme v3 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ── Light Theme (default) ─────────────────────────────── */
:root{
  --b50:#e8f4ff;--b100:#c3e0ff;--b200:#8ec5f7;--b300:#5aaaf0;
  --b400:#2d8de8;--b500:#1a6fd4;--b600:#1455a8;--b700:#0d3a7a;
  --b800:#082050;--b900:#030e28;
  --sky:#0ea5e9;--sky-g:rgba(14,165,233,.1);

  --bg:#f0f6ff;
  --bg-2:#e6f0ff;
  --surface:#ffffff;
  --surface-2:#f5f9ff;
  --surface-3:#eaf2ff;
  --border:rgba(45,141,232,.12);
  --border-2:rgba(45,141,232,.22);
  --border-3:rgba(45,141,232,.35);

  --ink:#0a1628;
  --ink-2:#334e79;
  --ink-3:#6b88b0;

  --accent:#1a6fd4;
  --accent-2:#2d8de8;
  --accent-3:#38bdf8;
  --accent-glow:rgba(26,111,212,.15);
  --accent-glow-2:rgba(26,111,212,.08);

  --red:#e05555;--red-bg:rgba(224,85,85,.08);--red-border:rgba(224,85,85,.2);
  --green:#1d9e75;--green-bg:rgba(29,158,117,.08);
  --amber:#d97706;--amber-bg:rgba(217,119,6,.08);

  --header-bg:linear-gradient(135deg,#0d3a7a 0%,#1a6fd4 60%,#2d8de8 100%);
  --today-bg:linear-gradient(150deg,#0d3a7a 0%,#1a6fd4 50%,#38bdf8 100%);
  --btn-bg:linear-gradient(135deg,#1455a8,#2d8de8);
  --btn-shadow:rgba(26,111,212,.3);
  --home-title-grad:linear-gradient(135deg,#0d3a7a 0%,#1a6fd4 50%,#38bdf8 100%);
  --bnav-bg:linear-gradient(90deg,#0d3a7a,#1a6fd4);

  --radius-sm:8px;--radius:14px;--radius-lg:20px;
  --shadow:0 2px 12px rgba(13,58,122,.08),0 1px 3px rgba(13,58,122,.05);
  --shadow-lg:0 8px 32px rgba(13,58,122,.14),0 2px 8px rgba(13,58,122,.08);
  --shadow-blue:0 4px 16px rgba(26,111,212,.3);

  --font:'Inter',system-ui,sans-serif;
  --disp:'Segoe UI',system-ui,sans-serif;
  --ease:cubic-bezier(.25,.46,.45,.94);
  --spring:cubic-bezier(.34,1.56,.64,1);
}

/* ── Dark Theme ─────────────────────────────────────────── */
[data-theme=dark]{
  --bg:#060e1e;--bg-2:#08122a;
  --surface:#0d1d38;--surface-2:#112243;--surface-3:#16294e;
  --border:rgba(45,141,232,.15);--border-2:rgba(45,141,232,.28);--border-3:rgba(45,141,232,.4);
  --ink:#e8f1ff;--ink-2:#90aed4;--ink-3:#4e6a8f;
  --accent-glow:rgba(45,141,232,.2);--accent-glow-2:rgba(45,141,232,.1);
  --shadow:0 2px 12px rgba(0,0,0,.4),0 1px 3px rgba(0,0,0,.3);
  --shadow-lg:0 8px 32px rgba(0,0,0,.5),0 2px 8px rgba(0,0,0,.3);
  --home-title-grad:linear-gradient(135deg,#93c5fd 0%,#60a5fa 40%,#38bdf8 100%);
}

html{color-scheme:light}
[data-theme=dark]{color-scheme:dark}

body{
  font-family:var(--font);background:var(--bg);color:var(--ink);
  min-height:100vh;display:flex;flex-direction:column;
  font-size:15px;line-height:1.6;
  transition:background .3s,color .3s;
  -webkit-font-smoothing:antialiased;
}

/* ── Header ─────────────────────────────────────────────── */
.site-header{
  background:var(--header-bg);
  position:sticky;top:0;z-index:200;
  box-shadow:0 2px 20px rgba(13,58,122,.3);
}
.header-inner{
  max-width:1200px;margin:0 auto;padding:0 16px;
  display:flex;align-items:center;gap:8px;height:58px;
}
.logo{
  font-family:var(--disp);font-size:20px;font-weight:700;
  text-decoration:none;color:#fff;letter-spacing:-.02em;white-space:nowrap;flex-shrink:0;
}
.logo-e{color:#7dd3fc}
.logo-dot{color:#fbbf24;font-size:10px;vertical-align:super;margin:0 1px}
.logo-com{font-weight:400;font-size:14px;opacity:.6}

.tool-tabs{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none;padding:0 6px}
.tool-tabs::-webkit-scrollbar{display:none}
.tab{
  display:flex;align-items:center;gap:6px;padding:7px 13px;
  border-radius:var(--radius-sm);text-decoration:none;
  color:rgba(255,255,255,.7);font-size:13.5px;font-weight:500;white-space:nowrap;
  transition:all .2s;border:none;background:none;cursor:pointer;
}
.tab svg{width:15px;height:15px;flex-shrink:0}
.tab:hover{background:rgba(255,255,255,.12);color:#fff}
.tab.active{background:rgba(255,255,255,.18);color:#fff;font-weight:600}

.header-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0}
.theme-toggle{
  width:36px;height:36px;border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);
  color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:16px;transition:all .2s;
}
.theme-toggle:hover{background:rgba(255,255,255,.22)}
.theme-toggle .icon-sun{display:none}
.theme-toggle .icon-moon{display:block}
[data-theme=dark] .theme-toggle .icon-sun{display:block}
[data-theme=dark] .theme-toggle .icon-moon{display:none}

.hamburger{
  display:none;width:36px;height:36px;border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);
  flex-direction:column;gap:5px;align-items:center;justify-content:center;cursor:pointer;
}
.hamburger span{display:block;width:17px;height:1.5px;background:#fff;border-radius:2px;transition:.2s}
.hamburger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* Mobile nav */
.mobile-nav{
  display:none;position:fixed;top:58px;left:0;right:0;
  background:rgba(13,58,122,.97);backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.1);z-index:199;
  padding:8px 12px 14px;flex-direction:column;gap:2px;
}
.mobile-nav.open{display:flex}
.mobile-nav .tab{color:rgba(255,255,255,.8);padding:11px 13px}
.mobile-nav .tab.active,.mobile-nav .tab:hover{background:rgba(255,255,255,.14);color:#fff}

/* Bottom nav */
.bottom-nav{
  display:none;position:fixed;bottom:0;left:0;right:0;
  background:var(--bnav-bg);
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
  z-index:200;gap:0;
  box-shadow:0 -4px 20px rgba(13,58,122,.25);
}
.bottom-nav-item{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:7px 4px;border-radius:8px;text-decoration:none;
  color:rgba(255,255,255,.55);font-size:10px;font-weight:500;
  transition:all .2s var(--spring);cursor:pointer;border:none;background:none;
}
.bottom-nav-item svg{width:21px;height:21px;transition:transform .2s var(--spring)}
.bottom-nav-item:hover,.bottom-nav-item.active{
  color:#fff;background:rgba(255,255,255,.16);
}
.bottom-nav-item.active svg{transform:scale(1.15)}

/* ── Layout ─────────────────────────────────────────────── */
.main-content{flex:1}
.tool-page{max-width:900px;margin:0 auto;padding:24px 16px 80px}
.tool-page.wide{max-width:1100px}

/* ── Hero ───────────────────────────────────────────────── */
.tool-hero{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.tool-hero-icon{
  width:50px;height:50px;border-radius:var(--radius);
  background:var(--btn-bg);
  display:flex;align-items:center;justify-content:center;font-size:24px;
  box-shadow:var(--shadow-blue);flex-shrink:0;
}
.tool-hero h1{font-family:var(--disp);font-size:22px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.tool-hero p{font-size:13px;color:var(--ink-3);margin-top:3px}

/* ── Cards ──────────────────────────────────────────────── */
.card{
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:20px;
  box-shadow:var(--shadow);transition:background .3s,border-color .3s;
}
.card+.card{margin-top:16px}
.card.accent{border-top:3px solid var(--accent-2)}
.card.sky{border-top:3px solid var(--sky)}
.card-title{
  font-size:10.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:var(--ink-3);margin-bottom:15px;
}

/* ── Forms ──────────────────────────────────────────────── */
.form-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.form-group{display:flex;flex-direction:column;gap:5px;flex:1;min-width:110px}
.form-group label{font-size:10.5px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}

input[type=text],input[type=number],input[type=date],input[type=password],
input[type=email],input[type=tel],input[type=url],select,textarea{
  width:100%;padding:10px 13px;
  border:1.5px solid var(--border-2);border-radius:var(--radius-sm);
  font-family:var(--font);font-size:14px;color:var(--ink);
  background:var(--surface-2);transition:all .2s;outline:none;appearance:none;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--accent-2);background:var(--surface);
  box-shadow:0 0 0 3px var(--accent-glow);
}
select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b88b0' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;padding-right:32px;cursor:pointer;
}
textarea{resize:vertical;min-height:80px}
input[type=color]{width:44px;height:38px;padding:3px;border-radius:var(--radius-sm);cursor:pointer}
::placeholder{color:var(--ink-3);opacity:.55}

/* ── Buttons ─────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:7px;
  padding:10px 20px;border-radius:var(--radius-sm);
  border:none;cursor:pointer;font-family:var(--font);
  font-size:14px;font-weight:600;text-decoration:none;
  transition:all .2s var(--ease);white-space:nowrap;
}
.btn:active{transform:scale(.97)}
.btn-primary{
  background:var(--btn-bg);color:#fff;
  box-shadow:0 4px 16px var(--btn-shadow);
}
.btn-primary:hover{box-shadow:0 6px 22px rgba(26,111,212,.45);transform:translateY(-1px)}
.btn-secondary{background:var(--surface-2);color:var(--ink-2);border:1.5px solid var(--border-2)}
.btn-secondary:hover{background:var(--surface-3);color:var(--ink);border-color:var(--accent-2)}
.btn-ghost{background:transparent;color:var(--ink-3);border:1.5px solid var(--border)}
.btn-ghost:hover{background:var(--surface-2);color:var(--ink)}
.btn-danger{background:var(--red-bg);color:var(--red);border:1.5px solid var(--red-border)}
.btn-danger:hover{background:rgba(224,85,85,.14)}
.btn-sky{background:linear-gradient(135deg,#0369a1,#0ea5e9);color:#fff;box-shadow:0 4px 16px rgba(14,165,233,.3)}
.btn-sky:hover{box-shadow:0 6px 22px rgba(14,165,233,.45);transform:translateY(-1px)}
.btn-sm{padding:7px 14px;font-size:12.5px;border-radius:8px}
.btn-lg{padding:12px 28px;font-size:15px;border-radius:var(--radius)}
.btn-full{width:100%;justify-content:center}

/* ── Result Box ─────────────────────────────────────────── */
.result-box{
  background:linear-gradient(135deg,rgba(26,111,212,.08),rgba(45,141,232,.04));
  border:1px solid rgba(26,111,212,.2);border-radius:var(--radius);
  padding:16px 20px;margin-top:16px;
}
.result-label{font-size:10px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.1em;margin-bottom:6px}
.result-value{font-family:var(--disp);font-size:24px;font-weight:800;color:var(--ink);letter-spacing:-.02em}
.result-sub{font-size:13px;color:var(--ink-3);margin-top:5px}

/* ── Calendar ───────────────────────────────────────────── */
.cal-layout{display:grid;grid-template-columns:1fr 290px;gap:16px;align-items:start}
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
.cal-nav-btn{
  width:34px;height:34px;background:var(--surface-2);border:1.5px solid var(--border-2);
  border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:var(--accent);font-size:16px;font-weight:700;text-decoration:none;transition:all .2s;
}
.cal-nav-btn:hover{background:var(--btn-bg);color:#fff;border-color:transparent;box-shadow:var(--shadow-blue)}
.cal-month-label{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink);text-align:center;flex:1;line-height:1.3}
.cal-month-label small{display:block;font-size:11px;color:var(--ink-3);font-weight:400;margin-top:2px}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-day-name{text-align:center;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3);padding:8px 0 4px}
.cal-day-name.sat{color:var(--red)}
.cal-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;position:relative;transition:all .15s}
.cal-day:hover{background:var(--surface-2)}
.cal-day.today{background:var(--btn-bg);box-shadow:var(--shadow-blue)}
.cal-day.today .cal-day-ad{color:#fff;font-weight:800}
.cal-day.today .cal-day-bs{color:rgba(255,255,255,.6)}
.cal-day.holiday{background:var(--red-bg)}
.cal-day.holiday .cal-day-ad{color:var(--red)}
.cal-day.sat .cal-day-ad{color:var(--red)}
.cal-day.empty{pointer-events:none}
.cal-day-ad{font-size:13.5px;font-weight:600;line-height:1;color:var(--ink)}
.cal-day-bs{font-size:8.5px;color:var(--ink-3);margin-top:2px}
.holiday-dot{width:3px;height:3px;background:var(--red);border-radius:50%;position:absolute;bottom:3px}
.cal-legend{display:flex;gap:14px;margin-top:13px;flex-wrap:wrap}
.legend-item{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--ink-3)}
.legend-dot{width:9px;height:9px;border-radius:3px}

/* Today widget */
.today-widget{background:var(--today-bg);border-radius:var(--radius);padding:18px 20px;color:#fff;position:relative;overflow:hidden}
.today-widget::before{content:'';position:absolute;top:-22px;right:-22px;width:100px;height:100px;border-radius:50%;background:rgba(255,255,255,.07)}
.tw-label{font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.65;margin-bottom:4px}
.tw-num{font-family:var(--disp);font-size:36px;font-weight:800;line-height:1;letter-spacing:-.04em;margin-bottom:2px}
.tw-month{font-size:14px;font-weight:600;opacity:.85}
.tw-ad{font-size:11.5px;opacity:.55;margin-top:6px}

/* Holidays */
.holiday-list{list-style:none}
.holiday-list li{display:flex;gap:9px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--border);font-size:13px}
.holiday-list li:last-child{border:none}
.holiday-badge{background:var(--red-bg);color:var(--red);border:1px solid var(--red-border);border-radius:6px;padding:2px 7px;font-size:10px;font-weight:700;white-space:nowrap;flex-shrink:0}
.holiday-badge.public{background:var(--red-bg);color:var(--red)}

/* ── QR Code ────────────────────────────────────────────── */
.qr-layout{display:grid;grid-template-columns:1fr 270px;gap:16px;align-items:start}
.qr-type-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:15px}
.qr-type-tab{padding:6px 12px;border-radius:20px;border:1.5px solid var(--border-2);background:var(--surface-2);font-size:12px;font-weight:500;cursor:pointer;color:var(--ink-2);transition:all .15s}
.qr-type-tab:hover{border-color:var(--accent-2);color:var(--accent)}
.qr-type-tab.active{background:var(--btn-bg);color:#fff;border-color:transparent;font-weight:700;box-shadow:0 2px 8px var(--btn-shadow)}
.qr-preview-box{display:flex;align-items:center;justify-content:center;min-height:230px;background:var(--surface-2);border-radius:var(--radius);border:2px dashed var(--border-2);transition:all .2s}
.qr-preview-box.has-qr{background:#fff;border:1px solid var(--border);padding:14px;box-shadow:var(--shadow)}
#qrcode canvas,#qrcode img{display:block;border-radius:4px}
.color-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.color-row>div{display:flex;flex-direction:column;gap:5px}
.color-row label{font-size:10.5px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}

/* ── Drop Zone ──────────────────────────────────────────── */
.drop-zone{
  border:2px dashed var(--border-2);border-radius:var(--radius);
  padding:44px 24px;text-align:center;background:var(--surface-2);cursor:pointer;
  transition:all .2s var(--ease);
}
.drop-zone:hover,.drop-zone.dragging{border-color:var(--accent-2);background:var(--accent-glow-2)}
.drop-zone-icon{
  width:54px;height:54px;border-radius:var(--radius);
  background:var(--btn-bg);display:flex;align-items:center;justify-content:center;
  margin:0 auto 14px;font-size:24px;box-shadow:var(--shadow-blue);
  transition:transform .2s var(--spring);
}
.drop-zone:hover .drop-zone-icon{transform:scale(1.08) translateY(-2px)}
.drop-zone-icon svg{width:26px;height:26px}
.drop-zone p{color:var(--ink-2);font-size:14.5px;font-weight:500;margin-bottom:6px}
.drop-zone small{color:var(--ink-3);font-size:12px}

/* Image queue */
.image-queue{display:grid;gap:8px;margin-top:14px}
.queue-item{display:flex;align-items:center;gap:11px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 13px;transition:border-color .2s}
.queue-item:hover{border-color:var(--border-2)}
.queue-thumb{width:44px;height:44px;object-fit:cover;border-radius:8px;background:var(--surface-3);flex-shrink:0}
.queue-info{flex:1;min-width:0}
.queue-name{font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.queue-meta{font-size:11px;color:var(--ink-3);margin-top:2px}
.queue-status{font-size:13px;font-weight:700;flex-shrink:0}
.queue-status.done{color:var(--accent)}
.queue-status.error{color:var(--red)}
.progress-bar-wrap{background:var(--surface-3);border-radius:3px;height:3px;margin-top:6px;overflow:hidden}
.progress-bar{height:100%;background:linear-gradient(90deg,#1455a8,#38bdf8);transition:width .3s;width:0;border-radius:3px}

/* ── PDF tool ───────────────────────────────────────────── */
.pdf-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px;margin-top:14px}
.pdf-thumb-wrap{position:relative;border-radius:9px;overflow:hidden;border:1.5px solid var(--border);background:var(--surface-2);aspect-ratio:.75;cursor:grab;transition:all .2s var(--spring)}
.pdf-thumb-wrap:hover{border-color:var(--accent-2);transform:scale(1.03);box-shadow:var(--shadow-blue)}
.pdf-thumb-wrap img{width:100%;height:100%;object-fit:cover}
.pdf-thumb-remove{position:absolute;top:5px;right:5px;background:rgba(0,0,0,.65);color:#fff;border:none;border-radius:50%;width:22px;height:22px;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s}
.pdf-thumb-wrap:hover .pdf-thumb-remove{opacity:1}
.pdf-thumb-num{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.55));color:#fff;font-size:11px;font-weight:700;text-align:center;padding:12px 0 4px}

/* ── Alerts ─────────────────────────────────────────────── */
.alert{padding:12px 16px;border-radius:var(--radius-sm);font-size:14px;margin-bottom:14px;display:flex;align-items:center;gap:10px;border:1px solid}
.alert-success{background:var(--green-bg);color:var(--green);border-color:rgba(29,158,117,.2)}
.alert-error{background:var(--red-bg);color:var(--red);border-color:var(--red-border)}
.alert-info{background:var(--accent-glow-2);color:var(--accent);border-color:rgba(26,111,212,.2)}

/* ── Homepage ───────────────────────────────────────────── */
.home-hero{padding:56px 20px 88px;text-align:center;background:linear-gradient(180deg,rgba(13,58,122,.04),transparent)}
.home-hero-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;background:rgba(26,111,212,.1);border:1px solid rgba(26,111,212,.2);border-radius:20px;font-size:12px;font-weight:600;color:var(--accent);margin-bottom:22px}
[data-theme=dark] .home-hero-badge{background:rgba(45,141,232,.15);border-color:rgba(45,141,232,.25);color:#60a5fa}
.home-hero h1{font-family:var(--disp);font-size:44px;font-weight:800;letter-spacing:-.04em;line-height:1.1;background:var(--home-title-grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:14px}
.home-hero p{font-size:17px;color:var(--ink-3);max-width:480px;margin:0 auto 40px;line-height:1.6}
.home-tools{max-width:820px;margin:-50px auto 0;padding:0 16px 80px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.tool-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px 20px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:11px;box-shadow:var(--shadow);transition:all .25s var(--ease);position:relative}
.tool-card:hover{border-color:var(--border-3);box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.tool-card-icon{width:50px;height:50px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:24px}
.tool-card-icon.blue{background:linear-gradient(135deg,#dbeafe,#bfdbfe)}
.tool-card-icon.sky{background:linear-gradient(135deg,#e0f2fe,#bae6fd)}
.tool-card-icon.purple{background:linear-gradient(135deg,#ede9fe,#ddd6fe)}
.tool-card-icon.green{background:linear-gradient(135deg,#d1fae5,#a7f3d0)}
.tool-card h3{font-family:var(--disp);font-size:16px;font-weight:700;color:var(--ink)}
.tool-card p{font-size:13px;color:var(--ink-3);line-height:1.5;margin-top:-4px}

/* ── Admin ──────────────────────────────────────────────── */
.admin-layout{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 58px)}
.admin-sidebar{background:var(--b800);padding:20px 0}
.admin-sidebar .sidebar-title{padding:0 16px 12px;font-size:10px;font-weight:700;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.1em}
.admin-sidebar a{display:flex;align-items:center;gap:10px;padding:10px 16px;color:rgba(255,255,255,.65);text-decoration:none;font-size:13.5px;font-weight:500;transition:all .15s;margin:2px 8px;border-radius:var(--radius-sm)}
.admin-sidebar a:hover{background:rgba(255,255,255,.1);color:#fff}
.admin-sidebar a.active{background:rgba(45,141,232,.3);color:#7dd3fc}
.admin-content{padding:28px 32px;background:var(--bg)}
.admin-content h1{font-family:var(--disp);font-size:22px;font-weight:700;letter-spacing:-.02em;margin-bottom:22px}
.data-table{width:100%;border-collapse:collapse}
.data-table th{background:var(--b700);color:rgba(255,255,255,.85);text-align:left;padding:11px 16px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.data-table td{padding:12px 16px;border-bottom:1px solid var(--border);font-size:13.5px;color:var(--ink-2)}
.data-table tr:last-child td{border:none}
.data-table tr:hover td{background:var(--accent-glow-2);color:var(--ink)}
.badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:700;background:var(--accent-glow-2);color:var(--accent);border:1px solid rgba(26,111,212,.2)}
.badge.public{background:var(--red-bg);color:var(--red);border-color:var(--red-border)}
.badge.optional{background:var(--amber-bg);color:var(--amber);border-color:rgba(217,119,6,.2)}
.badge.event{background:var(--sky-g);color:var(--sky);border-color:rgba(14,165,233,.2)}

/* ── Footer ─────────────────────────────────────────────── */
.site-footer{background:var(--b800);padding:14px 16px}
.footer-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:10px;font-size:12px;color:rgba(255,255,255,.4);flex-wrap:wrap}
.footer-brand{font-family:var(--disp);font-weight:700;color:rgba(255,255,255,.7);font-size:13px}
.footer-sep{opacity:.3}
.footer-inner a{color:rgba(255,255,255,.45);text-decoration:none;transition:color .15s}
.footer-inner a:hover{color:#7dd3fc}

/* ── Misc ───────────────────────────────────────────────── */
.divider{height:1px;background:var(--border);margin:16px 0}
.chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;background:var(--surface-2);color:var(--ink-2);border:1px solid var(--border)}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--border-3)}

/* ── Responsive ─────────────────────────────────────────── */
@media(max-width:768px){
  .hamburger{display:flex}
  .tool-tabs{display:none}
  .bottom-nav{display:flex}
  .main-content{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .site-footer{margin-bottom:calc(68px + env(safe-area-inset-bottom))}
  .home-hero h1{font-size:30px}
  .home-hero p{font-size:15px}
  .home-tools{grid-template-columns:1fr 1fr;gap:10px;margin-top:-36px;padding:0 12px 100px}
  .cal-layout,.qr-layout{grid-template-columns:1fr}
  .tool-page{padding:16px 12px 24px}
  .tool-hero h1{font-size:19px}
  .tool-hero-icon{width:44px;height:44px;font-size:20px}
  .card{border-radius:var(--radius);padding:16px}
  .admin-layout{grid-template-columns:1fr}
  .admin-sidebar{display:none}
  .admin-content{padding:16px}
  .form-group{min-width:100%}
}
@media(max-width:420px){
  .home-tools{grid-template-columns:1fr}
  .pdf-preview-grid{grid-template-columns:repeat(3,1fr)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}}
