:root{
  --ak-bg:#05080d;
  --ak-panel:#0a1018;
  --ak-panel-2:#0d1621;
  --ak-line:#16314a;
  --ak-cyan:#18c7ff;
  --ak-cyan-2:#66e5ff;
  --ak-blue:#0a8cff;
  --ak-text:#eef8ff;
  --ak-muted:#88a3b8;
  --ak-good:#3ce6a4;
  --ak-danger:#ff6174;
  --ak-shadow:0 18px 50px rgba(0,0,0,.42);
}
*{box-sizing:border-box}
html,body{background:
  radial-gradient(circle at 72% 0%,rgba(0,130,255,.13),transparent 33%),
  radial-gradient(circle at 18% 8%,rgba(24,199,255,.10),transparent 28%),
  var(--ak-bg)!important;
  color:var(--ak-text)!important;
}
body{
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
body::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:-1;
  background-image:
    linear-gradient(rgba(24,199,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(24,199,255,.025) 1px,transparent 1px);
  background-size:36px 36px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.65),transparent 85%);
}
a{color:var(--ak-cyan)!important}
button,input,select,textarea{font:inherit}
button{transition:.18s ease}
button:hover{transform:translateY(-1px)}
.hidden{display:none!important}

/* Brand */
.ak-brand-lockup{display:flex;align-items:center;gap:10px;min-width:0}
.ak-logo-mark{
  width:34px;height:34px;border:1px solid rgba(24,199,255,.55);border-radius:10px;
  display:grid;place-items:center;color:var(--ak-cyan);font-weight:900;
  box-shadow:0 0 24px rgba(24,199,255,.16),inset 0 0 18px rgba(24,199,255,.06);
  background:linear-gradient(145deg,rgba(17,41,62,.9),rgba(4,10,16,.9));
}
.ak-brand-text{line-height:1}
.ak-brand-main{
  display:block;font-weight:900;letter-spacing:.08em;font-size:15px;
  background:linear-gradient(180deg,#fff,#9ec7dd 55%,#eaf8ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.ak-brand-main b{color:var(--ak-cyan);font-weight:900}
.ak-brand-sub{
  display:block;margin-top:5px;color:var(--ak-cyan);font-size:10px;
  letter-spacing:.38em;text-transform:uppercase;
}
.brand-row .brand-mark{display:none!important}
.brand-row>div:not(.ak-brand-lockup){display:none!important}
.brand-row{border-bottom:1px solid rgba(24,199,255,.12)!important}
.ak-sidebar-tagline{
  font-size:9px;letter-spacing:.22em;color:#66879d;text-transform:uppercase;
  margin:2px 0 10px;
}

/* Shell */
.shell{background:transparent!important}
.sidebar{
  background:linear-gradient(180deg,rgba(7,12,19,.98),rgba(4,8,13,.98))!important;
  border-right:1px solid rgba(24,199,255,.14)!important;
  box-shadow:14px 0 40px rgba(0,0,0,.16);
}
.workspace{background:transparent!important}
.topbar{
  background:rgba(5,10,16,.82)!important;
  border-bottom:1px solid rgba(24,199,255,.13)!important;
  backdrop-filter:blur(18px);
}
.composer-wrap{
  background:linear-gradient(180deg,rgba(5,8,13,.1),rgba(5,8,13,.96) 26%)!important;
}
.composer{
  background:linear-gradient(180deg,rgba(13,22,33,.96),rgba(7,13,20,.98))!important;
  border:1px solid rgba(24,199,255,.22)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.015),var(--ak-shadow),0 0 35px rgba(24,199,255,.045);
}
textarea,input,select{
  background:#0a121b!important;color:#eaf7ff!important;
  border-color:#254057!important;
}
textarea:focus,input:focus,select:focus{
  outline:none!important;border-color:var(--ak-cyan)!important;
  box-shadow:0 0 0 3px rgba(24,199,255,.10)!important;
}
.new-thread,.primary,.send-button{
  background:linear-gradient(135deg,#087bf7,#19c9ff)!important;
  color:white!important;border-color:transparent!important;
  box-shadow:0 10px 28px rgba(0,150,255,.20)!important;
}
.new-thread:hover,.primary:hover,.send-button:hover{
  filter:brightness(1.08);box-shadow:0 13px 34px rgba(0,170,255,.28)!important;
}
.activity-toggle,.secondary,.text-button,.icon-button{
  border-color:rgba(24,199,255,.14)!important;
}
.status-pill,.mode-pill,.usage-chip,.fleet-chip,.empty-badge{
  background:rgba(12,28,41,.78)!important;
  border-color:rgba(24,199,255,.18)!important;
}
.mode-pill{color:#ffd27a!important}
.activity-rail{
  background:linear-gradient(180deg,rgba(7,13,20,.98),rgba(5,9,14,.98))!important;
  border-left:1px solid rgba(24,199,255,.14)!important;
}
.activity-header,.activity-state{border-color:rgba(24,199,255,.12)!important}
.activity-pulse{box-shadow:0 0 14px rgba(60,230,164,.7)!important}
.thread-list button:hover,.thread-list .active{
  background:linear-gradient(90deg,rgba(9,130,255,.16),rgba(24,199,255,.05))!important;
  border-color:rgba(24,199,255,.18)!important;
}
.thread-heading,.eyebrow{color:var(--ak-cyan)!important;letter-spacing:.18em}

/* Empty state / home */
.empty-state{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 20% 40%,rgba(24,199,255,.10),transparent 28%),
    linear-gradient(180deg,rgba(7,13,21,.75),rgba(4,8,13,.35))!important;
}
.empty-state::before{
  content:"AI KERN";
  position:absolute;top:7%;right:4%;
  font-size:clamp(46px,8vw,128px);font-weight:950;letter-spacing:.06em;
  color:rgba(255,255,255,.018);pointer-events:none;
}
.empty-state .orb{
  border-radius:16px!important;
  background:linear-gradient(145deg,#07121e,#0d2638)!important;
  color:var(--ak-cyan)!important;
  border:1px solid rgba(24,199,255,.35)!important;
  box-shadow:0 0 35px rgba(24,199,255,.13)!important;
}
.workspace-picker{
  border:1px solid rgba(24,199,255,.18)!important;
  background:rgba(8,16,24,.78)!important;
  box-shadow:0 16px 46px rgba(0,0,0,.26)!important;
}
.suggestions button{
  background:linear-gradient(180deg,rgba(13,24,35,.98),rgba(8,14,21,.98))!important;
  border-color:rgba(24,199,255,.16)!important;
}
.suggestions button:hover{border-color:rgba(24,199,255,.45)!important}

/* Messages */
.conversation article,.conversation .message{
  border-color:rgba(24,199,255,.09)!important;
}
.conversation pre,.conversation code{background:#060b11!important}

/* Preferences */
.prefs-dialog,.tip-dialog{
  background:linear-gradient(180deg,#0c151f,#070c12)!important;
  border:1px solid rgba(24,199,255,.25)!important;
  box-shadow:0 30px 80px rgba(0,0,0,.58),0 0 50px rgba(24,199,255,.06)!important;
}
.prefs-section{border-color:rgba(24,199,255,.11)!important}

/* Login */
.login-page{
  min-height:100vh!important;
  display:grid!important;place-items:center!important;
  overflow:auto!important;
  background:
    radial-gradient(circle at 68% 18%,rgba(0,136,255,.19),transparent 25%),
    linear-gradient(110deg,#03070b 0%,#07111b 48%,#03070b 100%)!important;
}
.login-page::after{
  content:"";position:fixed;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(24,199,255,.02),transparent 30%,transparent 70%,rgba(24,199,255,.02));
}
.ak-login-shell{
  width:min(1180px,calc(100% - 34px));min-height:650px;
  display:grid;grid-template-columns:360px minmax(380px,1fr) 300px;
  border:1px solid rgba(24,199,255,.17);
  background:rgba(4,9,14,.78);
  border-radius:26px;overflow:hidden;
  box-shadow:0 40px 110px rgba(0,0,0,.58),0 0 70px rgba(24,199,255,.06);
  backdrop-filter:blur(16px);
}
.ak-login-visual{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 30% 28%,rgba(24,199,255,.14),transparent 28%),
    linear-gradient(180deg,#07121b,#03070b);
  border-right:1px solid rgba(24,199,255,.12);
}
.ak-login-visual::before{
  content:"";position:absolute;left:22px;top:26px;bottom:26px;width:1px;
  background:linear-gradient(transparent,var(--ak-cyan),transparent);
  box-shadow:0 0 18px var(--ak-cyan);
}
.ak-mascot{
  position:absolute;left:-12px;bottom:0;width:108%;max-height:88%;object-fit:contain;
  object-position:left bottom;filter:drop-shadow(0 0 20px rgba(24,199,255,.22));
}
.ak-visual-copy{
  position:absolute;left:42px;right:24px;bottom:24px;z-index:2;
  text-shadow:0 2px 18px rgba(0,0,0,.9);
}
.ak-handwrite{
  font-family:"Segoe Script","Bradley Hand",cursive;font-size:31px;color:var(--ak-cyan);
  transform:rotate(-5deg);display:inline-block;
}
.ak-visual-quote{
  margin-top:8px;font-size:10px;letter-spacing:.18em;color:#a6bdcc;text-transform:uppercase;
}
.ak-login-main{
  padding:54px clamp(32px,5vw,72px);display:flex;flex-direction:column;justify-content:center;
}
.ak-login-brand{text-align:center;margin-bottom:32px}
.ak-login-brand .ak-brand-main{font-size:clamp(34px,5vw,62px);letter-spacing:.035em}
.ak-login-brand .ak-brand-sub{font-size:15px;margin-top:10px;letter-spacing:.48em}
.ak-login-brand .ak-slogan{
  color:#a4bbca;font-size:11px;letter-spacing:.34em;margin-top:13px;text-transform:uppercase
}
.ak-login-card{
  max-width:500px;width:100%;margin:auto;
  background:linear-gradient(180deg,rgba(10,19,28,.92),rgba(7,13,20,.94));
  border:1px solid rgba(24,199,255,.24);border-radius:20px;
  padding:30px;box-shadow:0 20px 60px rgba(0,0,0,.34);
}
.ak-login-card h1{font-size:28px;margin:0 0 8px;text-align:center}
.ak-login-card .ak-lede{color:#9ab0bf;text-align:center;line-height:1.55;margin:0 0 26px}
.ak-login-card label{font-size:12px;color:#9eb4c4;margin-bottom:8px;display:block}
.ak-login-card input{
  width:100%;height:52px;border-radius:12px;padding:0 16px;margin-bottom:14px;
}
.ak-login-card button{width:100%;height:52px;border-radius:12px;font-weight:800}
.ak-login-secure{
  display:flex;gap:9px;align-items:center;justify-content:center;
  margin-top:17px;color:#7894a8;font-size:11px
}
.ak-login-secure i{width:7px;height:7px;background:var(--ak-good);border-radius:50%;box-shadow:0 0 12px var(--ak-good)}
.ak-login-side{
  padding:48px 28px;border-left:1px solid rgba(24,199,255,.12);
  display:flex;flex-direction:column;justify-content:center;gap:18px;
  background:linear-gradient(180deg,rgba(7,15,23,.65),rgba(4,8,13,.65))
}
.ak-feature{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start}
.ak-feature-icon{
  width:38px;height:38px;border:1px solid rgba(24,199,255,.25);border-radius:11px;
  display:grid;place-items:center;color:var(--ak-cyan);font-size:18px;
  background:rgba(8,25,37,.65)
}
.ak-feature strong{font-size:13px}
.ak-feature span{display:block;color:#7995a7;font-size:11px;line-height:1.45;margin-top:4px}
.ak-login-foot{
  position:fixed;left:22px;right:22px;bottom:12px;
  display:flex;justify-content:space-between;color:#587086;font-size:10px;letter-spacing:.08em
}
.login-card{display:none!important}

/* Responsive */
@media(max-width:980px){
  .ak-login-shell{grid-template-columns:250px minmax(0,1fr)}
  .ak-login-side{display:none}
}
@media(max-width:720px){
  .ak-login-shell{display:block;min-height:auto}
  .ak-login-visual{height:185px;border-right:0;border-bottom:1px solid rgba(24,199,255,.12)}
  .ak-mascot{width:210px;max-height:180px}
  .ak-visual-copy{left:205px;bottom:24px}
  .ak-handwrite{font-size:23px}
  .ak-visual-quote{display:none}
  .ak-login-main{padding:24px 18px 28px}
  .ak-login-brand{margin-bottom:18px}
  .ak-login-brand .ak-brand-main{font-size:34px}
  .ak-login-brand .ak-brand-sub{font-size:12px}
  .ak-login-card{padding:22px 18px}
  .ak-login-foot{display:none}
}

/* =========================================================
   AI KERN CODEX - großes Hauptlogo
   ========================================================= */

.brand-row {
  min-height: 98px !important;
  padding: 14px 14px 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ak-brand-lockup {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ak-main-logo {
  display: block;
  width: min(235px, 94%);
  height: auto;
  filter:
    drop-shadow(0 0 7px rgba(24,199,255,.24))
    drop-shadow(0 8px 18px rgba(0,0,0,.6));
}

.ak-logo-mark,
.ak-brand-text {
  display: none !important;
}

.ak-sidebar-tagline {
  text-align: center !important;
  margin: 0 12px 14px !important;
  font-size: 8px !important;
  letter-spacing: .34em !important;
  color: #648ba4 !important;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .brand-row {
    min-height: 82px !important;
  }

  .ak-main-logo {
    width: 200px;
  }
}


/* ==========================================================
   CODEX PREVIEW MANAGER
   ========================================================== */

.preview-manager {
  width: min(760px, 100%);
  margin: 18px auto 8px;
  padding: 16px;
  border: 1px solid rgba(24,199,255,.18);
  border-radius: 16px;
  background: linear-gradient(
    180deg,
    rgba(9,20,30,.88),
    rgba(5,11,17,.92)
  );
  box-shadow:
    0 16px 46px rgba(0,0,0,.24),
    0 0 28px rgba(24,199,255,.035);
  text-align: left;
}

.preview-manager-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.preview-manager-head .eyebrow {
  margin: 0 0 4px;
  font-size: 9px;
}

.preview-manager-head strong {
  font-size: 15px;
}

.preview-manager-actions {
  display: flex;
  gap: 7px;
}

.preview-manager-actions button,
.preview-card-actions button,
.preview-button {
  border: 1px solid rgba(24,199,255,.20);
  background: #0b1823;
  color: #dff7ff;
  border-radius: 9px;
  padding: 7px 10px;
  cursor: pointer;
  text-decoration: none;
}

#preview-create {
  background: linear-gradient(135deg,#087bf7,#19c9ff);
  border-color: transparent;
  color: #fff;
  font-weight: 700;
}

.preview-manager-note {
  margin: 9px 0 12px;
  color: var(--ak-muted);
  font-size: 12px;
}

.preview-list {
  display: grid;
  gap: 8px;
}

.preview-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 11px;
  border: 1px solid rgba(24,199,255,.12);
  border-radius: 11px;
  background: rgba(5,13,20,.75);
}

.preview-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.preview-info strong {
  color: #eef8ff;
  font-size: 13px;
}

.preview-info span {
  color: var(--ak-good);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.preview-info a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}

.preview-card-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.preview-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.preview-delete {
  color: #ff8997 !important;
  border-color: rgba(255,97,116,.20) !important;
}

.preview-empty {
  margin: 0;
  color: var(--ak-muted);
  font-size: 12px;
}

.preview-error {
  color: var(--ak-danger);
}

@media (max-width:700px) {
  .preview-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .preview-card-actions {
    width: 100%;
  }

  .preview-card-actions .preview-open {
    flex: 1;
  }
}

/* ==================================================
   PERLE PRODUCTION RELEASE
   ================================================== */

.release-manager {
  margin-bottom: 18px;
}

.release-state {
  font-size: 12px;
  font-weight: 800;
  opacity: .85;
}

.release-protection {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 12px;
}

.release-protection span {
  font-size: 11px;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
}

.release-paths {
  display: grid;
  gap: 6px;
  margin: 12px 0;
}

.release-paths div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.release-paths span {
  width: 42px;
  font-size: 10px;
  font-weight: 900;
  opacity: .65;
}

.release-paths code {
  font-size: 12px;
}

.release-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.release-actions button {
  cursor: pointer;
}

.release-actions button:disabled {
  cursor: wait;
  opacity: .5;
}

.release-production {
  font-weight: 900;
}

.release-output {
  box-sizing: border-box;
  width: 100%;
  max-height: 330px;
  overflow: auto;
  margin-top: 12px;
  padding: 12px;
  border-radius: 10px;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 11px;
  line-height: 1.5;
}

.release-output.hidden {
  display: none;
}

@media (max-width: 700px) {
  .release-actions {
    display: grid;
  }

  .release-actions button {
    width: 100%;
  }
}

/* =========================================================
   PERLE PRODUCTION RELEASE V2
   ========================================================= */

.release-manager-v2 {
  width: min(900px, calc(100% - 32px));
  box-sizing: border-box;
  margin: 30px auto 38px;
  padding: 30px;
  border-radius: 20px;
}

.release-hero {
  position: relative;
  text-align: center;
  padding: 4px 150px 10px;
}

.release-hero h2 {
  margin: 5px 0 9px;
  font-size: 28px;
}

.release-hero > p:not(.eyebrow) {
  margin: 0;
  line-height: 1.55;
  opacity: .72;
}

.release-hero .release-state {
  position: absolute;
  top: 5px;
  right: 0;
}

.release-state {
  display: inline-flex;
  align-items: center;
  padding: 7px 11px;
  border: 1px solid rgba(80, 200, 255, .22);
  border-radius: 999px;
  font-size: 12px;
}

.release-state.is-success {
  border-color: rgba(0, 230, 150, .4);
}

.release-state.is-error {
  border-color: rgba(255, 90, 90, .45);
}

.release-manager-v2 .release-protection {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 9px;
  margin: 23px 0;
}

.release-manager-v2 .release-protection span {
  padding: 9px 8px;
  text-align: center;
  white-space: nowrap;
  border: 1px solid rgba(0, 220, 160, .22);
  border-radius: 999px;
  background: rgba(0, 180, 130, .055);
  font-size: 11px;
}

.release-route {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin: 25px 0;
}

.release-endpoint {
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(60, 190, 255, .18);
  border-radius: 14px;
  background: rgba(0, 20, 34, .38);
}

.release-endpoint strong,
.release-endpoint code {
  display: block;
}

.release-endpoint strong {
  margin: 6px 0 7px;
  font-size: 15px;
}

.release-endpoint code {
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 10px;
  opacity: .65;
}

.release-label {
  font-size: 10px;
  letter-spacing: .09em;
  opacity: .7;
}

.release-arrow {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(60, 190, 255, .2);
  border-radius: 50%;
  font-size: 22px;
}

.release-actions-v2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 22px 0;
}

.release-actions-v2 button {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  border-radius: 13px;
}

.release-actions-v2 button > span:last-child {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.release-actions-v2 button strong {
  font-size: 13px;
}

.release-actions-v2 button small {
  font-size: 10px;
  opacity: .65;
}

.release-button-icon {
  font-size: 23px;
}

.release-console {
  margin-top: 22px;
  overflow: hidden;
  border: 1px solid rgba(60, 190, 255, .18);
  border-radius: 14px;
}

.release-console-head {
  display: flex;
  justify-content: space-between;
  padding: 11px 14px;
  border-bottom: 1px solid rgba(60, 190, 255, .12);
  font-size: 11px;
}

.release-console-head span {
  opacity: .55;
}

.release-console pre {
  box-sizing: border-box;
  width: 100%;
  min-height: 115px;
  max-height: 340px;
  margin: 0;
  padding: 16px;
  overflow: auto;
  white-space: pre-wrap;
  font-size: 11px;
  line-height: 1.55;
  background: rgba(0, 8, 14, .45);
}

@media (max-width: 1000px) {

  .release-manager-v2 .release-protection {
    grid-template-columns: 1fr 1fr;
  }

  .release-hero {
    padding-left: 0;
    padding-right: 0;
  }

  .release-hero .release-state {
    position: static;
    margin-top: 14px;
  }
}

@media (max-width: 700px) {

  .release-route {
    grid-template-columns: 1fr;
  }

  .release-arrow {
    margin: auto;
    transform: rotate(90deg);
  }

  .release-actions-v2,
  .release-manager-v2 .release-protection {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   RELEASE VIEWPORT / SCROLL FIX
   ========================================================= */

/* Hauptinhalt darf innerhalb des App-Fensters scrollen */
main,
.main-content,
.chat-main,
.chat-content,
.workspace-main {
  min-height: 0;
}

/* Release-Karte etwas kompakter */
.release-manager-v2 {
  width: min(900px, calc(100% - 40px));
  margin: 22px auto 110px;
  padding: 24px 28px;
}

/* weniger unnötige Höhe im Kopf */
.release-hero {
  padding-top: 0;
  padding-bottom: 4px;
}

.release-manager-v2 .release-protection {
  margin: 18px 0;
}

.release-route {
  margin: 18px 0;
}

.release-actions-v2 {
  margin: 18px 0;
}

/* Unterhalb der Karte genug Platz für die feste Eingabezeile */
#perle-release-manager {
  scroll-margin-bottom: 120px;
}

/* Der zentrale Seitenbereich selbst bekommt Scroll */
body {
  overflow: hidden;
}

.app-main,
.main-column,
.center-column,
.workspace,
.workspace-content {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}


/* =========================================================
   PERLE RELEASE – FINAL MAIN-PANE SCROLL FIX
   ========================================================= */

/*
 * Der echte Inhaltscontainer ist .main-pane.
 * Er muss zwischen Header und Composer scrollen können.
 */
.main-pane {
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain;
  scrollbar-gutter: stable;
}

/*
 * Im Startbildschirm darf der Inhalt höher als der
 * sichtbare Bereich werden.
 */
.main-pane > .empty-state {
  min-height: min-content !important;
  height: auto !important;
  overflow: visible !important;

  /*
   * Platz unter dem Releasebereich, damit die feste
   * Eingabezeile nichts mehr verdeckt.
   */
  padding-bottom: 150px !important;
}

/*
 * Releasekarte selbst nicht abschneiden.
 */
#perle-release-manager {
  flex: 0 0 auto !important;
  overflow: visible !important;
  margin-bottom: 40px !important;
}

/*
 * Die Konsole innerhalb der Karte darf weiterhin
 * separat scrollen, wenn sehr viel Log ausgegeben wird.
 */
#perle-release-output {
  overflow: auto !important;
  max-height: 340px !important;
}

/*
 * Scrollbar passend zum Codex-Design.
 */
.main-pane::-webkit-scrollbar {
  width: 8px;
}

.main-pane::-webkit-scrollbar-track {
  background: transparent;
}

.main-pane::-webkit-scrollbar-thumb {
  background: rgba(24, 199, 255, .20);
  border-radius: 999px;
}

.main-pane::-webkit-scrollbar-thumb:hover {
  background: rgba(24, 199, 255, .36);
}