:root {
    --jot-blue: #1e90ff;
    --jot-blue-dark: #126fcb;
    --jot-text: #142336;
    --jot-muted: #64748b;
    --jot-panel: #ffffff;
    --jot-line: #dbe8f5;
    --jot-shadow: 0 18px 54px rgba(10, 39, 72, 0.24);
}

.jot-call-launcher {
    position: fixed;
    z-index: 10000;
    right: 22px;
    bottom: 22px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 0;
    border-radius: 999px;
    padding: 13px 18px;
    color: #fff;
    background: var(--jot-blue);
    box-shadow: 0 9px 28px rgba(30, 144, 255, .34);
    font: 700 14px/1.1 system-ui, sans-serif;
    cursor: pointer;
    transition: transform .16s ease, background .16s ease;
}
.jot-call-launcher:hover { background: var(--jot-blue-dark); transform: translateY(-2px); }
.jot-call-launcher[hidden] { display: none !important; }
.jot-call-launcher i { font-size: 16px; }

.jot-call-panel {
    position: fixed;
    z-index: 10001;
    right: 22px;
    bottom: 82px;
    width: min(355px, calc(100vw - 28px));
    padding: 0 18px 18px;
    border: 1px solid var(--jot-line);
    border-radius: 19px;
    color: var(--jot-text);
    background: var(--jot-panel);
    box-shadow: var(--jot-shadow);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.jot-call-panel[hidden] { display: none !important; }
.jot-call-panel-header { display:flex; justify-content:space-between; align-items:center; margin:0 -18px 12px; padding:16px 18px; border-bottom:1px solid #eef3f8; }
.jot-call-panel-header > div { display:flex; align-items:center; gap:10px; }
.jot-call-panel-header strong { display:block; font-size:16px; }
.jot-call-panel-header small { display:block; margin-top:2px; color:var(--jot-muted); font-size:11px; }
.jot-call-brand-dot { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:#fff; background:var(--jot-blue); font-weight:800; font-size:21px; }
.jot-call-close { width:32px; height:32px; border:0; border-radius:9px; background:#f1f6fb; color:#64748b; font-size:24px; line-height:1; cursor:pointer; }
.jot-call-explainer { margin:0 0 15px; color:var(--jot-muted); font-size:12px; line-height:1.5; }
.jot-call-label { display:block; margin:12px 0 7px; font-size:12px; font-weight:700; color:#31465e; }
.jot-call-online-row, .jot-call-target-row { display:flex; gap:7px; }
.jot-call-online-row input, .jot-call-target-row input { box-sizing:border-box; min-width:0; flex:1; height:40px; border:1px solid #cad9e8; border-radius:9px; padding:0 11px; color:var(--jot-text); background:#fff; font:500 13px system-ui,sans-serif; outline:none; }
.jot-call-online-row input:focus, .jot-call-target-row input:focus { border-color:var(--jot-blue); box-shadow:0 0 0 3px rgba(30,144,255,.15); }
.jot-call-online-row button, .jot-call-target-row button { border:0; border-radius:9px; padding:0 12px; color:#fff; background:var(--jot-blue); font:700 12px system-ui,sans-serif; white-space:nowrap; cursor:pointer; }
.jot-call-online-row button:hover, .jot-call-target-row button:hover { background:var(--jot-blue-dark); }
.jot-call-online-row button:disabled, .jot-call-target-row button:disabled { opacity:.55; cursor:not-allowed; }
.jot-call-status { margin-top:8px; min-height:17px; color:#64748b; font-size:11px; line-height:1.45; }
.jot-call-status.is-online { color:#16834a; }
.jot-call-status.is-error { color:#c53e42; }
.jot-call-divider { margin:14px 0 8px; border-top:1px solid #eaf0f6; }
.jot-call-footnote { margin:10px 0 0; color:#76869a; font-size:10px; line-height:1.45; }
body.jot-calls-in-room #jotCallLauncher { display:none; }

.jot-incoming-overlay { position:fixed; inset:0; z-index:20000; display:grid; place-items:center; padding:20px; background:rgba(5,18,35,.72); backdrop-filter:blur(7px); }
.jot-incoming-overlay[hidden] { display:none !important; }
.jot-incoming-card { box-sizing:border-box; width:min(420px, 100%); border:1px solid rgba(255,255,255,.5); border-radius:26px; padding:30px 28px 23px; text-align:center; color:#122238; background:#fff; box-shadow:0 24px 90px rgba(0,0,0,.38); font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.jot-incoming-icon { display:grid; place-items:center; margin:0 auto 16px; width:76px; height:76px; border-radius:50%; color:#fff; background:var(--jot-blue); font-size:29px; box-shadow:0 0 0 10px rgba(30,144,255,.11); animation:jot-call-pulse 1.8s ease-in-out infinite; }
.jot-incoming-eyebrow { margin:0 0 8px; color:var(--jot-blue-dark); letter-spacing:.16em; font-size:10px; font-weight:800; }
.jot-incoming-card h2 { margin:0; font-size:27px; font-weight:800; letter-spacing:-.03em; }
.jot-incoming-from { margin:12px 0 5px; color:#3c5068; font-size:14px; line-height:1.5; }
.jot-incoming-room { margin:0; color:#728298; font-size:12px; overflow-wrap:anywhere; }
.jot-incoming-note { margin:16px 0 19px; color:#8a96a6; font-size:11px; line-height:1.5; }
.jot-incoming-actions { display:flex; justify-content:center; gap:12px; }
.jot-incoming-actions button { display:inline-flex; justify-content:center; align-items:center; gap:9px; min-width:133px; min-height:46px; border:0; border-radius:999px; color:#fff; font:700 13px system-ui,sans-serif; cursor:pointer; }
#jotIncomingDecline { background:#e5484d; }
#jotIncomingDecline:hover { background:#c9363b; }
#jotIncomingAccept { background:#18a65b; }
#jotIncomingAccept:hover { background:#128a49; }
.jot-incoming-countdown { margin:15px 0 0; color:#8a96a6; font-size:11px; }
@keyframes jot-call-pulse { 0%,100% { transform:scale(1); box-shadow:0 0 0 9px rgba(30,144,255,.10); } 50% { transform:scale(1.04); box-shadow:0 0 0 16px rgba(30,144,255,.02); } }
@media (max-width:520px) {
    .jot-call-launcher { right:12px; bottom:12px; padding:12px 14px; }
    .jot-call-panel { right:10px; bottom:68px; width:calc(100vw - 20px); padding-right:14px; padding-left:14px; }
    .jot-call-panel-header { margin-right:-14px; margin-left:-14px; padding-right:14px; padding-left:14px; }
    .jot-incoming-card { padding:26px 18px 21px; border-radius:22px; }
    .jot-incoming-actions { gap:8px; }
    .jot-incoming-actions button { min-width:0; flex:1; }
}
@media (prefers-reduced-motion: reduce) { .jot-incoming-icon { animation:none; } }

.jot-header-wordmark { display:inline-block; margin-left:9px; color:var(--jot-blue); font:800 19px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; letter-spacing:-.045em; vertical-align:middle; }
