/* TEMPMY_LIGHT_IDENTITY_V1 */
:root{
  --tm-orange:#ff8a1f;
  --tm-orange-hover:#f97316;
  --tm-orange-soft:#fff0e0;
  --tm-orange-line:#ffd7ad;
  --tm-bg:#fffaf4;
  --tm-bg-2:#f8fafc;
  --tm-white:#ffffff;
  --tm-text:#111827;
  --tm-muted:#64748b;
  --tm-border:#e5e7eb;
  --tm-border-2:#f1f5f9;
  --tm-blue:#2563eb;
  --tm-blue-soft:#eaf2ff;
  --tm-green:#16a34a;
  --tm-green-soft:#eafaf1;
  --tm-red:#dc2626;
  --tm-red-soft:#fff1f2;
  --tm-yellow:#b7791f;
  --tm-yellow-soft:#fff7ed;
  --tm-shadow:0 18px 55px rgba(17,24,39,.08);
  --tm-shadow-soft:0 8px 24px rgba(17,24,39,.06);
  --tm-radius:24px;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:
    radial-gradient(circle at top left,rgba(255,138,31,.18),transparent 28rem),
    linear-gradient(180deg,#fffaf4 0%,#ffffff 42%,#f8fafc 100%);
  color:var(--tm-text);
}
a{color:inherit}
.tm-light-page{max-width:1180px;margin:0 auto;padding:28px 16px 60px}
.tm-light-nav{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:rgba(255,255,255,.78);border:1px solid var(--tm-border);
  border-radius:999px;padding:10px 12px 10px 14px;box-shadow:var(--tm-shadow-soft);
  backdrop-filter:blur(14px);margin-bottom:34px;
}
.tm-light-brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:-.03em}
.tm-light-logo{
  width:38px;height:38px;border-radius:14px;background:var(--tm-orange);color:#fff;
  display:grid;place-items:center;font-weight:950;box-shadow:0 8px 20px rgba(255,138,31,.28)
}
.tm-light-links{display:flex;gap:8px;flex-wrap:wrap}
.tm-light-link{
  color:var(--tm-muted);text-decoration:none;font-size:14px;font-weight:750;
  padding:9px 12px;border-radius:999px
}
.tm-light-link:hover{background:var(--tm-orange-soft);color:var(--tm-orange-hover)}
.tm-light-hero{
  display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:stretch;margin-bottom:22px
}
.tm-light-card{
  background:rgba(255,255,255,.92);border:1px solid var(--tm-border);
  border-radius:var(--tm-radius);box-shadow:var(--tm-shadow);overflow:hidden
}
.tm-light-card-body{padding:28px}
.tm-light-kicker{
  display:inline-flex;gap:8px;align-items:center;background:var(--tm-orange-soft);
  color:var(--tm-orange-hover);border:1px solid var(--tm-orange-line);
  border-radius:999px;padding:7px 11px;font-size:13px;font-weight:850;margin-bottom:16px
}
.tm-light-title{
  font-size:54px;line-height:1.02;letter-spacing:-.06em;margin:0 0 16px;font-weight:950
}
.tm-light-subtitle{font-size:18px;line-height:1.7;color:var(--tm-muted);max-width:620px;margin:0}
.tm-light-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.tm-light-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;
  border-radius:999px;padding:12px 18px;font-weight:850;border:1px solid var(--tm-border);
  background:#fff;box-shadow:var(--tm-shadow-soft);cursor:pointer
}
.tm-light-btn-primary{
  background:var(--tm-orange);border-color:var(--tm-orange);color:#fff;
  box-shadow:0 10px 25px rgba(255,138,31,.26)
}
.tm-light-btn-danger{color:var(--tm-red);background:var(--tm-red-soft);border-color:#fecdd3}
.tm-light-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.tm-light-badge{
  display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;
  font-size:12px;font-weight:850;border:1px solid var(--tm-border);color:var(--tm-muted);background:#fff
}
.tm-light-badge-orange{background:var(--tm-orange-soft);color:var(--tm-orange-hover);border-color:var(--tm-orange-line)}
.tm-light-badge-green{background:var(--tm-green-soft);color:var(--tm-green);border-color:#bbf7d0}
.tm-light-badge-blue{background:var(--tm-blue-soft);color:var(--tm-blue);border-color:#bfdbfe}
.tm-light-preview{
  padding:20px;background:linear-gradient(180deg,#fff,#f8fafc);display:grid;gap:12px
}
.tm-light-email{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#fff;border:1px solid var(--tm-border);border-radius:20px;padding:14px 16px
}
.tm-light-email strong{font-size:15px}
.tm-light-icon{
  width:42px;height:42px;border-radius:15px;display:grid;place-items:center;
  background:var(--tm-orange-soft);color:var(--tm-orange-hover);border:1px solid var(--tm-orange-line)
}
.tm-light-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:22px}
.tm-light-section-title{font-size:26px;font-weight:950;letter-spacing:-.04em;margin:34px 0 16px}
.tm-light-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tm-light-swatch{background:#fff;border:1px solid var(--tm-border);border-radius:18px;padding:12px;box-shadow:var(--tm-shadow-soft)}
.tm-light-color{height:42px;border-radius:14px;margin-bottom:10px;border:1px solid rgba(0,0,0,.04)}
.tm-light-small{font-size:13px;color:var(--tm-muted);line-height:1.55}
.tm-light-component{display:grid;gap:12px}
.tm-light-message{
  display:block;text-decoration:none;background:#fff;border:1px solid var(--tm-border);
  border-radius:18px;padding:14px;box-shadow:var(--tm-shadow-soft)
}
.tm-light-message-top{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px}
.tm-light-from{font-weight:900}
.tm-light-time{font-size:12px;color:var(--tm-muted);white-space:nowrap}
.tm-light-subject{font-weight:900;margin-bottom:6px}
.tm-light-snippet{font-size:13px;color:var(--tm-muted);line-height:1.55}
.tm-light-search{
  width:100%;border:1px solid var(--tm-border);background:#fff;border-radius:16px;
  padding:13px 14px;outline:none;font:inherit;box-shadow:var(--tm-shadow-soft)
}
.tm-light-message-frame{
  background:#fff;border:1px solid var(--tm-border);border-radius:20px;padding:22px;
  min-height:230px;line-height:1.7;box-shadow:var(--tm-shadow-soft)
}
.tm-light-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tm-light-stat{background:#fff;border:1px solid var(--tm-border);border-radius:18px;padding:16px;box-shadow:var(--tm-shadow-soft)}
.tm-light-stat-num{font-size:26px;font-weight:950;letter-spacing:-.04em}
.tm-light-stat-label{font-size:12px;color:var(--tm-muted);margin-top:4px}
.tm-light-ad{
  background:var(--tm-bg-2);border:1px dashed #cbd5e1;color:#94a3b8;
  border-radius:20px;padding:20px;text-align:center;font-size:13px;font-weight:750
}
.tm-light-asset-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tm-light-asset{
  background:#fff;border:1px solid var(--tm-border);border-radius:18px;padding:14px;
  min-height:112px;box-shadow:var(--tm-shadow-soft)
}
.tm-light-appicon{
  width:64px;height:64px;border-radius:20px;background:var(--tm-orange);color:#fff;
  display:grid;place-items:center;font-size:28px;font-weight:950;
  box-shadow:0 12px 26px rgba(255,138,31,.28);margin-bottom:10px
}
@media(max-width:940px){
  .tm-light-hero,.tm-light-grid{grid-template-columns:1fr}
  .tm-light-palette,.tm-light-stats,.tm-light-asset-grid{grid-template-columns:repeat(2,1fr)}
  .tm-light-title{font-size:42px}
}
@media(max-width:640px){
  .tm-light-page{padding:18px 12px 46px}
  .tm-light-nav{border-radius:24px;align-items:flex-start;flex-direction:column}
  .tm-light-title{font-size:34px}
  .tm-light-palette,.tm-light-stats,.tm-light-asset-grid{grid-template-columns:1fr}
  .tm-light-card-body{padding:20px}
}
/* TEMPMY_LIGHT_MOBILE_POLISH_V1 */
@media(max-width:640px){
  body{
    background:linear-gradient(180deg,#fff7ed 0%,#fff 45%,#f8fafc 100%);
  }

  .tm-light-page{
    padding:18px 12px 110px;
  }

  .tm-light-nav{
    padding:14px;
    gap:14px;
    border-radius:28px;
    margin-bottom:22px;
  }

  .tm-light-brand{
    width:100%;
    font-size:22px;
  }

  .tm-light-logo{
    width:56px;
    height:56px;
    border-radius:18px;
    font-size:22px;
  }

  .tm-light-links{
    width:100%;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
  }

  .tm-light-link{
    text-align:center;
    font-size:15px;
    padding:10px 8px;
    background:#fff;
    border:1px solid var(--tm-border);
  }

  .tm-light-card{
    border-radius:28px;
  }

  .tm-light-card-body{
    padding:22px;
  }

  .tm-light-kicker{
    font-size:13px;
    margin-bottom:18px;
  }

  .tm-light-title{
    font-size:38px;
    line-height:1.04;
    letter-spacing:-.065em;
  }

  .tm-light-subtitle{
    font-size:18px;
    line-height:1.65;
  }

  .tm-light-email{
    border-radius:22px;
    padding:16px;
  }

  .tm-light-email strong{
    font-size:18px;
    word-break:break-all;
  }

  .tm-light-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .tm-light-btn{
    padding:14px 16px;
    font-size:16px;
  }

  .tm-light-btn-primary{
    box-shadow:0 14px 28px rgba(255,138,31,.28);
  }

  .tm-light-hero{
    gap:18px;
  }

  .tm-light-stats{
    grid-template-columns:1fr 1fr !important;
  }

  .tm-light-message{
    border-radius:20px;
    padding:16px;
  }

  .tm-light-ad{
    margin-bottom:24px;
  }
}
/* TEMPMY_LIGHT_INBOX_UX_AUDIT_POLISH_V2 */
.tm-light-inbox-shell{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:18px;
  align-items:start;
}
.tm-light-compact-hero .tm-light-title{
  font-size:42px;
}
.tm-light-compact-hero .tm-light-subtitle{
  font-size:16px;
}
.tm-light-action-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:14px;
}
.tm-light-action-btn{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  border:1px solid var(--tm-border);
  background:#fff;
  border-radius:18px;
  padding:13px 8px;
  text-decoration:none;
  font-weight:900;
  box-shadow:var(--tm-shadow-soft);
}
.tm-light-action-btn strong{
  font-size:14px;
}
.tm-light-action-btn span{
  font-size:20px;
  line-height:1;
}
.tm-light-action-primary{
  background:var(--tm-orange);
  border-color:var(--tm-orange);
  color:#fff;
  box-shadow:0 12px 24px rgba(255,138,31,.24);
}
.tm-light-inbox-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.tm-light-mini-trust{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-top:14px;
}
.tm-light-mini-trust .tm-light-badge{
  justify-content:center;
}
@media(max-width:860px){
  .tm-light-inbox-shell{
    grid-template-columns:1fr;
  }
}
@media(max-width:640px){
  .tm-light-nav{
    margin-bottom:14px;
  }
  .tm-light-inbox-shell{
    gap:14px;
  }
  .tm-light-compact-hero .tm-light-title{
    font-size:32px;
    letter-spacing:-.06em;
  }
  .tm-light-compact-hero .tm-light-subtitle{
    font-size:15px;
    line-height:1.5;
  }
  .tm-light-kicker{
    margin-bottom:12px;
  }
  .tm-light-action-row{
    grid-template-columns:repeat(4,1fr);
    gap:8px;
  }
  .tm-light-action-btn{
    border-radius:16px;
    padding:11px 5px;
  }
  .tm-light-action-btn strong{
    font-size:12px;
  }
  .tm-light-action-btn span{
    font-size:18px;
  }
  .tm-light-mini-trust{
    grid-template-columns:1fr 1fr;
  }
  .tm-light-inbox-head{
    align-items:flex-start;
    flex-direction:column;
  }
}
/* TEMPMY_LIGHT_INBOX_ACTION_FIX_V3 */
.tm-light-action-row{
  display:grid !important;
  grid-template-columns:repeat(2,1fr) !important;
  gap:10px !important;
  margin-top:14px !important;
}
.tm-light-action-row a,
.tm-light-action-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  text-decoration:none !important;
  border:1px solid var(--tm-border) !important;
  background:#fff !important;
  color:var(--tm-text) !important;
  border-radius:18px !important;
  padding:14px 10px !important;
  font-weight:900 !important;
  box-shadow:var(--tm-shadow-soft) !important;
  line-height:1 !important;
}
.tm-light-action-row a span,
.tm-light-action-btn span{
  font-size:18px !important;
  line-height:1 !important;
}
.tm-light-action-row a strong,
.tm-light-action-btn strong{
  font-size:15px !important;
  line-height:1 !important;
}
.tm-light-action-row .tm-light-action-primary{
  background:var(--tm-orange) !important;
  border-color:var(--tm-orange) !important;
  color:#fff !important;
  box-shadow:0 12px 24px rgba(255,138,31,.26) !important;
}
@media(max-width:640px){
  .tm-light-page{padding:14px 12px 120px !important}
  .tm-light-nav{margin-bottom:14px !important}
  .tm-light-card-body{padding:20px !important}
  .tm-light-compact-hero .tm-light-title{font-size:34px !important}
  .tm-light-compact-hero .tm-light-subtitle{font-size:16px !important;line-height:1.5 !important}
  .tm-light-email{margin-top:16px !important}
  .tm-light-action-row{
    grid-template-columns:repeat(2,1fr) !important;
  }
}

/* ======================================================
   TEMPMY_LIGHT_INBOX_MOBILE_EXPERIENCE_V4
   Mobile-first improvements for light-inbox.html
   ====================================================== */

/* Inbox actions grid - 2x2 on mobile */
.inbox-actions-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin: 1.25rem 0;
    width: 100%;
}

.btn-action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.9rem 0.5rem;
    border-radius: 12px;
    border: 1.5px solid #e2e4e8;
    background: #ffffff;
    color: #1a2634;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 0.95rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    touch-action: manipulation;
    width: 100%;
    min-height: 56px;
}

.btn-action:active {
    transform: scale(0.97);
}

.btn-copy {
    background: #ff8a1f;
    border-color: #ff8a1f;
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(255, 138, 31, 0.25);
}

.btn-copy:active {
    background: #e67812;
    border-color: #e67812;
}

.btn-share {
    background: #f0f4f9;
    border-color: #e2e4e8;
    color: #1a2634;
}

.btn-share:active {
    background: #e6ecf2;
}

.btn-change {
    background: #ffffff;
    border-color: #e2e4e8;
    color: #1a2634;
}

.btn-change:active {
    background: #f5f6f7;
}

.btn-delete {
    background: #fef1f1;
    border-color: #fcd5d5;
    color: #bc3e4a;
}

.btn-delete:active {
    background: #fce8e8;
}

.action-icon {
    font-size: 1.1rem;
    line-height: 1;
}

/* Mobile nav compact */
.mobile-nav-compact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 1rem;
}

.mobile-nav-compact .logo-small {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1a2634;
    text-decoration: none;
}

.mobile-nav-compact .logo-small span {
    color: #ff8a1f;
}

/* Email card - high visibility */
.email-card-main {
    background: #ffffff;
    border-radius: 20px;
    padding: 1.5rem 1.25rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.03);
    margin-bottom: 1.25rem;
}

.email-address-display {
    font-size: 1.1rem;
    font-weight: 600;
    color: #1a2634;
    word-break: break-all;
    padding: 0.5rem 0;
    letter-spacing: -0.01em;
}

/* Bottom padding for iPhone Safari */
.iphone-safe-bottom {
    padding-bottom: env(safe-area-inset-bottom, 1.5rem);
    padding-bottom: 1.5rem;
}

/* Ad-safe - after content */
.ad-safe-after-content {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid #f0f0f0;
}

/* Responsive adjustments */
@media (min-width: 640px) {
    .inbox-actions-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 0.75rem;
    }
    
    .btn-action {
        padding: 0.8rem 0.5rem;
        min-height: 48px;
        font-size: 0.9rem;
    }
}

@media (max-width: 380px) {
    .btn-action {
        font-size: 0.85rem;
        padding: 0.7rem 0.3rem;
        min-height: 48px;
    }
    
    .action-icon {
        font-size: 1rem;
    }
    
    .email-address-display {
        font-size: 1rem;
    }
}

/* Touch-friendly tap feedback */
@media (hover: none) and (pointer: coarse) {
    .btn-action {
        -webkit-touch-callout: none;
    }
}

/* High contrast focus state for accessibility */
.btn-action:focus-visible {
    outline: 2px solid #ff8a1f;
    outline-offset: 2px;
}

