.phone-app-grid .app-icon.share {
  background: #d7563d;
}

.live-share-phone-intro,
.live-share-call-card {
  margin: 12px;
  border: 1px solid #c6d4c5;
  border-radius: 17px;
  padding: 14px;
  background: #fffdf8;
}

.live-share-phone-intro > i,
.live-share-call-card > header > i {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: #d7563d;
  color: white;
}

.live-share-phone-intro svg,
.live-share-call-card svg {
  width: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.live-share-phone-intro h3 {
  margin: 12px 0 5px;
  font: 700 1.4rem Georgia, serif;
}

.live-share-phone-intro p,
.live-share-safety {
  color: #65766d;
  font-size: .82rem;
  line-height: 1.45;
}

.live-share-contact-list {
  padding: 0 12px;
}

.live-share-contact-list article,
.live-share-call-card > header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.live-share-contact-list article {
  justify-content: space-between;
  border-top: 1px solid #d5ded2;
  padding: 11px 0;
}

.live-share-contact-list span,
.live-share-call-card > header span {
  display: grid;
}

.live-share-contact-list article > div {
  display: grid;
  gap: 5px;
}

.live-share-contact-list article > div button:last-child {
  background: #df754d;
}

.live-share-call-card > header span {
  flex: 1;
}

.live-share-contact-list button,
.live-share-call-card button {
  border: 0;
  border-radius: 9px;
  background: #287257;
  color: white;
  padding: 9px 11px;
  font-weight: 800;
}

.live-share-call-card > div {
  display: grid;
  gap: 9px;
  margin-top: 12px;
}

.live-share-call-card label {
  display: grid;
  gap: 5px;
  font-size: .75rem;
  font-weight: 800;
}

.live-share-call-card input,
.live-share-call-card select {
  width: 100%;
  padding: 10px;
  border: 1px solid #b7c9b7;
  border-radius: 9px;
  background: white;
}

.live-share-call-card button.danger {
  background: #a74b3e;
}

.live-share-choice {
  display: flex !important;
  gap: 8px;
}

.live-share-choice button {
  flex: 1;
}

.live-share-active span {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #ef6849;
}

.live-share-request {
  border-radius: 8px;
  padding: 8px;
  background: #fff1bd;
}

.live-share-safety {
  padding: 0 14px;
}

.admin-share-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 10px;
}

.admin-live-collaboration article {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.admin-live-collaboration article div {
  display: grid;
  flex: 1;
  gap: 3px;
}

.admin-live-collaboration time {
  font-weight: 800;
}

.live-share-dot.inactive {
  background: #8a958f;
  box-shadow: none;
  animation: none;
}

.workspace-module-tabs {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 8px 12px;
  border-bottom: 1px solid #d2ddcf;
  background: #fffdf8;
}

.workspace-module-tabs button {
  border: 1px solid #b6cbbb;
  border-radius: 999px;
  padding: 6px 10px;
  background: white;
  color: #204d3e;
  font-weight: 800;
}

.workspace-module-tabs button.active {
  border-color: #287257;
  background: #287257;
  color: white;
}

.phone-toggle.phone-ringing {
  overflow: visible;
  border-color: #ffe9a6;
  background: #d7563d;
  box-shadow: 0 10px 30px #d7563d80, 0 0 0 7px #ffd76555;
  animation: incomingPhoneBounce .72s ease-in-out infinite;
}

.phone-toggle.phone-share-request {
  overflow: visible;
  border-color: #fff0a5;
  background: #e68445;
  box-shadow: 0 10px 30px #e6844570, 0 0 0 7px #ffe58a55;
  animation: incomingPhoneBounce .9s ease-in-out infinite;
}

.phone-toggle.phone-ringing::before {
  content: "INCOMING LIVE SHARE CALL";
  position: absolute;
  right: 0;
  bottom: calc(100% + 10px);
  width: max-content;
  border: 2px solid #173e34;
  border-radius: 10px;
  padding: 7px 10px;
  background: #fff7d9;
  color: #173e34;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
}

.phone-toggle.phone-share-request::before {
  content: "WORKSPACE REQUEST — REVIEW NOW";
  position: absolute;
  right: 0;
  bottom: calc(100% + 10px);
  width: max-content;
  border: 2px solid #173e34;
  border-radius: 10px;
  padding: 7px 10px;
  background: #fff7d9;
  color: #173e34;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
}

@keyframes incomingPhoneBounce {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  35% { transform: translateY(-15px) rotate(3deg); }
  55% { transform: translateY(-5px) rotate(-3deg); }
  75% { transform: translateY(-12px) rotate(2deg); }
}

@media (prefers-reduced-motion: reduce) {
  .phone-toggle.phone-ringing,
  .phone-toggle.phone-share-request { animation: incomingPhonePulse 1.2s ease-in-out infinite; }
  @keyframes incomingPhonePulse { 50% { box-shadow: 0 10px 30px #d7563d80, 0 0 0 12px #ffd76511; } }
}