/* ── Orb — floating drill widget ───────────────────────────────────────────
   Deep-space feel earns its keep here: the orb reads as an instrument, not a
   customer-support bubble. All CSS — no canvas, no WebGL, no images. */

#adl-orb-root{position:fixed;right:20px;bottom:20px;z-index:900;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}

#adl-orb{
  position:relative;width:54px;height:54px;border-radius:50%;cursor:pointer;
  border:1px solid rgba(255,138,61,.42);
  background:
    radial-gradient(circle at 34% 30%, rgba(255,190,140,.95) 0%, rgba(255,138,61,.85) 26%,
                    rgba(190,80,20,.55) 52%, rgba(20,14,10,.9) 78%),
    radial-gradient(circle at 70% 78%, rgba(120,170,255,.30), transparent 60%);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.6),
    0 6px 22px rgba(0,0,0,.55),
    0 0 24px rgba(255,138,61,.30),
    inset 0 0 18px rgba(255,138,61,.22);
  display:grid;place-items:center;padding:0;
  transition:transform .16s ease, box-shadow .22s ease;
}
#adl-orb:hover{transform:translateY(-2px) scale(1.04);
  box-shadow:0 0 0 1px rgba(0,0,0,.6),0 8px 26px rgba(0,0,0,.6),0 0 34px rgba(255,138,61,.5),
             inset 0 0 20px rgba(255,138,61,.3)}
#adl-orb:focus-visible{outline:2px solid var(--accent,#ff8a3d);outline-offset:3px}
#adl-orb.on{transform:scale(.94)}

/* a slow orbit line, so it reads as instrumentation rather than decoration */
.orb-ring{position:absolute;inset:-7px;border-radius:50%;pointer-events:none;
  border:1px solid rgba(255,138,61,.20);border-top-color:rgba(255,138,61,.75);
  animation:orb-spin 5.5s linear infinite}
.orb-core{width:7px;height:7px;border-radius:50%;background:#fff5ec;
  box-shadow:0 0 10px 3px rgba(255,214,180,.85);animation:orb-pulse 2.9s ease-in-out infinite}
@keyframes orb-spin{to{transform:rotate(360deg)}}
@keyframes orb-pulse{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.12)}}
@media (prefers-reduced-motion:reduce){
  .orb-ring,.orb-core{animation:none}
}

/* ── panel ── */
#adl-panel{
  position:absolute;right:0;bottom:68px;display:flex;flex-direction:column;overflow:hidden;
  background:#0b0c0e;border:1px solid #262a31;border-radius:14px;
  box-shadow:0 24px 70px rgba(0,0,0,.72), 0 0 0 1px rgba(255,138,61,.10),
             0 0 46px rgba(255,138,61,.07);
}
#adl-panel[hidden]{display:none}
#adl-panel > header{
  display:flex;align-items:center;gap:9px;padding:9px 11px;flex-shrink:0;
  border-bottom:1px solid #262a31;background:#131519;
}
.ap-dot{width:7px;height:7px;border-radius:50%;background:#ff8a3d;
  box-shadow:0 0 8px 2px rgba(255,138,61,.6);flex-shrink:0}
.ap-t{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#ff8a3d}
.ap-scope{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:#6b7280;
  flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-btn{background:transparent;border:1px solid #262a31;border-radius:6px;color:#9aa2ae;
  font:inherit;font-size:12px;line-height:1;cursor:pointer;padding:5px 8px}
.ap-btn:hover{color:#e8eaee;border-color:#c2652b}
#adl-frame{flex:1;width:100%;border:0;background:#0b0c0e}
.ap-grip{position:absolute;left:0;top:0;width:18px;height:18px;cursor:nwse-resize;
  background:linear-gradient(135deg,rgba(255,138,61,.5) 0 2px,transparent 2px 5px,
             rgba(255,138,61,.35) 5px 7px,transparent 7px);border-top-left-radius:14px}

@media(max-width:560px){
  #adl-orb-root{right:14px;bottom:14px}
  #adl-panel{width:calc(100vw - 28px) !important;height:min(70vh,520px) !important}
  .ap-grip{display:none}
}

/* ── REACTOR CORE ──────────────────────────────────────────────────────────
   Replaces the plain sphere. Concentric illuminated rings, a mechanical outer
   ring and HUD ticks — a small AI reactor rather than a chat bubble. All CSS. */
#adl-orb{
  width:78px;height:78px;border:0;background:transparent;box-shadow:none;
  display:grid;place-items:center;position:relative;padding:0;cursor:pointer;
  filter:drop-shadow(0 0 22px rgba(255,102,20,.34));
  transition:filter .25s ease, transform .18s ease;
}
#adl-orb:hover{transform:translateY(-2px);filter:drop-shadow(0 0 34px rgba(255,120,30,.55))}
#adl-orb.on{transform:scale(.96)}
#adl-orb > span{position:absolute;border-radius:50%;pointer-events:none}
.orb-shell{
  inset:8px;
  background:
    radial-gradient(circle at 38% 32%, rgba(255,150,60,.55) 0%, rgba(150,58,6,.75) 38%,
                    rgba(38,16,4,.95) 72%, rgba(12,6,2,1) 100%);
  box-shadow:inset 0 0 22px rgba(255,110,25,.35), inset 0 -6px 14px rgba(0,0,0,.7);
}
.orb-ring{border:1px solid transparent}
.orb-ring.r1{inset:2px;border-color:rgba(255,120,30,.55);
  box-shadow:0 0 10px rgba(255,102,20,.35), inset 0 0 8px rgba(255,102,20,.22)}
.orb-ring.r2{inset:15px;border-color:rgba(255,160,90,.34)}
/* mechanical ticks around the circumference, drawn as a conic mask */
.orb-ticks{
  inset:0;
  background:repeating-conic-gradient(from 0deg,
    rgba(255,140,60,.55) 0deg 1.6deg, transparent 1.6deg 15deg);
  -webkit-mask:radial-gradient(circle, transparent 0 45%, #000 46% 50%, transparent 51%);
          mask:radial-gradient(circle, transparent 0 45%, #000 46% 50%, transparent 51%);
  opacity:.7;
}
.orb-core{
  inset:29px;
  background:radial-gradient(circle, #fff2e2 0 22%, #ffb066 38%, #ff6a12 62%, rgba(255,90,0,.25) 100%);
  box-shadow:0 0 16px 5px rgba(255,120,30,.6);
  animation:reactor 3.6s ease-in-out infinite;
}
@keyframes reactor{
  0%,100%{opacity:.82;transform:scale(.94)}
  50%{opacity:1;transform:scale(1.06)}
}
@media (prefers-reduced-motion:reduce){ .orb-core{animation:none} }

/* ── DOCKED STUDY CONSOLE (desktop) ────────────────────────────────────────
   He reads full exam questions in this panel, so on a desktop it docks to the
   right edge at full height instead of floating in the corner. The page reserves
   room for it with --orb-w so content sits beside it, not underneath. */
@media (min-width:1200px){
  #adl-panel{
    position:fixed;right:18px;top:74px;bottom:18px;height:auto;border-radius:4px;
    clip-path:polygon(20px 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%, 0 20px);
    background:rgba(4,8,11,.72);backdrop-filter:blur(12px);
    border:1px solid rgba(255,105,0,.35);
    box-shadow:0 30px 80px rgba(0,0,0,.55), 0 0 30px rgba(255,100,0,.05),
               inset 0 1px rgba(255,255,255,.04);
  }
  #adl-panel > header{background:rgba(6,10,14,.72);border-bottom-color:rgba(255,105,0,.22);padding:12px 15px}
  .ap-grip{display:none}
  html.orb-max #adl-panel{right:50%;transform:translateX(50%);top:56px;bottom:14px}
}
.ap-dot{box-shadow:0 0 10px 3px rgba(255,138,61,.65)}
.ap-t{font-size:12px}
.ap-btn{width:32px;height:32px;display:grid;place-items:center;border-radius:3px;
  border-color:rgba(150,165,180,.28)}
.ap-btn:hover{background:rgba(255,102,20,.10);border-color:rgba(255,120,30,.6);color:#ffb27a}
