/* ── Pitch decks: shared stage styling (editor, thumbnails, presentation) ── */
.stage { position: relative; width: 1280px; height: 720px; overflow: hidden; background: #050816; color: #fff; font-family: "Inter", system-ui, sans-serif; transform-origin: top left; }
.stage.theme-europa { background: #050816 url("/assets/img/europa-sunrise.jpg") center / cover no-repeat; }
.stage.theme-europa::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(2,4,10,.35), rgba(2,4,10,.75)); pointer-events: none; }
.stage.theme-aurora { background: radial-gradient(120% 80% at 10% 10%, #22d3ee55, transparent 55%), radial-gradient(90% 70% at 90% 20%, #a78bfa66, transparent 60%), radial-gradient(80% 60% at 60% 100%, #fb718555, transparent 60%), #06091a; }
.stage.theme-ink { background: linear-gradient(160deg, #0b0f1f, #02040a); }
.stage .el { position: absolute; box-sizing: border-box; }
.stage .el-heading, .stage .el-text { font-family: "Space Grotesk", "Inter", system-ui, sans-serif; word-wrap: break-word; overflow: hidden; }
.stage .el-text { font-family: "Inter", system-ui, sans-serif; }
.stage .el-heading .el-inner, .stage .el-text .el-inner { width: 100%; height: 100%; display: block; }
.stage .raw-html { position: absolute; inset: 0; }
.stage .glow { text-shadow: 0 0 40px rgba(34,211,238,.45); }

/* ── presentation ── */
body.present { margin: 0; background: #02040a; color: #fff; overflow: hidden; font-family: "Inter", system-ui, sans-serif; }
.present .bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; }
.present .bg-image { position: absolute; inset: -2%; background: #02040a url("/assets/img/europa-sunrise.jpg") center / cover no-repeat; animation: drift 90s ease-in-out infinite alternate; }
@keyframes drift { from { transform: scale(1.02) translate3d(0,0,0); } to { transform: scale(1.08) translate3d(-1.5%,1%,0); } }
.present #network { position: absolute; inset: 0; width: 100%; height: 100%; mix-blend-mode: screen; opacity: .85; }
.present .blob { position: absolute; width: 52vmax; height: 52vmax; border-radius: 50%; filter: blur(90px); opacity: .28; mix-blend-mode: screen; animation: float 18s ease-in-out infinite alternate; pointer-events: none; }
.present .b1 { background: #22d3ee; left: -18vmax; top: -10vmax; } .present .b2 { background: #a78bfa; right: -20vmax; bottom: -18vmax; animation-delay: -6s; } .present .b3 { background: #fb7185; left: 30vw; bottom: -30vmax; width: 36vmax; height: 36vmax; animation-delay: -12s; opacity: .18; }
@keyframes float { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(6vw,-4vh,0) scale(1.15); } }
.present .bg-vignette { position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 10%, transparent 40%, rgba(2,4,10,.55) 100%), linear-gradient(to bottom, rgba(2,4,10,.2), rgba(2,4,10,.7) 85%); }
.present .viewport { position: fixed; inset: 0 0 70px 0; z-index: 1; }
/* Absolutely centred: a 1280px frame in a grid cell overflows to the right on phones. */
.present .frame { position: absolute; left: 50%; top: 50%; margin: -360px 0 0 -640px; width: 1280px; height: 720px; transform-origin: center center; border-radius: 24px; overflow: hidden; box-shadow: 0 40px 120px rgba(0,0,0,.6), 0 0 0 1px rgba(160,200,255,.14); }
.present .slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .55s ease, transform .55s cubic-bezier(.2,.8,.2,1); transform: translateX(60px) scale(.98); }
.present .slide.active { opacity: 1; visibility: visible; transform: none; }
.present .slide.leaving { opacity: 0; transform: translateX(-60px) scale(.98); }
.present .stage { transform: none; }
.present .stage.theme-europa { background: transparent; } /* the page background shows through */
.present .stage.theme-europa::before { background: linear-gradient(180deg, rgba(2,4,10,.15), rgba(2,4,10,.55)); }
.present .el { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.present .el[data-anim="none"] { opacity: 1; transform: none; }
.present .el[data-anim="zoom"] { transform: scale(.85); }
.present .el[data-anim="left"] { transform: translateX(-40px); }
.present .el[data-anim="right"] { transform: translateX(40px); }
.present .slide.active .el.in { opacity: 1; transform: none; }
.present .raw-html .el { opacity: 1; transform: none; }
.present .hud { position: fixed; z-index: 2; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; padding: 12px 20px; color: #a9b7d0; font-size: 13px; }
.present .hud .brand { font-family: "Space Grotesk", sans-serif; font-weight: 700; color: #eef4ff; }
.present .hud .brand b { background: linear-gradient(90deg, #22d3ee, #a78bfa); -webkit-background-clip: text; background-clip: text; color: transparent; }
.present .hud button { background: rgba(8,12,26,.6); color: #eef4ff; border: 1px solid rgba(160,200,255,.2); border-radius: 999px; padding: 6px 12px; cursor: pointer; font: inherit; }
.present .progress { position: fixed; top: 0; left: 0; height: 3px; background: linear-gradient(90deg, #22d3ee, #a78bfa, #fb7185); z-index: 3; transition: width .4s ease; box-shadow: 0 0 12px rgba(34,211,238,.7); }
.present .nav { position: fixed; top: 50%; z-index: 2; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 50%; background: rgba(8,12,26,.55); border: 1px solid rgba(160,200,255,.2); color: #fff; display: grid; place-items: center; cursor: pointer; font-size: 22px; user-select: none; }
.present .nav.prev { left: 18px; } .present .nav.next { right: 18px; }
.present .nav:hover { border-color: #22d3ee; }
@media (prefers-reduced-motion: reduce) { .present .bg-image, .present .blob { animation: none; } }
@media (max-width: 640px) { .present .hud { padding: 10px 12px; font-size: 12px; gap: 8px; } .present .hud .brand { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .present #counter { white-space: nowrap; } .present .nav { width: 38px; height: 38px; } .present .nav.prev { left: 8px; } .present .nav.next { right: 8px; } }

/* ── gate page: plain "EKOO INNO / Investors Only" for visitors without a valid link ── */
body.gate { margin: 0; min-height: 100vh; display: grid; place-items: center; font: 16px/1.5 "Inter", system-ui, sans-serif; background: #02040a; color: #eef4ff; text-align: center; }
.gate h1 { font: 700 clamp(40px, 8vw, 72px)/1.05 "Space Grotesk", sans-serif; letter-spacing: .04em; margin: 0 0 12px; }
.gate p { color: #a9b7d0; font-size: clamp(16px, 2.4vw, 20px); letter-spacing: .18em; text-transform: uppercase; margin: 0; }

/* ── editor ── */
.deck-editor { display: grid; grid-template-columns: 200px minmax(0, 1fr) 300px; gap: 14px; align-items: start; }
.deck-editor .panel { background: var(--glass); border: 1px solid var(--glass-border); border-radius: 14px; padding: 12px; backdrop-filter: blur(10px); }
.thumbs { display: flex; flex-direction: column; gap: 8px; max-height: 72vh; overflow-y: auto; }
.thumb { position: relative; border-radius: 8px; overflow: hidden; border: 2px solid transparent; cursor: pointer; background: #050816; aspect-ratio: 16 / 9; }
.thumb.active { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(34,211,238,.25); }
.thumb .stage { transform: scale(0.1375); pointer-events: none; }
.thumb .n { position: absolute; left: 6px; top: 4px; font-size: 11px; background: rgba(2,4,10,.7); padding: 1px 6px; border-radius: 6px; }
.thumb.dragging { opacity: .4; }
.thumb.drop-before { box-shadow: 0 -3px 0 var(--accent); }
.canvas-wrap { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 12px; background: #050816; box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.canvas-wrap .stage { position: absolute; left: 0; top: 0; }
.canvas-wrap .el.editable { cursor: move; outline: 1px dashed transparent; }
.canvas-wrap .el.editable:hover { outline-color: rgba(34,211,238,.6); }
.canvas-wrap .el.editable.selected { outline: 2px solid var(--accent); }
.canvas-wrap .rz { position: absolute; right: -7px; bottom: -7px; width: 14px; height: 14px; background: var(--accent); border: 2px solid #fff; border-radius: 3px; cursor: nwse-resize; z-index: 9999; }
.toolbar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 10px; }
.toolbar .sep { width: 1px; height: 22px; background: var(--glass-border); margin: 0 4px; }
.tb { background: rgba(255,255,255,.06); color: var(--ink); border: 1px solid var(--glass-border); border-radius: 8px; padding: 6px 10px; font: inherit; font-size: 13px; cursor: pointer; }
.tb:hover { border-color: var(--accent); }
.tb.primary { background: var(--accent); color: #02040a; font-weight: 600; border-color: transparent; }
.tb.on { border-color: var(--accent); color: var(--accent); }
/* Fields are boxed to the panel width: every control is 100% wide with border-box sizing and may shrink (min-width: 0). */
.deck-editor .panel { min-width: 0; overflow: hidden; }
.props label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); margin-bottom: 10px; min-width: 0; }
.props input, .props select, .props textarea { display: block; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; background: rgba(2,4,10,.6); color: var(--ink); border: 1px solid var(--glass-border); border-radius: 8px; padding: 7px 9px; font: inherit; font-size: 13px; }
.props textarea { resize: vertical; }
.props input[type=range] { padding: 0; }
.props input[type=checkbox] { display: inline-block; width: auto; margin-right: 6px; vertical-align: middle; }
.props .row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.props .row > label { min-width: 0; }
.props img { max-width: 100%; }
.props .toolbar { margin-bottom: 0; }
.props input[type=color] { padding: 0; height: 32px; width: 100%; }
/* context menu */
.ctx { position: fixed; z-index: 80; min-width: 190px; padding: 6px; border-radius: 12px; background: rgba(8,12,26,.96); border: 1px solid var(--glass-border); box-shadow: 0 18px 50px rgba(0,0,0,.55); backdrop-filter: blur(12px); }
.ctx[hidden] { display: none; }
.ctx-item { display: flex; justify-content: space-between; gap: 18px; width: 100%; text-align: left; background: none; border: 0; color: var(--ink); font: inherit; font-size: 13px; padding: 7px 10px; border-radius: 8px; cursor: pointer; }
.ctx-item:hover:not(:disabled) { background: rgba(34,211,238,.14); }
.ctx-item:disabled { opacity: .4; cursor: default; }
.ctx-item.danger { color: #fda4af; }
.ctx-item .hint { color: var(--muted); font-size: 11px; }
.ctx-sep { height: 1px; background: var(--glass-border); margin: 5px 4px; }
/* in-place text editing */
.canvas-wrap .el.editing { cursor: text; outline: 2px solid var(--accent); box-shadow: 0 0 0 4px rgba(34,211,238,.2); }
.canvas-wrap .el.editing .el-inner { outline: none; cursor: text; user-select: text; -webkit-user-select: text; caret-color: var(--accent); white-space: pre-wrap; }
/* in-place colour picker */
.cpick { position: fixed; z-index: 81; width: 250px; padding: 10px; border-radius: 12px; background: rgba(8,12,26,.97); border: 1px solid var(--glass-border); box-shadow: 0 18px 50px rgba(0,0,0,.55); font-size: 12px; color: var(--muted); }
.cpick[hidden] { display: none; }
.cpick-title { font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.cpick .swatches { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin-bottom: 10px; }
.cpick .sw { aspect-ratio: 1; border-radius: 7px; border: 1px solid rgba(255,255,255,.25); cursor: pointer; padding: 0; }
.cpick .sw:hover { outline: 2px solid var(--accent); }
.cpick .sw.none { background: repeating-conic-gradient(#333 0 25%, #111 0 50%) 0 0 / 10px 10px; color: #fff; font-size: 14px; }
.cpick-row { display: grid; grid-template-columns: auto 34px minmax(0, 1fr); gap: 8px; align-items: center; margin-top: 6px; }
.cpick-row input[type=color] { width: 34px; height: 28px; padding: 0; border: 1px solid var(--glass-border); border-radius: 6px; background: none; }
.cpick-row input[type=range] { grid-column: 2 / 4; width: auto; }
.cpick-row #cp-av { grid-column: 1; }
.cpick-row #cp-txt { min-width: 0; background: rgba(2,4,10,.6); color: var(--ink); border: 1px solid var(--glass-border); border-radius: 6px; padding: 5px 7px; font: inherit; }
.props h3 { margin: 0 0 10px; font-size: 14px; }
.html-mode textarea { width: 100%; min-height: 380px; font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; background: #050816; color: #dbeafe; border: 1px solid var(--glass-border); border-radius: 12px; padding: 12px; }
.status { font-size: 12px; color: var(--muted); }
.status.saving { color: var(--accent); }
.status.error { color: #fda4af; }
.links-modal { position: fixed; inset: 0; z-index: 60; background: rgba(2,4,10,.75); backdrop-filter: blur(6px); display: grid; place-items: center; padding: 20px; }
.links-modal[hidden] { display: none; }
.links-card { width: min(760px, 100%); max-height: 88vh; overflow: auto; padding: 22px; border-radius: 18px; background: rgba(8,12,26,.95); border: 1px solid var(--glass-border); }
.links-card table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 12px; }
.links-card th, .links-card td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--glass-border); vertical-align: top; }
.links-card .url { font-family: ui-monospace, monospace; font-size: 11px; word-break: break-all; color: var(--muted); }
.links-card .revoked { opacity: .5; text-decoration: line-through; }
.links-card .hits-row td { background: rgba(255,255,255,.03); }
.links-card .hits { list-style: none; margin: 0; padding: 0; font-size: 12px; }
.links-card .hits li { padding: 3px 0; }
@media (max-width: 1000px) { .deck-editor { grid-template-columns: 1fr; } .thumbs { flex-direction: row; max-height: none; overflow-x: auto; } .thumb { min-width: 160px; } }