/* Customer operations layer: billing, support and instance workflows. */
.client-shell .cp-page { display: grid; gap: 18px; }
.client-shell .cp-page > * { min-width: 0; }
.client-shell .cp-page .cp-hero {
    position: relative; overflow: hidden; min-height: 168px; margin: 0;
    padding: 28px; border: 1px solid #214c59; border-radius: 8px;
    background-color: #102f3d; background-image: url('/images/cloud-workspace-v2.png');
    background-repeat: no-repeat; background-position: right center; background-size: min(48%, 620px) auto;
    color: #f6fbfc; box-shadow: 0 20px 44px rgba(16,47,61,.13);
}
.client-shell .cp-page .cp-hero::after { content:""; position:absolute; inset:0; background:rgba(16,47,61,.32); pointer-events:none; }
.client-shell .cp-page .cp-hero > * { position: relative; z-index: 1; }
.client-shell .cp-page .cp-hero .cp-title { color:#fff; font-size:clamp(28px,4vw,42px); line-height:1.08; }
.client-shell .cp-page .cp-hero .cp-subtitle { color:#cbe0e5; max-width:700px; }
.client-shell .cp-page .cp-hero .cp-eyebrow { color:#91ead3; }
.client-shell .cp-page .cp-hero .cp-btn-ghost { color:#f6fbfc; border-color:#53727c; background:rgba(16,47,61,.72); }
.client-shell .cp-page .cp-card,.client-shell .cp-page .cp-stat { border-color:#d8e4e7; box-shadow:0 12px 30px rgba(16,47,61,.06); }
.client-shell .cp-page .cp-card { overflow:hidden; }
.client-shell .cp-page .cp-card-head { background:#fbfdfd; border-bottom-color:#dce7e9; }
.client-shell .cp-page .form-control,.client-shell .cp-page .form-select { min-height:44px; border-color:#cbdade; border-radius:7px; }
.client-shell .cp-page textarea.form-control { min-height:120px; }
.client-shell .cp-page :is(.form-control,.form-select):focus { border-color:#078675; box-shadow:0 0 0 3px rgba(7,134,117,.13); }
.client-shell .cp-page .cp-table tbody tr { transition:background-color .18s ease,transform .18s ease; }
.client-shell .cp-page .cp-table tbody tr:hover { background:#f3faf8; }

/* Wallet */
.wallet-workspace .ww-layout { align-items:start; }
.wallet-workspace .ww-funding { border-top:4px solid #078675; }
.wallet-workspace .ww-step { border-color:#d8e6e7; background:#fbfdfd; }
.wallet-workspace .ww-step-title > span { background:#102f3d; color:#fff; }
.wallet-workspace .ww-amount-field { border-color:#b8d5d2; background:#f2fbf8; }
.wallet-workspace .ww-amount-field > span { background:#078675; color:#fff; }
.wallet-workspace .ww-presets button { border-color:#c9dadd; background:#fff; color:#183945; transition:transform .18s ease,border-color .18s ease,background .18s ease; }
.wallet-workspace .ww-presets button:hover,.wallet-workspace .ww-presets button[aria-pressed="true"] { border-color:#078675; background:#eaf8f4; transform:translateY(-2px); }
.wallet-workspace .ww-method { min-height:76px; border:1px solid #d5e2e5; background:#fff; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.wallet-workspace .ww-method:hover { transform:translateY(-2px); box-shadow:0 12px 24px rgba(16,47,61,.08); }
.wallet-workspace .ww-method:has(input:checked) { border-color:#078675; background:#eefaf7; box-shadow:0 0 0 2px rgba(7,134,117,.12); }
.wallet-workspace .ww-method-icon { background:#edf4ff; color:#2563eb; }
.wallet-workspace .ww-method:nth-child(3n+2) .ww-method-icon { background:#e8f8f3; color:#078675; }
.wallet-workspace .ww-method:nth-child(3n) .ww-method-icon { background:#fff5e5; color:#a86500; }
.wallet-workspace .ww-balance { position:relative; overflow:hidden; background:#078675; color:#fff; border:0; box-shadow:0 18px 36px rgba(7,134,117,.22); }
.wallet-workspace .ww-balance::after { content:""; position:absolute; width:150px; height:150px; right:-48px; bottom:-70px; border:24px solid rgba(255,255,255,.12); border-radius:50%; }
.wallet-workspace .ww-balance :is(.ww-balance-label,.ww-balance-value,.ww-balance-owner,.ww-balance-owner small,.ww-balance a) { color:#fff; }
.wallet-workspace .ww-balance-owner { display:flex; flex-direction:column; gap:3px; }
.wallet-workspace .ww-balance-owner small { opacity:.78; font-size:11px; letter-spacing:0; }
.wallet-workspace .ww-transaction { border-left:3px solid #2563eb; }
.wallet-workspace .ww-transaction:has(.ww-mint) { border-left-color:#078675; }

/* Support */
.support-workspace .cp-grid .cp-stat { position:relative; overflow:hidden; border-top:4px solid #2563eb; }
.support-workspace .cp-grid > :nth-child(2) .cp-stat { border-top-color:#d94670; }
.support-workspace .cp-grid > :nth-child(3) .cp-stat { border-top-color:#078675; }
.support-workspace .cp-grid > :nth-child(4) .cp-stat { border-top-color:#d58a0a; }
.support-workspace .cp-filter { border-radius:6px; }
.support-workspace .cp-filter.active { background:#102f3d; color:#fff; border-color:#102f3d; }
.support-create .cp-choice { border:1px solid #d5e2e5; border-radius:7px; transition:transform .18s ease,border-color .18s ease,background .18s ease; }
.support-create .btn-check:checked + .cp-choice { border-color:#078675; background:#effaf7; box-shadow:0 0 0 2px rgba(7,134,117,.1); transform:translateY(-2px); }
.support-thread .cp-thread { display:grid; gap:16px; }
.support-thread .cp-message-bubble { border-radius:8px; border:1px solid #d9e5e7; box-shadow:0 8px 20px rgba(16,47,61,.05); }
.support-thread .cp-message:has(.cp-badge-info) .cp-message-bubble { border-left:4px solid #078675; background:#f3fbf8; }
.support-thread .cp-avatar { background:#2563eb; color:#fff; }

/* Instance identity and command dock */
.cloud-instance .ci-identity-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:-6px 0 18px; }
.cloud-instance .ci-identity-strip article { display:flex; align-items:center; gap:12px; min-width:0; padding:14px; border:1px solid #d6e3e6; border-radius:8px; background:#fff; box-shadow:0 10px 24px rgba(16,47,61,.06); }
.cloud-instance .ci-identity-strip article > div { min-width:0; }
.cloud-instance .ci-identity-strip small { display:block; color:#6b7f87; font-size:11px; font-weight:700; text-transform:uppercase; }
.cloud-instance .ci-identity-strip strong { display:block; overflow:hidden; color:#173541; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.cloud-instance .ci-identity-icon { display:grid; place-items:center; width:46px; height:46px; flex:0 0 46px; border-radius:8px; background:#edf4ff; color:#2563eb; font-size:23px; }
.cloud-instance .ci-identity-icon.is-app { background:#f3edff; color:#7147d9; }
.cloud-instance .ci-identity-icon.is-location { background:#eef9f5; color:#078675; }
.cloud-instance .ci-identity-icon.is-reference { background:#fff5e5; color:#a86500; }
.cloud-instance .ci-identity-icon img { width:34px; height:25px; object-fit:cover; }
.cloud-instance .ci-controls { border-left:4px solid #078675; }
.cloud-instance .ci-actions { align-items:center; }
.cloud-instance .ci-actions form { margin:0; }
.cloud-instance .ci-power-button { display:inline-grid; place-items:center; width:46px; height:46px; padding:0; border:1px solid transparent; border-radius:8px; text-decoration:none; font-size:17px; transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease; }
.cloud-instance .ci-power-button:hover:not(:disabled) { transform:translateY(-3px); box-shadow:0 10px 22px rgba(16,47,61,.14); }
.cloud-instance .ci-power-button:focus-visible { outline:3px solid rgba(37,99,235,.25); outline-offset:2px; }
.cloud-instance .ci-power-button.is-start { background:#078675; color:#fff; }
.cloud-instance .ci-power-button.is-stop { background:#fff0f3; border-color:#f1b9c7; color:#c3244f; }
.cloud-instance .ci-power-button.is-restart { background:#fff5e5; border-color:#eed29c; color:#9b6300; }
.cloud-instance .ci-power-button.is-console { background:#edf4ff; border-color:#bfd1fa; color:#2563eb; }
.cloud-instance .ci-power-button:disabled { opacity:.45; cursor:not-allowed; }
.cloud-instance .ci-metric,.cloud-instance .ci-performance-main,.cloud-instance .ci-allocation,.cloud-instance .ci-section { transition:transform .2s ease,box-shadow .2s ease; }
.cloud-instance .ci-metric:hover,.cloud-instance .ci-section:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(16,47,61,.09); }

@media (prefers-reduced-motion:no-preference) {
    .client-shell[data-motion="on"] .cp-page > * { animation:operations-rise .45s ease both; }
    .client-shell[data-motion="on"] .cp-page > *:nth-child(2) { animation-delay:.04s; }
    .client-shell[data-motion="on"] .cp-page > *:nth-child(3) { animation-delay:.08s; }
    .client-shell[data-motion="on"] .ci-state.is-running::before { animation:operations-pulse 1.8s ease-in-out infinite; }
}
@keyframes operations-rise { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@keyframes operations-pulse { 50% { box-shadow:0 0 0 6px rgba(7,134,117,0); } }

@media (max-width:1050px) { .cloud-instance .ci-identity-strip { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:767px) {
    .client-shell .cp-page .cp-hero { min-height:auto; padding:22px 18px; background-position:130% center; background-size:78% auto; }
    .client-shell .cp-page .cp-hero .cp-title { font-size:30px; }
    .cloud-instance .ci-identity-strip { grid-template-columns:1fr; }
    .cloud-instance .ci-actions,.cloud-instance .ci-actions form { width:auto !important; }
    .cloud-instance .ci-actions .ci-power-button { width:48px !important; }
    .wallet-workspace .ww-transaction { grid-template-columns:auto minmax(0,1fr); }
    .wallet-workspace .ww-transaction > :is(.cp-badge,.ww-transaction-value) { grid-column:2; justify-self:start; }
}
@media (prefers-reduced-motion:reduce) { .client-shell .cp-page * { animation:none !important; transition:none !important; } }