#rdl-app {
    --ink:#2b2b2b;
    --ink-soft:#3d3d3a;
    --orange:#e2792e;
    --orange-dark:#bd5f1c;
    --blue:#2f5fa8;
    --paper:#ffffff;
    --paper-soft:#f6f5f2;
    --text:#26251f;
    --text-mute:#6b6a63;
    --line:#e4e1da;
    --good:#2f7a4d;
  }
#rdl-app * {box-sizing:border-box;}
#rdl-app {
    margin:0;
    font-family:'Inter',sans-serif;
    background:var(--paper-soft);
    color:var(--text);
  }
#rdl-app .wrap {
    max-width:760px;
    margin:0 auto;
    padding:24px 20px 48px;
  }
#rdl-app .topbar {
    background:linear-gradient(180deg,var(--ink) 0%, var(--ink-soft) 100%);
    border-radius:16px;
    padding:26px 26px 30px;
    margin-bottom:22px;
    position:relative;
    overflow:hidden;
  }
#rdl-app .topbar::after {
    content:"";
    position:absolute;
    right:-60px; top:-60px;
    width:220px; height:220px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(226,121,46,0.18) 0%, transparent 70%);
  }
#rdl-app .brand-row {
    display:flex; align-items:center; gap:14px;
    position:relative; z-index:1;
  }
#rdl-app .brand-mark {
    width:52px; height:52px; border-radius:10px;
    background:#fff;
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
    padding:6px;
  }
#rdl-app .brand-mark img {width:100%; height:100%; object-fit:contain; display:block;}
#rdl-app .brand-text h1 {
    font-family:'Oswald',sans-serif;
    font-weight:700;
    font-size:1.4rem;
    letter-spacing:0.03em;
    color:#fff;
    margin:0;
    text-transform:uppercase;
    line-height:1.15;
  }
#rdl-app .brand-text p {
    margin:3px 0 0;
    color:#c9c7c0;
    font-size:0.78rem;
    letter-spacing:0.02em;
    line-height:1.4;
  }
#rdl-app .tool-title {
    margin:20px 0 0;
    position:relative; z-index:1;
  }
#rdl-app .tool-title h2 {
    font-family:'Oswald',sans-serif;
    color:var(--orange);
    text-transform:uppercase;
    font-size:1.02rem;
    letter-spacing:0.06em;
    margin:0 0 4px;
    border-left:3px solid var(--orange);
    padding-left:10px;
  }
#rdl-app .tool-title p {
    color:#d8d6cf;
    font-size:0.83rem;
    margin:0 0 0 13px;
    line-height:1.45;
  }
#rdl-app .card {
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:10px;
    padding:22px 22px 24px;
    margin-bottom:20px;
    box-shadow:0 1px 2px rgba(0,0,0,0.03);
  }
#rdl-app .card h3 {
    font-family:'Oswald',sans-serif;
    font-size:0.78rem;
    text-transform:uppercase;
    letter-spacing:0.08em;
    color:var(--ink);
    margin:0 0 16px;
    padding-bottom:10px;
    border-bottom:2px solid var(--line);
  }
#rdl-app .field {margin-bottom:18px;}
#rdl-app .field:last-child {margin-bottom:0;}
#rdl-app .field label {
    display:block;
    font-weight:600;
    font-size:0.85rem;
    margin-bottom:8px;
    color:var(--ink);
  }
#rdl-app .hint {
    font-size:0.76rem;
    color:var(--text-mute);
    margin-top:5px;
  }
#rdl-app .seg {
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:8px;
  }
#rdl-app .seg label {
    display:flex; align-items:center; justify-content:center; text-align:center;
    border:1.5px solid var(--line);
    border-radius:7px;
    padding:10px 8px;
    font-size:0.78rem;
    font-weight:600;
    cursor:pointer;
    color:var(--text-mute);
    transition:all .15s ease;
    line-height:1.25;
  }
#rdl-app .seg input {position:absolute; opacity:0; pointer-events:none;}
#rdl-app .seg input:checked + label, #rdl-app .seg label.checked {
    border-color:var(--orange);
    background:rgba(226,121,46,0.09);
    color:var(--orange-dark);
  }
#rdl-app .seg-wrap {position:relative;}
#rdl-app select, #rdl-app input[type=number] {
    width:100%;
    padding:11px 12px;
    border:1.5px solid var(--line);
    border-radius:7px;
    font-size:0.92rem;
    font-family:'Inter',sans-serif;
    color:var(--text);
    background:#fff;
  }
#rdl-app select:focus, #rdl-app input[type=number]:focus {
    outline:none;
    border-color:var(--orange);
  }
#rdl-app .row2 {display:grid; grid-template-columns:1fr 1fr; gap:14px;}
#rdl-app .check-row {
    display:flex; align-items:flex-start; gap:10px;
    padding:12px;
    border:1.5px solid var(--line);
    border-radius:7px;
    cursor:pointer;
  }
#rdl-app .check-row:hover {border-color:#d7d3ca;}
#rdl-app .check-row input {margin-top:2px; width:17px; height:17px; accent-color:var(--orange); flex-shrink:0;}
#rdl-app .check-row .ctext strong {display:block; font-size:0.85rem; color:var(--ink);}
#rdl-app .check-row .ctext span {font-size:0.76rem; color:var(--text-mute);}
#rdl-app .receipt {
    background:var(--ink);
    border-radius:10px;
    padding:24px 22px 22px;
    color:#f2f1ec;
    position:relative;
  }
#rdl-app .receipt h3 {
    font-family:'Oswald',sans-serif;
    text-transform:uppercase;
    letter-spacing:0.08em;
    font-size:0.82rem;
    color:var(--orange);
    margin:0 0 16px;
    display:flex; justify-content:space-between; align-items:baseline;
  }
#rdl-app .receipt h3 span {color:#9d9b93; font-size:0.7rem; letter-spacing:0.02em; text-transform:none; font-weight:400;}
#rdl-app .line-item {
    display:flex; justify-content:space-between; gap:10px;
    padding:9px 0;
    border-bottom:1px dashed rgba(255,255,255,0.14);
    font-size:0.85rem;
  }
#rdl-app .line-item .desc {color:#d8d6cf;}
#rdl-app .line-item .desc small {display:block; color:#8f8d85; font-size:0.72rem; margin-top:2px;}
#rdl-app .line-item .amt {color:#fff; font-weight:600; white-space:nowrap;}
#rdl-app .empty-note {
    color:#8f8d85;
    font-size:0.82rem;
    padding:14px 0;
    text-align:center;
  }
#rdl-app .totals {margin-top:14px; padding-top:6px;}
#rdl-app .total-row {
    display:flex; justify-content:space-between; align-items:center;
    padding:8px 0;
  }
#rdl-app .total-row .tlabel {font-size:0.82rem; color:#c9c7c0;}
#rdl-app .total-row .tval {font-family:'Oswald',sans-serif; font-size:1.05rem; font-weight:600; color:#fff;}
#rdl-app .total-row.main {
    border-top:2px solid var(--orange);
    margin-top:6px;
    padding-top:14px;
  }
#rdl-app .total-row.main .tlabel {font-size:0.9rem; color:#f2f1ec; font-weight:600;}
#rdl-app .total-row.main .tval {font-size:1.55rem; color:var(--orange);}
#rdl-app .footnote {
    font-size:0.72rem;
    color:var(--text-mute);
    text-align:center;
    margin-top:18px;
    line-height:1.5;
  }
#rdl-app .footnote strong {color:var(--ink);}
#rdl-app .btn-primary {
    display:block;
    width:100%;
    background:var(--orange);
    color:#fff;
    border:none;
    border-radius:8px;
    padding:14px 18px;
    font-family:'Oswald',sans-serif;
    font-size:0.95rem;
    font-weight:600;
    letter-spacing:0.04em;
    text-transform:uppercase;
    cursor:pointer;
    margin-bottom:20px;
    transition:background .15s ease;
  }
#rdl-app .btn-primary:hover {background:var(--orange-dark);}
#rdl-app .btn-primary:active {transform:translateY(1px);}
#rdl-app .btn-ghost {
    display:block;
    width:100%;
    background:transparent;
    color:#d8d6cf;
    border:1.5px solid rgba(255,255,255,0.25);
    border-radius:7px;
    padding:11px 16px;
    font-family:'Inter',sans-serif;
    font-size:0.82rem;
    font-weight:600;
    cursor:pointer;
    margin-top:18px;
    transition:all .15s ease;
  }
#rdl-app .btn-ghost:hover {border-color:var(--orange); color:#fff;}


  @media print{
#rdl-app .topbar::after {display:none;}
#rdl-app .card, #rdl-app .btn-primary, #rdl-app .btn-ghost {display:none !important;}
#rdl-app .receipt {background:#fff !important; color:#000 !important; border:1px solid #ccc;}
#rdl-app .receipt h3, #rdl-app .receipt h3 span, #rdl-app .total-row .tlabel {color:#000 !important;}
#rdl-app .line-item .desc, #rdl-app .line-item .amt, #rdl-app .total-row .tval {color:#000 !important;}
#rdl-app .line-item .desc small {color:#555 !important;}
#rdl-app .total-row.main {border-top-color:var(--orange) !important;}
#rdl-app .total-row.main .tval {color:var(--orange-dark) !important;}
#rdl-app .empty-note {color:#555 !important;}
}


  @media (max-width:768px){
#rdl-app .wrap {padding:18px 14px 40px;}
#rdl-app .topbar {padding:22px 20px 26px; border-radius:14px;}
#rdl-app .card {padding:18px 16px 20px; border-radius:9px;}
#rdl-app .receipt {padding:20px 18px 20px; border-radius:9px;}
}


  @media (max-width:480px){
#rdl-app .wrap {padding:14px 10px 36px;}
#rdl-app .topbar {padding:20px 16px 24px; margin-bottom:16px;}
#rdl-app .brand-mark {width:46px; height:46px;}
#rdl-app .brand-text h1 {font-size:1.2rem;}
#rdl-app .brand-text p {font-size:0.72rem;}
#rdl-app .tool-title {margin-top:16px;}
#rdl-app .tool-title h2 {font-size:0.92rem;}
#rdl-app .tool-title p {font-size:0.78rem; margin-left:11px;}
#rdl-app .card {padding:16px 14px 18px; margin-bottom:14px;}
#rdl-app .card h3 {font-size:0.72rem; margin-bottom:13px;}
#rdl-app .seg {grid-template-columns:1fr; gap:7px;}
#rdl-app .seg label {padding:11px 10px;}
#rdl-app .row2 {grid-template-columns:1fr; gap:12px;}
#rdl-app .receipt {padding:18px 15px 18px;}
#rdl-app .total-row.main .tval {font-size:1.35rem;}
}


  @media (max-width:360px){
#rdl-app .brand-row {gap:10px;}
#rdl-app .brand-mark {width:40px; height:40px; padding:5px;}
#rdl-app .brand-text h1 {font-size:1.05rem;}
}
