body{
  margin:0;
  font-family:"Arial",sans-serif;
  color:#101828;
  background:radial-gradient(circle at 12% 10%,rgba(243,106,8,.08),transparent 28%),linear-gradient(180deg,#fffdfd,#f5eeee);
}

.ty-shell{
  width:min(1120px,calc(100% - 24px));
  margin:0 auto;
  padding:22px 0 32px;
}

.ty-hero,
.ty-card{
  border:1px solid rgba(16,24,40,.09);
  background:rgba(255,255,255,.96);
  border-radius:20px;
  box-shadow:0 14px 34px rgba(16,24,40,.07);
}

.ty-hero{
  padding:24px;
  margin-bottom:14px;
  background:linear-gradient(135deg,rgba(243,106,8,.08),rgba(255,255,255,.98) 42%,rgba(255,248,247,.98));
}

.ty-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(243,106,8,.08);
  color:#f36a08;
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ty-hero h1,
.ty-card h2{
  margin:0;
  color:#101828;
  font-weight:700;
  letter-spacing:0;
}

.ty-hero h1{
  font-size:clamp(1.7rem,4vw,2.6rem);
  line-height:1.08;
}

.ty-hero p,
.ty-muted{
  max-width:680px;
  margin:10px 0 0;
  color:#667085;
  font-size:14px;
  line-height:1.65;
  font-weight:500;
}

.ty-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.ty-btn{
  border:0;
  border-radius:13px;
  padding:11px 14px;
  background:linear-gradient(135deg,#f36a08,#d95700);
  color:#fff;
  font:inherit;
  font-size:13px;
  font-weight:700;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
}

.ty-btn-light{
  background:#fff;
  color:#f36a08;
  border:1px solid rgba(243,106,8,.16);
}

.ty-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.ty-card{
  padding:18px;
}

.ty-wide{
  grid-column:1/-1;
}

.ty-slip-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:14px;
  border-bottom:1px solid rgba(16,24,40,.08);
}

.ty-label,
.ty-rows span,
.ty-total span{
  display:block;
  color:#667085;
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ty-slip-head strong{
  display:block;
  margin-top:4px;
  font-size:24px;
  line-height:1;
  color:#101828;
  font-weight:700;
}

.ty-paid{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 11px;
  border-radius:999px;
  background:#ecfdf3;
  color:#067647;
  font-size:12px;
  font-weight:700;
}

.ty-total{
  margin:16px 0;
  padding:14px;
  border-radius:16px;
  background:rgba(243,106,8,.08);
}

.ty-total strong{
  display:block;
  margin-top:5px;
  color:#f36a08;
  font-size:28px;
  line-height:1;
  font-weight:700;
}

.ty-rows,
.ty-gear-list{
  display:grid;
  gap:9px;
  margin-top:14px;
}

.ty-rows div,
.ty-gear-list div{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:9px;
  border-bottom:1px solid rgba(16,24,40,.07);
}

.ty-rows div:last-child,
.ty-gear-list div:last-child{
  border-bottom:0;
  padding-bottom:0;
}

.ty-rows strong,
.ty-gear-list strong{
  color:#101828;
  font-size:13px;
  line-height:1.45;
  font-weight:600;
  text-align:right;
}

.ty-empty{
  max-width:680px;
  margin:36px auto;
  padding:24px;
}

@media (max-width:760px){
  .ty-grid{grid-template-columns:1fr}
  .ty-hero,.ty-card{border-radius:16px}
  .ty-card{padding:15px}
  .ty-rows div,.ty-gear-list div{display:grid;gap:4px}
  .ty-rows strong,.ty-gear-list strong{text-align:left}
}

@media print{
  .rh-header,.rhf-footer,.ty-actions{display:none!important}
  body{background:#fff}
  .ty-shell{width:100%;padding:0}
  .ty-hero,.ty-card{box-shadow:none;break-inside:avoid}
}