/* HeptaSpin private portal shell. Load AFTER the existing inline page CSS and
   BEFORE babylonian-keypad.css. Presentation only: no new inputs or hidden content. */
@font-face {
  font-family:'Hepta Cuneiform';
  src:url('/client/fonts/HeptaCuneiform.woff?v=20260930') format('woff');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
:root {
  color-scheme:dark;
  --bg:#030201;
  --panel:#090603;
  --ink:#fff8ec;
  --muted:#aa9b84;
  --gold:#ffd04a; /* Existing pages refer to this token; retain its name. */
  --line:rgba(255,214,101,.16);
  --hs-cyan:#77f6ff;
  --hs-ice:#fff8ec;
  --hs-soft:#aa9b84;
  --hs-alert:#ff2948;
}
html { background:#030201; }
body {
  position:relative;
  isolation:isolate;
  overflow-x:hidden;
  min-height:100vh;
  color:var(--hs-ice);
  background:
    radial-gradient(ellipse 38rem 27rem at 81% 4%,rgba(255,208,74,.08),transparent 70%),
    radial-gradient(ellipse 42rem 38rem at 9% 66%,rgba(255,255,255,.018),transparent 75%),
    linear-gradient(145deg,#080503,#030201 57%,#050302);
  background-attachment:fixed;
}
/* Genuine Unicode Cuneiform text from the bundled Noto font is the sole
   decorative symbol. These subdued signs are outside the interactive area. */
body::before,body::after {
  position:fixed;
  z-index:0;
  pointer-events:none;
  color:#77f6ff;
  font:400 clamp(150px,21vw,320px)/1 'Hepta Cuneiform';
  opacity:.055;
  text-shadow:0 0 65px rgba(34,222,255,.35);
}
body::before { content:"𒐀"; top:4vh;right:max(-30px,-3vw);transform:rotate(-10deg); }
body::after { content:"𒐖"; bottom:-7vh;left:max(-28px,-3vw);transform:rotate(14deg); }
body > .shell,body > .card,body > .wrap,body > main.wrap,
body > main.card,body > div.wrap { position:relative;z-index:1; }
.shell { width:min(95vw,960px);margin:32px auto; }
.wrap { max-width:1280px; }
.card,.panel,.table,.doc,.nda,.invite,.secret,.codes {
  border-color:rgba(105,215,246,.33);
}
.card,.panel {
  color:var(--hs-ice);
  background:linear-gradient(145deg,rgba(11,43,67,.94),rgba(4,22,40,.96));
  box-shadow:inset 0 1px rgba(174,244,255,.10),0 18px 58px rgba(0,5,18,.42);
  backdrop-filter:blur(8px);
}
.card:has(.geometry-grid) { width:min(95vw,960px); }
.brand,.brand strong { color:#effcff; }
.brand { text-shadow:0 0 22px rgba(64,195,238,.28); }
.brand span,.tag,.micro,.meta,.docmeta { color:#a4ccdc; }
.top,.brand { border-bottom-color:rgba(110,218,243,.37); }
h1,h2,h3 { color:#effcff; }
h1 { text-wrap:balance;text-shadow:0 0 28px rgba(77,193,236,.16); }
p,.notice,.empty,.tiny,.legal,.privacy,.note { color:var(--hs-soft); }
.eyebrow { color:#84ebff; }
.section-title { border-color:var(--line); }
label { color:#c6eafa; }
input:not([type=checkbox]):not([type=hidden]),select,textarea {
  background:#04182c;
  color:#f0fcff;
  border-color:rgba(132,223,246,.46);
  caret-color:#96edff;
}
input::placeholder,textarea::placeholder { color:#a2c0ce;opacity:1; }
input:focus-visible,select:focus-visible,textarea:focus-visible,
button:focus-visible,a:focus-visible {
  outline:3px solid #d9f9ff;
  outline-offset:3px;
}
input[type=checkbox] { accent-color:#3ed5f9; }
button:not(:disabled),.button,.primary,.submit,.scan,.download {
  transition:box-shadow 180ms ease,background-color 180ms ease,transform 180ms ease;
}
.primary,.submit,.box button,button:not([class]),.button {
  color:#032139;
  border-color:#91edff;
  background:linear-gradient(180deg,#ecfdff,#92e9fc);
  box-shadow:0 4px 19px rgba(52,173,215,.20);
}
button:not(:disabled):hover,.button:hover,.primary:hover,.submit:hover,.download:hover {
  box-shadow:0 0 18px rgba(70,210,242,.44);
}
button:disabled,.submit:disabled { cursor:not-allowed; }
a { color:#a6f0ff; }
a:hover { color:#e9fcff; }
.back,.logout,.smallbtn,.linkbtn,.download,.scan {
  color:#c2f3ff;
  border-color:rgba(112,221,250,.50);
  background:rgba(6,49,78,.52);
}
.smallbtn.danger { color:#ffd1d6;border-color:rgba(255,134,155,.55); }
.notice,.invite,.ok {
  color:#d9f5ff;
  border-color:rgba(112,221,250,.38);
  background:rgba(33,151,189,.10);
}
.error {
  color:#ffe5e9;
  border-color:rgba(255,145,162,.65);
  background:rgba(134,37,58,.25);
}
.table { border-color:var(--line); }
.row,.doc,.panel-head { border-bottom-color:rgba(119,216,242,.22); }
.row:nth-child(even) { background:rgba(67,192,230,.035); }
.doc:hover { background:rgba(66,183,222,.06); }
.name { color:#e7faff; }
.secret,.codes,.nda,.invite { background:#041525;color:#ddf5fc; }
.codes { column-rule:1px solid rgba(114,219,248,.25); }
.sig { background:#031526;border-color:rgba(124,223,246,.5); }
.ack,.ack label { color:#c3dfe8; }
.legal,.privacy { border-top-color:rgba(117,210,234,.24); }
.hs-babylonian { z-index:2; }
@media (max-width:880px) {
  .shell { width:min(96vw,960px); }
  .wrap { width:min(calc(100% - 28px),1280px); }
  .card,.panel { padding:clamp(19px,4vw,34px); }
  .top { gap:18px;flex-wrap:wrap; }
  .nav { flex-wrap:wrap; }
  .doc { gap:15px; }
}
@media (max-width:540px) {
  .shell { width:calc(100% - 18px);margin:9px auto 20px; }
  .card,.panel { padding:18px; }
  .top { height:auto;min-height:0;padding:16px 0; }
  .brand { letter-spacing:.11em; }
  .nav { width:100%; }
  .nav > * { flex:1 1 auto;text-align:center; }
  h1 { font-size:clamp(34px,11vw,58px);line-height:1; }
  .codes { columns:1; }
  }
@media (prefers-reduced-motion:reduce) {
  button,.button,.primary,.submit,.scan,.download { transition:none; }
}

.hs-sign-mark { font:400 1.6em/1 "Hepta Cuneiform";vertical-align:-.11em;color:#89ecff;filter:drop-shadow(0 0 10px #2acdf5);margin-right:.25em; }
.shell .card p[style*="color:#7f7465"] { color:var(--hs-soft)!important; }
.geometry-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:10px;margin:20px 0; }
.geometry-grid select { display:block;width:100%;padding:12px;margin-top:5px;font:16px "Hepta Cuneiform",system-ui,sans-serif; }
.hs-babylonian--issued .hs-babylonian__slot[data-selected="true"] { border-color:#81e7ff;background:linear-gradient(155deg,#12618c,#08304b);color:#fff; }

.hs-section-glyph { font:400 1.8em/1 "Hepta Cuneiform";vertical-align:-.2em;margin-right:.3em;color:#83eaff;filter:drop-shadow(0 0 8px #6be4fb); }

.owner-note { padding:10px 13px;border-left:3px solid #70dfff;background:#072b43;color:#d5f3ff;font-size:13px; }