:root { color-scheme: dark; --nodedc-accent-rgb: 195 255 102; --nodedc-card-passive-rgb: 42 43 46; --nodedc-card-active-rgb: 195 255 102; --nodedc-on-accent-rgb: 11 17 23; --nodedc-component-accent-rgb: 247 248 244; --nodedc-component-on-accent-rgb: 11 17 23; --launcher-radius-modal: 1.75rem; --launcher-radius-card: 1.35rem; --launcher-radius-control: 1.25rem; --launcher-radius-circle: 999px; --launcher-modal-button-height: 2.75rem; --nodedc-shell-padding-x: 1.25rem; --nodedc-shell-padding-top: 1rem; --nodedc-shell-padding-bottom: 0.75rem; --nodedc-shell-frame-gutter-x: 18px; --nodedc-shell-height: 4.25rem; --nodedc-shell-row-height: 3rem; --nodedc-shell-logo-width: 7.25rem; --nodedc-shell-logo-height: 1.79rem; --nodedc-shell-pill-height: 3.45rem; --nodedc-shell-pill-padding: 0.32rem; --nodedc-shell-control-height: 2.78rem; --surface-base: rgba(8, 8, 11, 0.78); --surface-strong: rgba(8, 8, 11, 0.9); --surface-soft: rgba(255, 255, 255, 0.08); --border-soft: transparent; --text-primary: #f7f8f4; --text-secondary: rgba(247, 248, 244, 0.72); --text-muted: rgba(247, 248, 244, 0.48); --danger: #ff7474; --warning: #ffd166; --cyan: #76e4f7; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } * { box-sizing: border-box; } html, body, #root { min-height: 100%; } body { margin: 0; color: var(--text-primary); background: #050506; } button, input, select { font: inherit; } button, select, input { outline: none; } button:focus-visible, select:focus-visible, input:focus-visible { background-color: rgba(255, 255, 255, 0.1); box-shadow: none; } button { cursor: pointer; } button:disabled { cursor: not-allowed; } table { width: 100%; border-collapse: collapse; } th, td { padding: 0.85rem 0.9rem; border-bottom: 1px solid rgba(255, 255, 255, 0.08); text-align: left; vertical-align: top; } th { color: var(--text-muted); font-size: 0.74rem; font-weight: 700; text-transform: uppercase; } td small { display: block; margin-top: 0.25rem; color: var(--text-muted); } code { display: inline-flex; max-width: 18rem; overflow: hidden; padding: 0.28rem 0.5rem; border-radius: 0.65rem; background: rgba(255, 255, 255, 0.08); color: var(--text-secondary); text-overflow: ellipsis; white-space: nowrap; } .launcher-app { position: relative; min-height: 100vh; overflow: hidden; padding: 0; background: #050506; } .nodedc-auth-page { --nodedc-auth-bg: #0e0f10; --nodedc-auth-card-bg: rgba(9, 9, 12, 0.84); --nodedc-auth-primary: rgb(195, 255, 102); --nodedc-auth-primary-hover: rgb(218, 255, 139); --nodedc-auth-on-primary: rgb(11, 17, 23); --nodedc-auth-text-primary: #e4e6e7; --nodedc-auth-text-secondary: #cacdce; --nodedc-auth-text-placeholder: #959a9d; background: var(--nodedc-auth-bg); color: var(--nodedc-auth-text-primary); font-synthesis: none; -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; } .nodedc-auth-brand-shell { position: absolute; z-index: 80; top: 0; left: 50%; width: min(100%, calc(100vw - var(--nodedc-shell-frame-gutter-x))); padding: var(--nodedc-shell-padding-top) var(--nodedc-shell-padding-x) var(--nodedc-shell-padding-bottom); transform: translateX(-50%); } .nodedc-auth-page__main { display: grid; min-height: 100vh; place-items: center; padding: 0 1rem; } .nodedc-auth-card { display: grid; width: min(100%, 28rem); gap: 1.05rem; overflow: hidden; padding: 2.2rem; border: 0; border-radius: 1.9rem; background: linear-gradient(180deg, rgba(255, 255, 255, 0.048) 0%, rgba(255, 255, 255, 0.015) 100%), var(--nodedc-auth-card-bg); box-shadow: none; backdrop-filter: blur(40px); -webkit-backdrop-filter: blur(40px); } .nodedc-auth-card__copy { display: grid; gap: 0.75rem; } .nodedc-auth-card__copy h1, .nodedc-auth-card__copy p { max-width: 22rem; margin: 0; letter-spacing: -0.045em; text-transform: none; text-wrap: balance; } .nodedc-auth-card__copy h1 { color: var(--nodedc-auth-text-primary); font-size: 2rem; font-weight: 650; line-height: 2.5rem; } .nodedc-auth-card__copy p { color: var(--nodedc-auth-text-placeholder); font-size: 1.9rem; font-weight: 650; line-height: 2.5rem; } .nodedc-invite-card__details { display: grid; gap: 0.45rem; margin-top: 0.45rem; color: var(--nodedc-auth-text-secondary); font-size: 0.875rem; line-height: 1.4; } .nodedc-auth-card__status { margin: 0; color: var(--nodedc-auth-primary); font-size: 0.75rem; font-weight: 600; line-height: 1rem; } .nodedc-auth-card__form { display: grid; gap: 1.05rem; } .nodedc-auth-card__field { display: grid; gap: 0.42rem; color: var(--nodedc-auth-text-placeholder); font-size: 0.75rem; line-height: 1rem; } .nodedc-auth-card__field input { width: 100%; min-height: 3rem; padding: 0 1rem; border: 0; border-radius: 1.15rem; outline: none; background: linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.012) 100%), rgba(255, 255, 255, 0.03); color: var(--nodedc-auth-text-primary); font-size: 0.875rem; font-weight: 400; caret-color: var(--nodedc-auth-primary); } .nodedc-auth-card__field input::placeholder { color: var(--nodedc-auth-text-placeholder); opacity: 1; } .nodedc-auth-card__field input:focus { background: linear-gradient(180deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.012) 100%), rgba(255, 255, 255, 0.03); box-shadow: none; } .nodedc-auth-card .button { width: 100%; min-height: 3.25rem; margin-top: 0.45rem; border-radius: 1.25rem; background: var(--nodedc-auth-primary); color: var(--nodedc-auth-on-primary); font-size: 0.95rem; font-weight: 600; letter-spacing: -0.02em; } .nodedc-auth-card .button:hover:not(:disabled), .nodedc-auth-card .button:focus-visible:not(:disabled) { background: var(--nodedc-auth-primary-hover); color: var(--nodedc-auth-on-primary); } .nodedc-auth-card .button.button--secondary { min-height: 2.25rem; margin-top: -0.25rem; background: transparent; color: var(--nodedc-auth-primary); } .nodedc-auth-card .button.button--secondary:hover:not(:disabled), .nodedc-auth-card .button.button--secondary:focus-visible:not(:disabled) { background: transparent; color: var(--nodedc-auth-primary-hover); } .nodedc-auth-card .button:disabled { opacity: 0.58; } .eyebrow { color: var(--text-muted); font-size: 0.72rem; font-weight: 700; letter-spacing: 0; text-transform: uppercase; } .select-shell { display: inline-flex; align-items: center; gap: 0.5rem; height: 2.85rem; min-width: 11rem; padding: 0 0.95rem; border: 0; border-radius: var(--launcher-radius-circle); background: transparent; color: var(--text-secondary); transition: background-color 160ms ease, color 160ms ease; } .select-shell:hover { background: rgba(255, 255, 255, 0.045); color: var(--text-primary); } .select-shell--wide { width: 100%; } .select-shell select, .invite-form select { width: 100%; min-width: 0; border: 0; background: transparent; color: var(--text-primary); } .select-shell option, .invite-form option { color: #101318; } .nodedc-expanded-toolbar-shell { position: relative; z-index: 80; width: min(100%, calc(100vw - var(--nodedc-shell-frame-gutter-x))); margin-inline: auto; flex-shrink: 0; padding: var(--nodedc-shell-padding-top) var(--nodedc-shell-padding-x) var(--nodedc-shell-padding-bottom); } .nodedc-expanded-toolbar { display: flex; min-height: var(--nodedc-shell-height); width: 100%; flex-direction: column; gap: 0; } .nodedc-expanded-toolbar-top { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); min-height: var(--nodedc-shell-row-height); width: 100%; align-items: center; gap: 1rem; } .nodedc-expanded-toolbar-left, .nodedc-expanded-toolbar-center, .nodedc-expanded-toolbar-right { display: flex; align-items: center; gap: 0.75rem; min-width: 0; } .nodedc-expanded-toolbar-left { justify-content: flex-start; } .nodedc-expanded-brand-link { display: inline-flex; width: var(--nodedc-shell-logo-width); height: var(--nodedc-shell-logo-height); flex: 0 0 auto; align-items: center; justify-content: flex-start; line-height: 0; } .nodedc-expanded-toolbar-center { justify-content: center; } .nodedc-expanded-toolbar-right { justify-content: flex-end; } .nodedc-expanded-brand-logo { display: block; width: 100%; height: 100%; max-height: none; object-fit: contain; } .nodedc-expanded-workspace-button { position: relative; display: flex; width: 3rem; height: 3rem; align-items: center; justify-content: center; overflow: hidden; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.04); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); transition: background-color 160ms ease; } .nodedc-expanded-workspace-button:hover { background: rgba(255, 255, 255, 0.07); } .nodedc-expanded-workspace-button select, .nodedc-expanded-select-button select { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; opacity: 0; cursor: pointer; } .nodedc-expanded-workspace-button option, .nodedc-expanded-select-button option { color: #101318; } .nodedc-expanded-workspace-mark { width: 1.75rem; height: 1.75rem; object-fit: contain; } .nodedc-expanded-user-group { display: inline-flex; height: var(--nodedc-shell-pill-height); min-height: var(--nodedc-shell-pill-height); align-items: center; gap: 0.22rem; border-radius: 999px; background: rgba(64, 64, 64, 0.48); padding: var(--nodedc-shell-pill-padding); cursor: pointer; user-select: none; } .nodedc-expanded-user-group .nodedc-expanded-nav-button { min-height: var(--nodedc-shell-control-height); padding-inline: 1.2rem; } .nodedc-expanded-user-group .nodedc-expanded-nav-button:not([data-active="true"]) { color: rgba(255, 255, 255, 0.68); } .nodedc-expanded-nav-group { display: inline-flex; min-height: var(--nodedc-shell-pill-height); align-items: center; gap: 0.18rem; border: 0; border-radius: 999px; background: rgba(64, 64, 64, 0.48); padding: var(--nodedc-shell-pill-padding); box-shadow: none; } .nodedc-expanded-nav-button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0; min-height: var(--nodedc-shell-control-height); border: 0; outline: none; box-shadow: none; border-radius: 999px; background: transparent; color: rgba(255, 255, 255, 0.68); padding: 0.2rem 1.22rem; font-size: 0.74rem; font-weight: 700; line-height: 1; letter-spacing: 0; white-space: nowrap; transition: background-color 160ms ease, color 160ms ease, opacity 160ms ease; } .nodedc-expanded-nav-button:hover { background: rgba(255, 255, 255, 0.07); color: rgba(255, 255, 255, 0.96); } .nodedc-expanded-nav-button[data-active="true"] { background: rgba(255, 255, 255, 0.92); color: rgba(8, 8, 10, 0.96); } .nodedc-toolbar-icon-button { display: inline-grid; place-items: center; border: 0; outline: none; box-shadow: none; border-radius: 999px; background: transparent; color: rgba(255, 255, 255, 0.72); transition: color 160ms ease, background-color 160ms ease, transform 160ms ease; } .nodedc-toolbar-icon-button:hover { background: rgba(255, 255, 255, 0.05); color: rgba(255, 255, 255, 0.94); } .nodedc-toolbar-icon-button[data-active="true"] { background: transparent; color: rgba(255, 255, 255, 0.98); } .nodedc-toolbar-icon-active-dot { display: grid; height: 2rem; width: 2rem; place-items: center; border-radius: 999px; transition: background-color 160ms ease, color 160ms ease; } .nodedc-toolbar-icon-button[data-active="true"] .nodedc-toolbar-icon-active-dot { background: rgb(var(--nodedc-accent-rgb)); color: rgb(var(--nodedc-on-accent-rgb)); } .nodedc-expanded-notification-button { height: var(--nodedc-shell-control-height); width: var(--nodedc-shell-control-height); background: transparent; color: rgba(255, 255, 255, 0.68); } .nodedc-expanded-notification-button .nodedc-toolbar-icon-active-dot { height: 2rem; width: 2rem; color: rgba(255, 255, 255, 0.68); } .nodedc-expanded-notification-button:hover, .nodedc-expanded-notification-button:hover .nodedc-toolbar-icon-active-dot { color: rgba(255, 255, 255, 0.94); } .nodedc-expanded-user-avatar-button { display: flex; width: 3rem; height: 3rem; align-items: center; justify-content: center; overflow: hidden; border: 0; border-radius: 999px; background: transparent; padding: 0; transition: background-color 160ms ease; } .nodedc-expanded-user-avatar-button:hover { background: transparent; } .nodedc-expanded-user-avatar { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: 999px; background: radial-gradient(circle at 70% 20%, rgba(255, 255, 255, 0.72), transparent 24%), linear-gradient(135deg, rgb(166, 194, 109), rgb(142, 123, 139)); color: rgba(8, 8, 10, 0.96); font-size: 0.78rem; font-weight: 800; line-height: 1; } .launcher-main { --launcher-page-pad: 1.25rem; --launcher-rail-bottom: 1.2rem; --launcher-rail-height: 9.2rem; --launcher-stage-rail-gap: 1.2rem; --admin-panel-gap: var(--launcher-page-pad); --admin-nav-width: clamp(20.75rem, 19.5vw, 22rem); --admin-content-width: calc( 100vw - (var(--launcher-page-pad) * 2) - (var(--admin-panel-gap) * 2) - (var(--admin-nav-width) * 2) ); --admin-nav-pad: 1.1rem; --admin-control-ring: 2.92rem; --admin-control-inset: 5px; position: relative; display: grid; min-height: calc(100vh - 6rem); margin-top: 0; overflow: hidden; border: 0; border-radius: 0; background: #050506; } .launcher-main:has(.admin-panel-layer) .service-stage { padding-left: calc(var(--launcher-page-pad) + var(--admin-nav-width) + var(--admin-panel-gap)); } .launcher-main:has(.admin-panel-layer--content-open) .service-stage { padding-left: calc(var(--launcher-page-pad) + var(--admin-nav-width) + var(--admin-content-width) + (var(--admin-panel-gap) * 2)); } .launcher-main:has(.profile-settings-layer) .service-stage { padding-right: calc(var(--launcher-page-pad) + var(--admin-nav-width) + var(--admin-panel-gap)); } .launcher-main:has(.admin-panel-layer--content-open) .stage-service-overlay, .launcher-main:has(.admin-panel-layer--content-open) .stage-video-controls, .launcher-main:has(.admin-panel-layer--content-open) .stage-timeline-strip { display: none; } .service-stage { position: absolute; inset: 0; display: grid; align-items: stretch; justify-items: stretch; padding: 0 var(--launcher-page-pad) calc(var(--launcher-rail-height) + var(--launcher-rail-bottom) + var(--launcher-stage-rail-gap)) var(--launcher-page-pad); overflow: hidden; background: #050506; transition: padding-left 440ms cubic-bezier(0.22, 1, 0.36, 1), padding-right 440ms cubic-bezier(0.22, 1, 0.36, 1), background 220ms ease; } .service-stage--empty { background: #050506; } .stage-video-shell, .empty-stage-card { border: 0; overflow: hidden; border-radius: var(--launcher-radius-card); } .stage-video-shell { position: relative; z-index: 2; width: 100%; height: 100%; min-height: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)), rgba(20, 20, 25, 0.64); box-shadow: 0 44px 150px rgba(0, 0, 0, 0.6); isolation: isolate; } .stage-video-stream { position: absolute; inset: 0; overflow: hidden; background: #050506; } .stage-video-gif { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.92; } .stage-video-stream::before { position: absolute; inset: -20%; background: linear-gradient(90deg, transparent 0 12%, rgba(255, 255, 255, 0.07) 12% 13%, transparent 13% 27%), linear-gradient(180deg, transparent 0 18%, rgba(255, 255, 255, 0.05) 18% 19%, transparent 19% 32%); background-size: 7rem 7rem; content: ""; opacity: 0.34; transform: rotate(-2deg); animation: stageVideoDrift 16s linear infinite; mix-blend-mode: screen; } .stage-video-stream::after { position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%, transparent 0 52%, rgba(0, 0, 0, 0.28) 100%), linear-gradient(90deg, rgba(0, 0, 0, 0.28), transparent 18% 78%, rgba(0, 0, 0, 0.22)); content: ""; } .stage-video-controls button { display: grid; place-items: center; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.16); color: rgba(255, 255, 255, 0.88); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); } .stage-empty-title { position: absolute; z-index: 4; top: 5.76rem; left: 5.76rem; display: grid; gap: 0.22rem; color: rgba(255, 255, 255, 0.94); text-transform: uppercase; pointer-events: none; } .stage-empty-title span { color: rgba(64, 64, 64, 0.92); font-size: clamp(1.82rem, 2.3vw, 2.52rem); font-weight: 350; line-height: 1; } .stage-empty-title strong { color: rgba(255, 255, 255, 0.94); font-size: clamp(1.82rem, 2.3vw, 2.52rem); font-weight: 350; line-height: 1; } .stage-service-overlay { position: absolute; z-index: 4; top: 50%; left: 50%; display: grid; width: min(73rem, calc(100% - 12rem)); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: center; justify-content: center; transform: translate(-50%, -50%); } .stage-image-card, .stage-description-card { position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; border: 0; border-radius: 1.55rem; } .stage-image-card { padding: 0; background: linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.12)), linear-gradient(130deg, color-mix(in srgb, var(--service-accent) 38%, rgba(216, 170, 255, 0.58)), rgba(255, 236, 184, 0.6)); box-shadow: 0 26px 80px rgba(0, 0, 0, 0.22); } .stage-card-label { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 0.45rem; color: rgba(255, 255, 255, 0.78); font-size: 0.78rem; font-weight: 700; } .stage-image-card__visual { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; } .stage-image-card__image { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; } .stage-image-card__figure { position: absolute; left: 28%; top: 4%; width: 13rem; height: 19rem; border-radius: 48% 52% 44% 56%; background: radial-gradient(circle at 45% 18%, rgba(255, 245, 210, 0.82), transparent 22%), linear-gradient(160deg, rgba(163, 93, 255, 0.46), rgba(255, 190, 24, 0.78), rgba(255, 255, 255, 0.34)); filter: blur(10px); transform: rotate(-7deg); animation: stageFigureFloat 5.5s ease-in-out infinite alternate; } .stage-image-card__glow { position: absolute; inset: 14% 7% 10% 12%; border-radius: 999px; background: rgba(255, 255, 255, 0.25); filter: blur(24px); } .stage-image-card__time { position: absolute; z-index: 2; bottom: 1rem; left: 1rem; display: inline-flex; min-height: 1.85rem; align-items: center; border-radius: 999px; background: rgba(255, 255, 255, 0.18); color: rgba(255, 255, 255, 0.86); padding: 0 0.65rem; font-size: 0.72rem; } .stage-description-card { display: flex; flex-direction: column; gap: 1rem; padding: 1rem; background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.035)), rgba(38, 38, 42, 0.34); box-shadow: 0 26px 80px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.07); backdrop-filter: blur(30px) saturate(1.25); -webkit-backdrop-filter: blur(30px) saturate(1.25); } .stage-description-card__copy { display: grid; gap: 0.68rem; } .stage-description-card__copy h1 { margin: 0; font-size: clamp(1.65rem, 2vw, 2.25rem); line-height: 0.98; } .stage-rich-description { display: grid; gap: 0.75rem; color: rgba(255, 255, 255, 0.72); font-size: 0.86rem; line-height: 1.48; } .stage-rich-description p, .stage-rich-description ul { margin: 0; } .stage-rich-description ul { display: grid; gap: 0.36rem; padding-left: 1.1rem; } .stage-rich-description strong { color: rgba(255, 255, 255, 0.9); font-weight: 850; } .stage-rich-description em { color: rgba(255, 255, 255, 0.78); } .stage-rich-description code { display: inline-flex; max-width: 100%; padding: 0.08rem 0.32rem; border-radius: 0.45rem; background: rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.86); font-size: 0.78rem; } .stage-description-card__chips, .stage-description-card__footer { display: flex; flex-wrap: wrap; gap: 0.5rem; } .stage-description-card__chips .status-badge, .stage-description-card__footer .button { min-height: 2.78rem; border-radius: var(--launcher-radius-circle); padding: 0 1.22rem; font-size: 0.74rem; font-weight: 800; } .stage-description-card__description { display: grid; min-height: 3.85rem; max-height: 13rem; overflow-y: auto; padding: 0.78rem; border-radius: 1rem; background: rgba(255, 255, 255, 0.1); scrollbar-width: none; } .stage-description-card__description::-webkit-scrollbar { display: none; } .stage-description-card__footer { align-items: center; justify-content: space-between; margin-top: auto; } .stage-description-card__chips { align-items: center; } .stage-video-controls { position: absolute; z-index: 3; bottom: 1.15rem; left: 50%; display: inline-flex; align-items: center; gap: 0.32rem; transform: translateX(-50%); } .stage-video-controls button { width: 2.15rem; height: 2.15rem; background: rgba(255, 255, 255, 0.18); } .stage-timeline-strip { display: none; position: absolute; right: 9%; bottom: 0; left: 20%; z-index: 2; display: grid; grid-template-columns: 1fr 0.72fr 0.58fr 0.82fr 0.64fr; gap: 0.28rem; height: 4.2rem; opacity: 0.46; transform: translateY(45%); } .stage-timeline-strip span { border-radius: 0.65rem 0.65rem 0 0; background: rgba(255, 255, 255, 0.12); } .stage-timeline-strip span:nth-child(3) { background: color-mix(in srgb, var(--service-accent) 45%, rgba(255, 255, 255, 0.16)); } @keyframes stageVideoDrift { from { transform: translate3d(0, 0, 0) rotate(-2deg); } to { transform: translate3d(-7rem, -7rem, 0) rotate(-2deg); } } @keyframes stageFigureFloat { from { transform: translate3d(-0.8rem, 0, 0) rotate(-9deg) scale(1); } to { transform: translate3d(0.8rem, -0.3rem, 0) rotate(-3deg) scale(1.05); } } .glass-surface, .glass-card { border: 0; background: var(--surface-base); box-shadow: 0 24px 80px rgba(0, 0, 0, 0.35); backdrop-filter: blur(28px); -webkit-backdrop-filter: blur(28px); } .glass-surface { border-radius: var(--launcher-radius-card); } .glass-card { border-radius: 1rem; } .glass-surface--strong { background: var(--surface-strong); } .glass-surface--soft { background: var(--surface-soft); } .service-rail { --service-rail-card-size: var(--launcher-rail-height); --service-rail-gap: var(--service-rail-card-size); --service-tile-joint-gap: 5px; position: absolute; z-index: 5; right: var(--launcher-page-pad); bottom: var(--launcher-rail-bottom); left: var(--launcher-page-pad); height: var(--launcher-rail-height); overflow: hidden; border: 0; border-radius: var(--launcher-radius-card); background: rgba(8, 8, 11, 0.72); box-shadow: 0 24px 80px rgba(0, 0, 0, 0.36); } .service-rail__backdrop-media { position: absolute; inset: -10%; width: 120%; height: 120%; object-fit: cover; object-position: center; opacity: 0.58; filter: saturate(1.08) contrast(0.96); } .service-rail__glass { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.035)), rgba(13, 13, 16, 0.46); backdrop-filter: blur(28px) saturate(1.12); -webkit-backdrop-filter: blur(28px) saturate(1.12); } .service-rail__scroll { position: relative; z-index: 1; height: 100%; overflow-x: auto; overflow-y: hidden; padding: 0 3rem; scrollbar-width: none; } .service-rail__scroll::-webkit-scrollbar { display: none; } .service-rail__track { display: flex; width: max-content; min-width: 100%; height: 100%; align-items: stretch; justify-content: space-evenly; gap: var(--service-rail-gap); } .service-tile { position: relative; display: flex; gap: var(--service-tile-joint-gap); width: calc((var(--service-rail-card-size) * 2) + var(--service-tile-joint-gap)); min-width: calc((var(--service-rail-card-size) * 2) + var(--service-tile-joint-gap)); height: 100%; align-items: stretch; padding: 0; border: 0; border-radius: 1rem; background: transparent; color: var(--text-primary); text-align: left; } .service-tile:hover { color: var(--text-primary); } .service-tile:hover .service-tile__content { background: rgba(255, 255, 255, 0.17); } .service-tile--active .service-tile__content { background: linear-gradient(90deg, rgba(var(--nodedc-accent-rgb), 0.28), rgba(255, 255, 255, 0.14)), rgba(255, 255, 255, 0.1); } .service-tile--active .service-tile__media { box-shadow: inset 0 0 0 2px rgba(var(--nodedc-accent-rgb), 0.8); } .service-tile--active .service-tile__arrow { background: rgba(247, 248, 244, 0.94); color: rgba(8, 8, 10, 0.96); } .service-tile__media { position: relative; display: block; width: var(--service-rail-card-size); height: var(--service-rail-card-size); flex: 0 0 var(--service-rail-card-size); overflow: hidden; border-radius: 1rem; background: color-mix(in srgb, var(--tile-accent) 36%, rgba(255, 255, 255, 0.12)); } .service-tile__media-asset { width: 100%; height: 100%; object-fit: cover; object-position: center; } .service-tile__content { display: grid; width: var(--service-rail-card-size); height: 100%; min-width: 0; align-content: center; gap: 0.35rem; overflow: hidden; padding: 0.72rem 0.82rem; border-radius: 1rem; background: rgba(255, 255, 255, 0.115); backdrop-filter: blur(24px) saturate(1.1); -webkit-backdrop-filter: blur(24px) saturate(1.1); } .service-tile__content strong, .service-tile__content small { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .service-tile__content strong { font-size: 0.9rem; line-height: 1.15; -webkit-line-clamp: 2; } .service-tile__content small { color: rgba(255, 255, 255, 0.68); font-size: 0.68rem; line-height: 1.2; -webkit-line-clamp: 2; } .service-tile__content .status-badge { min-height: 1.35rem; padding: 0 0.48rem; font-size: 0.66rem; } .service-tile__arrow { position: absolute; z-index: 2; top: 50%; right: -1.1rem; display: grid; width: 2.3rem; height: 2.3rem; place-items: center; border-radius: var(--launcher-radius-circle); background: rgba(64, 64, 64, 0.62); color: rgba(255, 255, 255, 0.88); transform: translateY(-50%); } .service-tile:hover .service-tile__arrow { filter: brightness(1.08); } .service-tile:focus-visible { outline: none; } .service-tile:focus-visible .service-tile__arrow { box-shadow: 0 0 0 3px rgba(var(--nodedc-accent-rgb), 0.42); } .button { --nodedc-button-accent-rgb: var(--nodedc-component-accent-rgb); --nodedc-button-on-accent-rgb: var(--nodedc-component-on-accent-rgb); display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem; min-height: 2.65rem; padding: 0 1rem; border: 0; border-radius: var(--launcher-radius-control); font-weight: 800; white-space: nowrap; box-shadow: none; } .button--primary { background: rgb(var(--nodedc-accent-rgb)); color: rgb(var(--nodedc-on-accent-rgb)); } .button--primary:hover:not(:disabled) { filter: brightness(1.08); } .button--secondary, .button--ghost { background: rgba(255, 255, 255, 0.09); color: var(--text-primary); } .button--secondary:hover:not(:disabled), .button--ghost:hover:not(:disabled) { background: rgba(255, 255, 255, 0.14); } .button--danger { background: transparent; color: var(--text-primary); } .button--danger:hover:not(:disabled) { background: rgba(255, 255, 255, 0.14); color: var(--text-primary); } .button--accent { background: rgb(var(--nodedc-button-accent-rgb)); color: rgb(var(--nodedc-button-on-accent-rgb)); } .button--accent:hover:not(:disabled) { background: color-mix(in srgb, rgb(var(--nodedc-button-accent-rgb)) 84%, rgba(255, 255, 255, 0.72)); color: rgb(var(--nodedc-button-on-accent-rgb)); } .button--accent * { color: rgb(var(--nodedc-button-on-accent-rgb)); } .button[data-surface="modal"] { min-height: var(--launcher-modal-button-height); } .button[data-surface="modal"].button--secondary, .button[data-surface="modal"].button--danger, .button[data-surface="modal"].button--ghost { background: transparent; color: var(--text-primary); } .button[data-surface="modal"].button--secondary:hover:not(:disabled), .button[data-surface="modal"].button--danger:hover:not(:disabled), .button[data-surface="modal"].button--ghost:hover:not(:disabled) { background: rgba(255, 255, 255, 0.1); color: var(--text-primary); } .button:disabled { opacity: 0.55; } .icon-button { display: grid; width: 2.45rem; height: 2.45rem; place-items: center; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.09); color: var(--text-primary); } .icon-button:hover { background: rgba(255, 255, 255, 0.15); } .status-badge { display: inline-flex; align-items: center; width: max-content; min-height: 1.6rem; padding: 0 0.58rem; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.09); color: var(--text-secondary); font-size: 0.72rem; font-weight: 800; white-space: nowrap; } .status-badge--green { background: rgba(181, 255, 90, 0.16); color: #d9ffac; } .status-badge--yellow { background: rgba(255, 209, 102, 0.16); color: #ffe2a1; } .status-badge--red { background: rgba(255, 116, 116, 0.16); color: #ffd0d0; } .status-badge--violet { background: rgba(215, 200, 255, 0.16); color: #e7dcff; } .muted-text { color: var(--text-muted); font-size: 0.8rem; } .admin-panel-layer { position: absolute; z-index: 8; top: 0; bottom: calc(var(--launcher-rail-height) + var(--launcher-rail-bottom) + var(--launcher-stage-rail-gap)); left: var(--launcher-page-pad); display: flex; gap: var(--admin-panel-gap); pointer-events: none; } .admin-panel-nav, .admin-panel-content { pointer-events: auto; border: 0; border-radius: var(--launcher-radius-card); background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012)), rgba(10, 10, 13, 0.88); box-shadow: 0 34px 110px rgba(0, 0, 0, 0.52); backdrop-filter: blur(28px); -webkit-backdrop-filter: blur(28px); } .admin-panel-nav { position: relative; display: grid; grid-template-rows: auto auto 1fr auto; gap: 1.05rem; width: var(--admin-nav-width); min-width: var(--admin-nav-width); padding: var(--admin-nav-pad); animation: adminPanelSlide 420ms cubic-bezier(0.22, 1, 0.36, 1) both; } .admin-panel-content { display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 1rem; width: var(--admin-content-width); min-width: 0; overflow: hidden; padding: 1rem; font-size: 0.875rem; animation: adminPanelSlide 460ms cubic-bezier(0.22, 1, 0.36, 1) both; } .profile-settings-layer { position: absolute; z-index: 9; top: 0; right: var(--launcher-page-pad); bottom: calc(var(--launcher-rail-height) + var(--launcher-rail-bottom) + var(--launcher-stage-rail-gap)); width: var(--admin-nav-width); pointer-events: none; } .profile-settings-panel { display: grid; height: 100%; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 1rem; pointer-events: auto; border: 0; border-radius: var(--launcher-radius-card); background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.014)), rgba(10, 10, 13, 0.9); box-shadow: 0 34px 110px rgba(0, 0, 0, 0.52); backdrop-filter: blur(28px); -webkit-backdrop-filter: blur(28px); padding: var(--admin-nav-pad); animation: profilePanelSlide 420ms cubic-bezier(0.22, 1, 0.36, 1) both; } .profile-settings-panel__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; } .profile-settings-panel__head h2 { margin: 0.15rem 0 0; font-size: 1.35rem; } .profile-settings-panel__body { display: grid; align-content: start; gap: 0.85rem; min-height: 0; overflow: auto; padding-right: 0.15rem; } .profile-settings-avatar-card { display: grid; justify-items: center; gap: 0.85rem; border-radius: 1.25rem; background: radial-gradient(circle at 50% 0%, rgba(181, 255, 90, 0.16), transparent 42%), rgba(255, 255, 255, 0.045); padding: 1.25rem 1rem; } .profile-settings-avatar-card__image { display: grid; width: 5.25rem; height: 5.25rem; place-items: center; overflow: hidden; border-radius: var(--launcher-radius-circle); background: radial-gradient(circle at 72% 20%, rgba(255, 255, 255, 0.72), transparent 23%), linear-gradient(135deg, rgb(166, 194, 109), rgb(142, 123, 139)); color: rgba(8, 8, 10, 0.96); object-fit: cover; font-size: 1rem; font-weight: 850; } .profile-settings-upload { display: inline-flex; min-height: 2.35rem; align-items: center; justify-content: center; gap: 0.45rem; border-radius: 999px; background: rgba(255, 255, 255, 0.08); color: var(--text-primary); cursor: pointer; padding: 0 0.85rem; font-size: 0.78rem; font-weight: 800; } .profile-settings-upload:hover { background: rgba(255, 255, 255, 0.13); } .profile-settings-upload input { display: none; } .profile-settings-field { display: grid; gap: 0.4rem; } .profile-settings-field span { color: var(--text-secondary); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; } .profile-settings-field input { min-height: 2.75rem; border: 0; border-radius: 0.95rem; outline: 0; background: rgba(255, 255, 255, 0.07); color: var(--text-primary); padding: 0 0.85rem; font: inherit; } .profile-settings-field input:focus { background: rgba(255, 255, 255, 0.1); box-shadow: 0 0 0 1px rgba(181, 255, 90, 0.34); } .profile-settings-divider { height: 1px; background: rgba(255, 255, 255, 0.08); margin: 0.25rem 0; } .profile-settings-message { margin: 0; color: var(--text-secondary); font-size: 0.78rem; line-height: 1.4; } .profile-settings-panel__foot { display: grid; gap: 0.65rem; } @keyframes profilePanelSlide { from { opacity: 0; transform: translateX(1.25rem); } to { opacity: 1; transform: translateX(0); } } .admin-panel-nav__head { display: flex; align-items: start; justify-content: space-between; gap: 3.05rem; } .admin-panel-nav__head h2 { margin: 0.15rem 0 0; font-size: 1.15rem; line-height: 1.1; } .admin-panel-close { position: absolute; top: var(--admin-control-inset); right: var(--admin-control-inset); width: var(--admin-control-ring); height: var(--admin-control-ring); flex: 0 0 auto; border: 1px solid rgba(255, 255, 255, 0.22); outline: none; background: transparent !important; background-image: none !important; box-shadow: none; color: rgba(255, 255, 255, 0.8); } .admin-panel-close:hover { border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.07) !important; color: var(--text-primary); } .admin-panel-client-select { position: relative; display: flex; width: calc(100% + (var(--admin-nav-pad) * 2)); min-height: calc(var(--admin-control-ring) + (var(--admin-control-inset) * 2)); margin-inline: calc(var(--admin-nav-pad) * -1); align-items: center; gap: 0.65rem; overflow: hidden; border: 0; border-radius: var(--launcher-radius-circle); outline: none; background: rgba(64, 64, 64, 0.48); padding: var(--admin-control-inset) calc(var(--admin-control-inset) + 1.9rem) var(--admin-control-inset) var(--admin-control-inset); color: var(--text-primary); font: inherit; text-align: left; box-shadow: none; cursor: pointer; } .admin-panel-client-select:hover, .admin-panel-client-select:focus, .admin-panel-client-select:focus-visible, .admin-panel-client-select[aria-expanded="true"] { border: 0; outline: none; box-shadow: none; background: rgba(74, 74, 74, 0.5); } .admin-panel-client-select__icon, .admin-panel-nav-item__icon { display: grid; width: var(--admin-control-ring); height: var(--admin-control-ring); place-items: center; flex: 0 0 auto; border: 0; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.035); } .admin-panel-client-select__icon { background: rgba(255, 255, 255, 0.06); } .admin-panel-client-select__name { min-width: 0; overflow: hidden; font-size: 0.92rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; } .admin-panel-client-select__chevron { position: absolute; top: 50%; right: var(--admin-control-inset); display: grid; width: 1.85rem; height: 1.85rem; place-items: center; color: var(--text-muted); transform: translateY(-50%); pointer-events: none; } .admin-panel-client-select select { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; opacity: 0; cursor: pointer; } .admin-panel-client-select option { color: #101318; } .admin-panel-nav-list { display: grid; width: calc(100% + (var(--admin-nav-pad) * 2)); margin-inline: calc(var(--admin-nav-pad) * -1); align-content: start; gap: 0.22rem; overflow-x: visible; overflow-y: auto; } .admin-panel-nav-item, .admin-panel-role { position: relative; display: flex; width: 100%; min-height: calc(var(--admin-control-ring) + (var(--admin-control-inset) * 2)); align-items: center; justify-content: flex-start; gap: 0.86rem; border: 0; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.04); color: rgba(255, 255, 255, 0.66); padding: var(--admin-control-inset) 0.9rem var(--admin-control-inset) calc(var(--admin-control-inset) + var(--admin-control-ring) + 0.86rem); font-size: 0.91rem; font-weight: 570; text-align: left; opacity: 0.66; transition: background 160ms ease, color 160ms ease, opacity 160ms ease, transform 160ms ease, box-shadow 160ms ease; } .admin-panel-nav-item .admin-panel-nav-item__icon, .admin-panel-role .admin-panel-nav-item__icon { position: absolute; top: 50%; left: var(--admin-control-inset); transform: translateY(-50%); border: 0; background: rgba(255, 255, 255, 0.045); color: rgba(255, 255, 255, 0.58); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 8px 20px rgba(0, 0, 0, 0.16); } .admin-panel-nav-item:hover { background: rgba(255, 255, 255, 0.085); color: var(--text-primary); opacity: 0.92; transform: translateY(-1px); } .admin-panel-nav-item > span:last-child, .admin-panel-role > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .admin-panel-nav-item--active { background: rgba(255, 255, 255, 0.115); color: var(--text-primary); opacity: 1; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.048), 0 10px 22px rgba(0, 0, 0, 0.12); } .admin-panel-nav-item--active .admin-panel-nav-item__icon { background: rgba(247, 248, 244, 0.96); color: rgb(var(--nodedc-on-accent-rgb)); } .admin-panel-role { width: calc(100% + (var(--admin-nav-pad) * 2)); margin-inline: calc(var(--admin-nav-pad) * -1); background: rgba(255, 255, 255, 0.04); opacity: 0.82; } .admin-panel-content__body { min-height: 0; overflow: auto; } .admin-panel-content .admin-section-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .admin-panel-content .access-layout, .admin-panel-content .invites-layout { grid-template-columns: 1fr; overflow: visible; } .admin-panel-content .glass-surface { background: rgba(255, 255, 255, 0.055); box-shadow: none; } .admin-panel-content .table-shell { background: rgba(255, 255, 255, 0.04); } .admin-panel-content .table-shell, .admin-panel-content .access-matrix, .admin-panel-content .access-explanation, .admin-panel-content .invite-form, .admin-panel-content .company-panel { max-width: 100%; } @keyframes adminPanelSlide { from { opacity: 0; transform: translateX(-1.6rem); } to { opacity: 1; transform: translateX(0); } } .admin-backdrop { position: fixed; z-index: 100; inset: 0; display: flex; align-items: center; justify-content: center; padding: clamp(0.8rem, 3vw, 2rem); background: rgba(0, 0, 0, 0.22); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); } .admin-overlay { position: relative; display: grid; grid-template-columns: 18.5rem minmax(0, 1fr); width: min(74rem, calc(100vw - 3rem)); height: min(48rem, calc(100vh - 4rem)); overflow: hidden; border-radius: var(--launcher-radius-modal); background: linear-gradient(180deg, rgba(255, 255, 255, 0.036) 0%, rgba(255, 255, 255, 0.012) 100%), rgba(8, 8, 11, 0.9); box-shadow: 0 28px 76px rgba(0, 0, 0, 0.5), 0 8px 24px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.036); } .admin-window-close { position: absolute; top: 0.7rem; right: 0.7rem; z-index: 10; width: 2.75rem; height: 2.75rem; background: rgba(255, 255, 255, 0.06); } .admin-sidebar { display: grid; grid-template-rows: auto auto 1fr auto; gap: 1rem; min-width: 0; padding: 1rem; background: linear-gradient(180deg, rgba(255, 255, 255, 0.024) 0%, rgba(255, 255, 255, 0.008) 100%), rgba(8, 8, 11, 0.58); } .admin-sidebar__head { display: flex; align-items: start; justify-content: space-between; gap: 0.8rem; } .admin-sidebar h2, .admin-header h1, .table-toolbar h3, .admin-wide-card h3, .access-explanation h3, .invite-form h3, .company-panel h3 { margin: 0; } .admin-nav { display: grid; align-content: start; gap: 0.4rem; overflow-y: auto; } .admin-nav__item { display: flex; align-items: center; gap: 0.62rem; min-height: 2.75rem; padding: 0 0.75rem; border: 0; border-radius: 1.1rem; background: transparent; color: var(--text-secondary); text-align: left; } .admin-nav__item:hover, .admin-nav__item--active { background: rgba(255, 255, 255, 0.1); color: var(--text-primary); } .admin-nav__item--active { color: rgb(var(--nodedc-accent-rgb)); box-shadow: none; } .admin-sidebar__foot, .admin-client-lock { display: flex; align-items: center; gap: 0.55rem; min-height: 2.65rem; padding: 0 0.75rem; border-radius: 1.35rem; background: rgba(255, 255, 255, 0.08); color: var(--text-secondary); } .admin-content { display: grid; grid-template-rows: auto 1fr; gap: 1rem; min-width: 0; overflow: hidden; padding: 1rem; } .admin-header { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; min-height: var(--admin-control-ring); } .admin-header__actions, .table-toolbar, .access-actions { display: flex; align-items: center; justify-content: space-between; gap: 0.65rem; } .admin-circle-action { width: var(--admin-control-ring); height: var(--admin-control-ring); min-width: var(--admin-control-ring); border: 1px solid rgba(255, 255, 255, 0.22); background: transparent !important; background-image: none !important; color: rgba(255, 255, 255, 0.82); box-shadow: none; } .admin-circle-action:hover { border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.07) !important; color: var(--text-primary); } .admin-circle-action--solid { border-color: rgba(247, 248, 244, 0.96); background: rgba(247, 248, 244, 0.96) !important; color: rgb(var(--nodedc-on-accent-rgb)); } .admin-circle-action--solid:hover { border-color: #fff; background: #fff !important; color: rgb(var(--nodedc-on-accent-rgb)); } .admin-circle-action:disabled { cursor: default; opacity: 0.36; filter: grayscale(1); } .admin-content-close { background: transparent !important; color: rgba(255, 255, 255, 0.8); } .admin-section-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; overflow-y: auto; } .metric-card { display: grid; gap: 0.3rem; min-height: 8rem; padding: 1rem; } .metric-card span, .metric-card small { color: var(--text-muted); } .metric-card strong { font-size: 2.2rem; } .metric-card--danger strong { color: #ffd0d0; } .admin-wide-card { grid-column: 1 / -1; padding: 1rem; } .activity-list { display: grid; gap: 0.5rem; margin-top: 1rem; } .activity-row { display: grid; grid-template-columns: 9.5rem 1fr 1fr; gap: 0.75rem; padding: 0.75rem; border-radius: 0.9rem; background: rgba(255, 255, 255, 0.06); } .activity-row span, .activity-row em { color: var(--text-muted); font-style: normal; } .table-shell, .access-matrix, .access-explanation, .invite-form, .company-panel { min-width: 0; overflow: auto; padding: 1rem; } .admin-data-table--users { min-width: 82rem; table-layout: fixed; } .admin-data-table--users th, .admin-data-table--users td { white-space: nowrap; } .admin-data-table--users th:nth-child(1), .admin-data-table--users td:nth-child(1) { width: 17rem; } .admin-data-table--users th:nth-child(2), .admin-data-table--users td:nth-child(2) { width: 8.2rem; } .admin-data-table--users th:nth-child(3), .admin-data-table--users td:nth-child(3) { width: 8.5rem; } .admin-data-table--users th:nth-child(4), .admin-data-table--users td:nth-child(4) { width: 13rem; } .admin-data-table--users th:nth-child(5), .admin-data-table--users td:nth-child(5), .admin-data-table--users th:nth-child(6), .admin-data-table--users td:nth-child(6) { width: 10rem; } .admin-data-table--users th:nth-child(7), .admin-data-table--users td:nth-child(7) { width: 9.6rem; } .admin-data-table--users th:nth-child(8), .admin-data-table--users td:nth-child(8) { width: 3.6rem; } .table-toolbar { margin-bottom: 0.7rem; } .admin-panel-content table { font-size: 0.82rem; } .admin-panel-content th { padding: 0.62rem 0.75rem; font-size: 0.66rem; } .admin-panel-content td { padding: 0.48rem 0.75rem; vertical-align: middle; } .admin-panel-content td strong { font-size: 0.84rem; } .admin-panel-content td small { font-size: 0.72rem; } .services-table-shell { border-radius: var(--launcher-radius-card); } .services-admin-table { table-layout: fixed; } .services-admin-table th:nth-child(1) { width: 24%; } .services-admin-table th:nth-child(2) { width: 13%; } .services-admin-table th:nth-child(3) { width: 12%; } .services-admin-table th:nth-child(4) { width: 25%; } .services-admin-table th:nth-child(5) { width: 15%; } .services-admin-table th:nth-child(6) { width: 3.4rem; } .services-admin-table th:nth-child(7) { width: 3.1rem; } .services-admin-table tbody tr { transition: transform 220ms cubic-bezier(0.2, 0.82, 0.2, 1), opacity 160ms ease, background 160ms ease; } .services-admin-table tbody tr:has(.services-admin-table__drag-handle:hover), .services-admin-table tbody tr:has(.services-admin-table__drag-handle:focus-visible) { background: rgba(255, 255, 255, 0.035); } .services-admin-table__row--dragging { position: relative; z-index: 6; opacity: 1; background: linear-gradient(90deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.04)), rgba(22, 22, 24, 0.94); box-shadow: 0 1.2rem 2.6rem rgba(0, 0, 0, 0.36); } .services-admin-table__service { display: grid; gap: 0.2rem; } .admin-table-input { width: 100%; min-width: 0; min-height: 2rem; border: 0; border-radius: 0.7rem; background: transparent; color: var(--text-primary); padding: 0.18rem 0.35rem; font-size: 0.78rem; font-weight: 600; } .admin-table-input:hover, .admin-table-input:focus { background: rgba(255, 255, 255, 0.055); } .admin-table-input--strong { font-size: 0.86rem; font-weight: 780; } .admin-table-input--muted { min-height: 1.35rem; color: var(--text-muted); font-size: 0.72rem; } .admin-table-input--select { appearance: none; background: rgba(255, 255, 255, 0.045); cursor: pointer; } .admin-field-row { display: grid; grid-template-columns: minmax(0, 1fr) 2.85rem; gap: 0.6rem; align-items: center; } .service-content-field small { color: var(--text-muted); font-size: 0.72rem; line-height: 1.35; } .service-status-dropdown { width: 7.45rem; min-width: 7.45rem; } .service-status-trigger { display: inline-flex; width: 7.45rem; min-height: 2.08rem; align-items: center; justify-content: center; border: 0; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.085); color: rgba(255, 255, 255, 0.84); padding: 0 0.7rem; font-size: 0.72rem; font-weight: 850; } .service-status-trigger[data-status="active"] { background: rgba(181, 255, 90, 0.075); color: rgba(226, 255, 190, 0.94); } .service-status-trigger[data-status="maintenance"] { background: rgba(246, 201, 95, 0.075); color: rgba(255, 232, 178, 0.94); } .service-status-trigger[data-status="hidden"] { background: rgba(210, 197, 255, 0.07); color: rgba(232, 225, 255, 0.92); } .service-status-trigger[data-status="disabled"] { background: rgba(255, 120, 120, 0.07); color: rgba(255, 216, 216, 0.92); } .service-status-trigger span { width: 100%; text-align: center; } .service-status-trigger:hover, .service-status-trigger[aria-expanded="true"] { filter: brightness(1.12); color: var(--text-primary); } .service-status-menu { display: grid; gap: 0.18rem; min-width: 9.8rem; } .service-status-menu__option { display: grid; grid-template-columns: 1rem minmax(0, 1fr); min-height: 2.45rem; align-items: center; border: 0; border-radius: 0.92rem; background: transparent; color: rgba(255, 255, 255, 0.68); padding: 0 0.78rem; text-align: left; font-size: 0.8rem; font-weight: 780; } .service-status-menu__option span { text-align: left; } .service-status-menu__mark { display: block; width: 0.45rem; height: 0.45rem; border-radius: var(--launcher-radius-circle); background: transparent; } .service-status-menu__option:hover, .service-status-menu__option:focus-visible { background: rgba(255, 255, 255, 0.075); color: var(--text-primary); outline: none; } .service-status-menu__option[data-selected="true"] { background: rgba(255, 255, 255, 0.11); color: var(--text-primary); } .service-status-menu__option[data-selected="true"] .service-status-menu__mark { background: rgba(247, 248, 244, 0.96); } .service-status-menu__option[data-status="active"][data-selected="true"] { background: rgba(181, 255, 90, 0.065); color: rgba(226, 255, 190, 0.96); } .service-status-menu__option[data-status="maintenance"][data-selected="true"] { background: rgba(246, 201, 95, 0.065); color: rgba(255, 232, 178, 0.96); } .service-status-menu__option[data-status="hidden"][data-selected="true"] { background: rgba(210, 197, 255, 0.06); color: rgba(232, 225, 255, 0.94); } .service-status-menu__option[data-status="disabled"][data-selected="true"] { background: rgba(255, 120, 120, 0.06); color: rgba(255, 216, 216, 0.94); } .service-status-menu__option[data-status="active"][data-selected="true"] .service-status-menu__mark { background: rgba(181, 255, 90, 0.34); } .service-status-menu__option[data-status="maintenance"][data-selected="true"] .service-status-menu__mark { background: rgba(246, 201, 95, 0.34); } .service-status-menu__option[data-status="hidden"][data-selected="true"] .service-status-menu__mark { background: rgba(210, 197, 255, 0.32); } .service-status-menu__option[data-status="disabled"][data-selected="true"] .service-status-menu__mark { background: rgba(255, 120, 120, 0.32); } .admin-status-dropdown { width: 8.65rem; min-width: 8.65rem; } .admin-status-trigger { display: inline-flex; width: 8.65rem; min-height: 2.08rem; align-items: center; justify-content: center; border: 0; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.075); color: rgba(255, 255, 255, 0.84); padding: 0 0.7rem; font-size: 0.72rem; font-weight: 850; white-space: nowrap; } .admin-status-trigger span { width: 100%; text-align: center; } .admin-status-trigger[data-tone="green"] { background: rgba(181, 255, 90, 0.075); color: rgba(226, 255, 190, 0.94); } .admin-status-trigger[data-tone="yellow"] { background: rgba(246, 201, 95, 0.075); color: rgba(255, 232, 178, 0.94); } .admin-status-trigger[data-tone="violet"] { background: rgba(210, 197, 255, 0.07); color: rgba(232, 225, 255, 0.92); } .admin-status-trigger[data-tone="red"] { background: rgba(255, 120, 120, 0.07); color: rgba(255, 216, 216, 0.92); } .admin-status-trigger[data-tone="muted"] { background: rgba(255, 255, 255, 0.075); color: rgba(255, 255, 255, 0.78); } .admin-status-trigger:hover, .admin-status-trigger[aria-expanded="true"] { filter: brightness(1.12); color: var(--text-primary); } .admin-status-trigger--static { pointer-events: none; } .admin-status-menu { display: grid; gap: 0.18rem; min-width: 10.25rem; } .admin-status-menu__option { display: grid; grid-template-columns: 1rem minmax(0, 1fr); min-height: 2.45rem; align-items: center; border: 0; border-radius: 0.92rem; background: transparent; color: rgba(255, 255, 255, 0.68); padding: 0 0.78rem; text-align: left; font-size: 0.8rem; font-weight: 780; } .admin-status-menu__option span { text-align: left; } .admin-status-menu__mark { display: block; width: 0.45rem; height: 0.45rem; border-radius: var(--launcher-radius-circle); background: transparent; } .admin-status-menu__option:hover, .admin-status-menu__option:focus-visible { background: rgba(255, 255, 255, 0.075); color: var(--text-primary); outline: none; } .admin-status-menu__option[data-selected="true"] { background: rgba(255, 255, 255, 0.11); color: var(--text-primary); } .admin-status-menu__option[data-selected="true"] .admin-status-menu__mark { background: rgba(247, 248, 244, 0.96); } .admin-status-menu__option[data-tone="green"][data-selected="true"] { background: rgba(181, 255, 90, 0.065); color: rgba(226, 255, 190, 0.96); } .admin-status-menu__option[data-tone="yellow"][data-selected="true"] { background: rgba(246, 201, 95, 0.065); color: rgba(255, 232, 178, 0.96); } .admin-status-menu__option[data-tone="violet"][data-selected="true"] { background: rgba(210, 197, 255, 0.06); color: rgba(232, 225, 255, 0.94); } .admin-status-menu__option[data-tone="red"][data-selected="true"] { background: rgba(255, 120, 120, 0.06); color: rgba(255, 216, 216, 0.94); } .admin-status-menu__option[data-tone="green"][data-selected="true"] .admin-status-menu__mark { background: rgba(181, 255, 90, 0.34); } .admin-status-menu__option[data-tone="yellow"][data-selected="true"] .admin-status-menu__mark { background: rgba(246, 201, 95, 0.34); } .admin-status-menu__option[data-tone="violet"][data-selected="true"] .admin-status-menu__mark { background: rgba(210, 197, 255, 0.32); } .admin-status-menu__option[data-tone="red"][data-selected="true"] .admin-status-menu__mark { background: rgba(255, 120, 120, 0.32); } .admin-table-select { appearance: none; border-radius: 999px; background: rgba(255, 255, 255, 0.06); padding-inline: 0.55rem; } .services-admin-table__actions { text-align: right; } .services-admin-table__edit { width: 2.35rem; min-width: 2.35rem; height: 2.35rem; margin-left: auto; } .services-admin-table__drag-cell { text-align: right; } .services-admin-table__drag-handle { display: inline-grid; width: 2.35rem; height: 2.35rem; place-items: center; border: 1px solid transparent; border-radius: var(--launcher-radius-circle); background: transparent; color: rgba(255, 255, 255, 0.56); cursor: grab; } .services-admin-table__drag-handle:hover, .services-admin-table__drag-handle:focus-visible { border-color: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.07); color: var(--text-primary); outline: none; } .services-admin-table__drag-handle:active { cursor: grabbing; } .service-content-modal-layer { position: fixed; z-index: 60; inset: 0; display: grid; place-items: center; padding: 1.4rem; background: rgba(0, 0, 0, 0.38); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); } .nodedc-delete-modal-layer { position: fixed; z-index: 90; inset: 0; display: grid; place-items: center; padding: 1.4rem; background: rgba(0, 0, 0, 0.42); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); } .nodedc-glass-detail-surface, .glass-surface--detail, .glass-card--detail { position: relative; isolation: isolate; border: 0; outline: none; background: rgba(7, 7, 10, 0.54); box-shadow: 0 34px 120px rgba(0, 0, 0, 0.64), 0 10px 32px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.045); backdrop-filter: blur(40px) saturate(1.12); -webkit-backdrop-filter: blur(40px) saturate(1.12); } .nodedc-glass-detail-surface::before, .glass-surface--detail::before, .glass-card--detail::before { content: ""; position: absolute; z-index: 0; inset: 0; border-radius: inherit; background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.014) 100%), rgba(5, 5, 8, 0.58); backdrop-filter: blur(44px) saturate(1.16); -webkit-backdrop-filter: blur(44px) saturate(1.16); } .nodedc-glass-detail-surface::after, .glass-surface--detail::after, .glass-card--detail::after { content: ""; position: absolute; z-index: 0; inset: 0; border-radius: inherit; background: linear-gradient(135deg, rgba(255, 255, 255, 0.035), transparent 44%, rgba(255, 255, 255, 0.018)); pointer-events: none; } .nodedc-glass-detail-surface > *, .glass-surface--detail > *, .glass-card--detail > * { position: relative; z-index: 1; } .nodedc-delete-modal { width: min(34rem, calc(100vw - 2.8rem)); overflow: hidden; border: 0; border-radius: var(--launcher-radius-modal); outline: none; } .nodedc-delete-modal__body { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 0.9rem; padding: 1.25rem 1.25rem 1rem; } .nodedc-delete-modal__icon { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border-radius: var(--launcher-radius-circle); background: rgba(var(--nodedc-delete-accent-rgb), 0.08); color: rgb(var(--nodedc-delete-accent-rgb)); } .nodedc-delete-modal__copy { min-width: 0; padding-top: 0.08rem; } .nodedc-delete-modal__copy h3 { margin: 0; color: var(--text-primary); font-size: 1.02rem; font-weight: 850; letter-spacing: 0; } .nodedc-delete-modal__text { margin-top: 0.42rem; color: var(--text-muted); font-size: 0.82rem; font-weight: 650; line-height: 1.45; } .nodedc-delete-modal__text strong { color: var(--text-primary); font-weight: 850; } .nodedc-delete-modal__foot { display: flex; justify-content: flex-end; gap: 0.65rem; padding: 0.9rem 1.25rem 1.15rem; } .nodedc-delete-modal .button { min-width: 8.25rem; border-radius: var(--launcher-radius-control); } .service-content-modal { position: relative; display: grid; width: min(58rem, calc(100vw - 2.8rem)); max-height: min(44rem, calc(100vh - 2.8rem)); grid-template-rows: auto minmax(0, 1fr) auto; gap: 1rem; overflow: hidden; padding: 1rem; border-radius: var(--launcher-radius-modal); background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.018)), rgba(10, 10, 13, 0.9); box-shadow: 0 34px 120px rgba(0, 0, 0, 0.62); backdrop-filter: blur(34px) saturate(1.12); -webkit-backdrop-filter: blur(34px) saturate(1.12); } .service-content-modal__head, .service-content-modal__foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; } .service-content-modal__foot-actions { display: inline-flex; align-items: center; gap: 0.6rem; } .service-content-modal__head h3 { margin: 0.1rem 0 0; font-size: 1.05rem; } .service-content-modal__grid { display: grid; min-height: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; overflow: auto; padding-right: 0.2rem; } .service-content-field { display: grid; gap: 0.38rem; } .service-content-field--wide { grid-column: 1 / -1; } .service-content-field span { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--text-muted); font-size: 0.72rem; font-weight: 800; text-transform: uppercase; } .service-content-field input, .service-content-field textarea, .service-content-field select { width: 100%; border: 0; border-radius: 1rem; background: rgba(255, 255, 255, 0.06); color: var(--text-primary); padding: 0.75rem 0.85rem; font-size: 0.84rem; } .service-content-field select { min-height: 2.75rem; appearance: none; } .service-media-field { min-width: 0; } .service-media-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; min-height: 3.35rem; overflow: hidden; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.06); padding: 0.25rem; } .service-media-control .service-media-url-input { min-width: 0; height: 100%; border-radius: var(--launcher-radius-circle); background: transparent; padding: 0 0.82rem; } .service-media-file-control { display: flex; min-width: 0; height: 100%; align-items: center; gap: 0.7rem; padding-left: 0.15rem; } .service-media-file-control input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; } .service-media-file-button { display: inline-flex; min-height: 2.78rem; align-items: center; justify-content: center; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.92); color: rgba(8, 8, 10, 0.96); padding: 0 1rem; font-size: 0.78rem; font-weight: 850; white-space: nowrap; cursor: pointer; } .service-media-file-name { min-width: 0; overflow: hidden; color: var(--text-muted); font-size: 0.78rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; } .service-media-source-switch { display: inline-flex; align-items: center; gap: 0.12rem; } .service-media-source-button { display: grid; width: 2.78rem; height: 2.78rem; place-items: center; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: var(--launcher-radius-circle); background: transparent; color: rgba(255, 255, 255, 0.66); } .service-media-source-button:hover { background: rgba(255, 255, 255, 0.07); color: var(--text-primary); } .service-media-source-button[data-active="true"] { border-color: rgba(255, 255, 255, 0.92); background: rgba(255, 255, 255, 0.92); color: rgba(8, 8, 10, 0.96); } .service-content-field textarea { resize: vertical; line-height: 1.45; } .service-content-field--upload input { min-height: 2.95rem; padding: 0.62rem; } .service-content-preview { display: grid; min-height: 13rem; place-items: center; overflow: hidden; border-radius: 1.1rem; background: rgba(255, 255, 255, 0.045); color: var(--text-muted); } .service-content-preview img, .service-content-preview video { width: 100%; height: 100%; object-fit: cover; } .service-content-storage-error { grid-column: 1 / -1; margin: 0; border-radius: var(--launcher-radius-control); background: rgba(255, 116, 116, 0.13); color: #ffd0d0; padding: 0.7rem 0.85rem; font-size: 0.78rem; font-weight: 750; } .admin-token-grid { display: flex; flex-wrap: wrap; gap: 0.45rem; min-height: 3rem; align-items: flex-start; border-radius: 1rem; background: rgba(255, 255, 255, 0.045); padding: 0.48rem; } .admin-token { min-height: 2.1rem; border: 0; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.07); color: var(--text-secondary); padding: 0 0.8rem; font-size: 0.76rem; font-weight: 780; } .admin-token:hover { background: rgba(255, 255, 255, 0.11); color: var(--text-primary); } .admin-token[data-active="true"] { background: rgba(247, 248, 244, 0.96); color: rgb(var(--nodedc-on-accent-rgb)); } .access-layout { display: grid; grid-template-columns: minmax(0, 1fr) 21rem; gap: 1rem; min-height: 0; overflow: hidden; } .matrix-scroll { overflow: auto; } .access-cell { display: grid; gap: 0.2rem; width: 100%; min-width: 8rem; min-height: 3.25rem; padding: 0.55rem; border: 0; border-radius: 0.85rem; background: rgba(255, 255, 255, 0.06); color: var(--text-secondary); text-align: left; cursor: pointer; } .access-cell--allowed { background: rgba(181, 255, 90, 0.14); color: #defeb2; } .access-cell--denied { background: rgba(255, 255, 255, 0.05); } .access-cell--exception { background: rgba(255, 116, 116, 0.16); color: #ffd0d0; } .access-cell--active { background: rgba(255, 255, 255, 0.12); box-shadow: none; } .access-cell--pending { cursor: wait; opacity: 0.72; } .access-cell:not(.access-cell--pending):hover, .access-cell:not(.access-cell--pending)[aria-expanded="true"] { filter: brightness(1.12); } .access-cell span { color: var(--text-muted); font-size: 0.75rem; } .access-cell-menu { min-width: 10.75rem; } .access-cell-menu .nodedc-ui-option[data-tone="green"][data-selected="true"] { background: rgba(181, 255, 90, 0.085); } .access-cell-menu .nodedc-ui-option[data-tone="red"][data-selected="true"] { background: rgba(255, 120, 120, 0.08); } .access-explanation { display: grid; align-content: start; gap: 1rem; } .access-empty-state { display: grid; gap: 0.35rem; min-height: 8rem; align-content: center; padding: 1rem; border-radius: 1rem; background: rgba(255, 255, 255, 0.055); } .access-empty-state strong { color: var(--text-primary); font-size: 0.95rem; } .access-empty-state span { max-width: 28rem; color: var(--text-muted); font-size: 0.82rem; line-height: 1.35; } .explanation-stack { display: grid; gap: 0.65rem; } .info-line { display: grid; gap: 0.25rem; padding: 0.72rem; border-radius: 0.9rem; background: rgba(255, 255, 255, 0.07); } .info-line span { color: var(--text-muted); font-size: 0.75rem; text-transform: uppercase; } .info-line strong { color: var(--text-secondary); line-height: 1.35; } .invites-layout { display: grid; grid-template-columns: 21rem minmax(0, 1fr); gap: 1rem; min-height: 0; overflow: hidden; } .invites-layout--catalog { grid-template-columns: 1fr; } .invite-form { display: grid; align-content: start; gap: 0.75rem; } .invite-form--compact { padding: 1rem; } .invite-form__fields { display: grid; grid-template-columns: minmax(0, 1fr) 12rem; gap: 0.65rem; } .invite-form input, .invite-form select { min-height: 2.7rem; border: 0; border-radius: var(--launcher-radius-control); background: rgba(255, 255, 255, 0.08); color: var(--text-primary); padding: 0 0.8rem; } .invite-form select { appearance: none; } .invite-link-cell { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 0.45rem; } .invite-link-cell code { min-width: 0; overflow: hidden; color: var(--text-secondary); text-overflow: ellipsis; white-space: nowrap; } .invite-link-cell__state { color: var(--accent-lime); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.02em; white-space: nowrap; } .admin-helper-note { max-width: 38rem; margin: 0.22rem 0 0; color: var(--text-muted); font-size: 0.73rem; line-height: 1.35; } .admin-settings-panel { max-width: 44rem; } .admin-settings-grid { display: grid; gap: 1rem; } .admin-settings-field { display: grid; gap: 0.4rem; padding: 0.9rem; border-radius: 1rem; background: rgba(255, 255, 255, 0.055); } .admin-settings-field span { color: var(--text-primary); font-size: 0.82rem; font-weight: 780; } .admin-settings-field small { color: var(--text-muted); font-size: 0.72rem; line-height: 1.35; } .admin-settings-field__input { min-height: 2.55rem; background: rgba(255, 255, 255, 0.07); padding: 0 0.8rem; } .company-panel { max-width: 42rem; } .empty-stage-card { display: grid; gap: 0.7rem; width: min(25rem, 92vw); padding: 1.4rem; } .empty-stage-card h1, .empty-stage-card p { margin: 0; } .empty-stage-card p { color: var(--text-secondary); line-height: 1.5; } .nodedc-ui-dropdown { display: contents; } .portal-dropdown, .nodedc-dropdown-surface, .nodedc-ui-dropdown-surface { position: fixed; z-index: 420; padding: 0.65rem; border: 0; border-radius: 1.25rem; background: linear-gradient(180deg, rgba(255, 255, 255, 0.068), rgba(255, 255, 255, 0.02)), rgba(11, 11, 14, 0.94); box-shadow: 0 26px 92px rgba(0, 0, 0, 0.62); backdrop-filter: blur(var(--nodedc-dropdown-blur, 44px)) saturate(1.12); -webkit-backdrop-filter: blur(var(--nodedc-dropdown-blur, 44px)) saturate(1.12); } .nodedc-ui-select-trigger { display: inline-flex; min-height: 2.6rem; align-items: center; justify-content: space-between; gap: 0.55rem; border: 0; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.06); color: var(--text-primary); padding: 0 0.78rem; font: inherit; font-size: 0.78rem; font-weight: 780; } .nodedc-ui-select-trigger:hover, .nodedc-ui-select-trigger:focus-visible, .nodedc-ui-select-trigger[aria-expanded="true"] { background: rgba(255, 255, 255, 0.09); color: var(--text-primary); outline: none; } .nodedc-ui-select-trigger__icon, .nodedc-ui-option__icon { display: grid; width: 1.8rem; height: 1.8rem; flex: 0 0 auto; place-items: center; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.07); color: currentColor; } .nodedc-ui-select-trigger__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .nodedc-ui-select-trigger__chevron { flex: 0 0 auto; opacity: 0.65; } .nodedc-ui-select-menu { display: grid; gap: 0.28rem; } .nodedc-ui-dropdown-search { display: grid; grid-template-columns: auto minmax(0, 1fr); min-height: 2.55rem; align-items: center; gap: 0.45rem; border-radius: 0.95rem; background: rgba(255, 255, 255, 0.055); color: var(--text-muted); padding: 0 0.75rem; } .nodedc-ui-dropdown-search input { min-width: 0; border: 0; background: transparent; color: var(--text-primary); font: inherit; font-size: 0.78rem; outline: none; } .nodedc-ui-dropdown-search input::placeholder { color: rgba(255, 255, 255, 0.42); } .nodedc-ui-option-list { display: grid; gap: 0.18rem; } .nodedc-dropdown-option, .nodedc-ui-option { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; width: 100%; min-height: 2.45rem; align-items: center; gap: 0.55rem; border: 0; border-radius: 0.92rem; background: transparent; color: rgba(255, 255, 255, 0.68); padding: 0.38rem 0.62rem; text-align: left; font-size: 0.8rem; font-weight: 760; } .nodedc-ui-option:hover, .nodedc-ui-option:focus-visible { background: rgba(255, 255, 255, 0.075); color: var(--text-primary); outline: none; } .nodedc-ui-option[data-selected="true"] { background: rgba(255, 255, 255, 0.105); color: var(--text-primary); } .nodedc-ui-option[data-tone="green"][data-selected="true"] { background: rgba(181, 255, 90, 0.065); color: rgba(226, 255, 190, 0.96); } .nodedc-ui-option[data-tone="yellow"][data-selected="true"] { background: rgba(246, 201, 95, 0.065); color: rgba(255, 232, 178, 0.96); } .nodedc-ui-option[data-tone="violet"][data-selected="true"] { background: rgba(210, 197, 255, 0.06); color: rgba(232, 225, 255, 0.94); } .nodedc-ui-option[data-tone="red"][data-selected="true"] { background: rgba(255, 120, 120, 0.06); color: rgba(255, 216, 216, 0.94); } .nodedc-ui-option__body { display: grid; min-width: 0; gap: 0.1rem; } .nodedc-ui-option__label, .nodedc-ui-option__description { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .nodedc-ui-option__description { color: var(--text-muted); font-size: 0.72rem; font-weight: 650; } .nodedc-ui-option__check { color: rgba(255, 255, 255, 0.86); } .admin-table-select-wrap, .admin-modal-select-wrap { display: block; width: 100%; } .admin-table-select-trigger { width: 100%; min-height: 1.95rem; justify-content: flex-start; border-radius: var(--launcher-radius-circle); background: rgba(255, 255, 255, 0.045); color: var(--text-secondary); padding: 0 0.62rem; font-size: 0.74rem; font-weight: 780; } .admin-table-select-trigger .nodedc-ui-select-trigger__text { flex: 1; } .admin-modal-select-trigger { width: 100%; min-height: 2.75rem; border-radius: 1rem; background: rgba(255, 255, 255, 0.06); padding: 0 0.85rem; } .nodedc-ui-profile-menu { padding: 0.55rem; } .nodedc-ui-profile-card { display: grid; gap: 0.32rem; } .nodedc-ui-profile-card__cover { position: relative; display: grid; min-height: 8rem; align-content: center; justify-items: center; gap: 0.08rem; overflow: hidden; border-radius: 0.9rem; background-color: rgba(255, 255, 255, 0.08); background-position: center; background-size: cover; color: var(--text-primary); text-align: center; } .nodedc-ui-profile-card__cover::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.38)); } .nodedc-ui-profile-card__cover > * { position: relative; z-index: 1; } .nodedc-ui-avatar { display: grid; width: 3.35rem; height: 3.35rem; place-items: center; overflow: hidden; border-radius: var(--launcher-radius-circle); background: radial-gradient(circle at 72% 20%, rgba(255, 255, 255, 0.72), transparent 23%), linear-gradient(135deg, rgb(166, 194, 109), rgb(142, 123, 139)); color: rgba(8, 8, 10, 0.96); object-fit: cover; font-size: 0.82rem; font-weight: 850; line-height: 1; } .nodedc-ui-profile-card__cover > strong, .nodedc-ui-profile-card__cover > span:not(.nodedc-ui-avatar) { display: block; max-width: 86%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .nodedc-ui-profile-card__cover > strong { margin-top: 0.25rem; font-size: 0.92rem; } .nodedc-ui-profile-card__cover > span:not(.nodedc-ui-avatar) { color: rgba(255, 255, 255, 0.78); font-size: 0.78rem; } .nodedc-ui-profile-card__row { display: flex; min-height: 2.65rem; align-items: center; gap: 0.55rem; border: 0; border-radius: 0.85rem; background: transparent; color: var(--text-secondary); padding: 0 0.72rem; text-align: left; font-size: 0.82rem; font-weight: 700; } .nodedc-ui-profile-card__row:hover { background: rgba(255, 255, 255, 0.075); color: var(--text-primary); } @media (max-width: 1120px) { .nodedc-expanded-toolbar { min-height: 8.25rem; } .nodedc-expanded-toolbar-top { grid-template-columns: 1fr auto; } .nodedc-expanded-toolbar-center { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; justify-self: start; overflow-x: auto; width: 100%; } .admin-overlay, .access-layout, .invites-layout { grid-template-columns: 1fr; } .admin-overlay { grid-template-rows: auto 1fr; height: min(52rem, calc(100vh - 1.6rem)); } .admin-sidebar { grid-template-rows: auto auto auto; border-right: 0; } .admin-nav { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; } .stage-service-overlay { width: min(62rem, calc(100% - 5rem)); gap: 0.8rem; } .stage-empty-title { top: 3.84rem; left: 3.84rem; } } @media (max-width: 760px) { .launcher-app { padding: 0; } .nodedc-expanded-toolbar-shell { padding: 1rem 1rem 0.75rem; } .nodedc-expanded-toolbar { min-height: 10.5rem; } .nodedc-expanded-toolbar-top { grid-template-columns: 1fr; } .nodedc-expanded-toolbar-center, .nodedc-expanded-toolbar-right { justify-content: flex-start; overflow-x: auto; width: 100%; } .nodedc-expanded-nav-group { max-width: 100%; overflow-x: auto; } .nodedc-expanded-user-group { max-width: 100%; } .select-shell, .button { width: auto; } .launcher-main { min-height: calc(100vh - 12rem); } .service-stage { padding: 0 0.7rem 10rem; } .stage-video-shell { width: 100%; height: min(32rem, calc(100vh - 20rem)); min-height: 28rem; border-radius: 1.45rem; } .stage-service-overlay { top: 50%; left: 50%; width: calc(100% - 2rem); grid-template-columns: 1fr; max-height: calc(100% - 5rem); overflow-y: auto; transform: translate(-50%, -50%); } .stage-empty-title { top: 2.05rem; left: 2.05rem; } .stage-timeline-strip { display: none; } .stage-image-card, .stage-description-card { border-radius: 1.2rem; } .stage-image-card__visual { inset: 0; } .service-rail { --service-rail-card-size: var(--launcher-rail-height); right: 0.65rem; bottom: 0.65rem; left: 0.65rem; } .service-rail__scroll { padding: 0 1.8rem; } .service-rail__track { gap: calc(var(--service-rail-card-size) * 0.72); } .service-tile { width: calc((var(--service-rail-card-size) * 2) + var(--service-tile-joint-gap)); min-width: calc((var(--service-rail-card-size) * 2) + var(--service-tile-joint-gap)); } .service-tile__content { width: var(--service-rail-card-size); padding: 0.62rem 0.68rem; } .service-tile__content small { display: none; } .admin-backdrop { padding: 0.55rem; align-items: stretch; } .admin-overlay { width: 100%; height: 100%; } .admin-content { padding: 0.65rem; } .admin-header, .admin-header__actions, .table-toolbar, .access-actions { align-items: stretch; flex-direction: column; } .admin-section-grid { grid-template-columns: 1fr; } .activity-row { grid-template-columns: 1fr; } }