/* ============ Оболонка прототипу: сторінка + рамка телефону ============ */
:root{
  --page:#F4F4F7;
  --page-ink:#15151A;
  --page-muted:#6E7180;
  --page-line:#E2E2E9;
  --brand:#02066F;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;background:var(--page);color:var(--page-ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
}
button{font:inherit;color:inherit}

.stage{
  min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:18px;padding:24px 16px;
}
.phone-wrap{transform-origin:top left;flex:none}
.phone{
  width:426px;height:898px;background:#fff;border-radius:54px;position:relative;overflow:hidden;
  border:12px solid #0C0C11;
  box-shadow:0 34px 70px -24px rgba(15,15,23,.45), 0 0 0 2.5px #303039;
  display:flex;flex-direction:column;
}
.phone__island{
  position:absolute;top:11px;left:50%;transform:translateX(-50%);
  width:118px;height:33px;background:#0C0C11;border-radius:99px;z-index:40;
}
.phone__status{
  position:absolute;top:0;left:0;right:0;height:56px;z-index:35;pointer-events:none;
  display:flex;align-items:center;justify-content:space-between;padding:6px 30px 0;color:#15151A;
}
.phone__time{font-size:15px;font-weight:640;letter-spacing:-.01em}
.phone__icons{display:flex;align-items:center;gap:6px}
.si{height:12px;fill:currentColor;opacity:.92}
.si:first-child{width:18px}.si:nth-child(2){width:16px}.si:last-child{width:26px}
.phone__viewport{flex:1;position:relative;overflow:hidden;background:#fff}
.phone__viewport:has(.scr--welcome){background:#0B0B0F}
.phone__home{
  position:absolute;bottom:8px;left:50%;transform:translateX(-50%);
  width:138px;height:5px;border-radius:99px;background:rgba(15,15,23,.3);z-index:45;
  pointer-events:none;transition:background .2s;
}
.phone:has(.scr--welcome) .phone__home{background:#fff}
.phone:has(.scr--welcome) .phone__status{color:#15151A}

@media (max-width:520px){
  .stage{padding:12px 8px}
}

/* посилання на головну робочого простору */
.tohub{
  position:fixed;top:16px;left:20px;z-index:50;
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:999px;
  background:#fff;border:1px solid #EDEEF3;
  font:600 13px/1 'Inter',-apple-system,sans-serif;color:#02066F;text-decoration:none;
  transition:border-color .15s;
}
.tohub:hover{border-color:#D5D6DE}

/* вбудований режим: без службового посилання й зайвих полів */
.is-embedded .tohub{display:none}
.is-embedded .stage{padding:4px}