:root { color-scheme: light; font-family: Inter, Arial, sans-serif; color: #18213b; background: #f4f6fb; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; }
.delivery-page { width: min(720px, calc(100% - 32px)); margin: 0 auto; padding: 70px 0; text-align: center; }
.delivery-logo { display: block; width: 64px; height: 64px; margin: 0 auto 20px; border-radius: 50%; object-fit: cover; box-shadow: 0 12px 30px rgba(19,26,54,.16); }
.eyebrow { margin: 0; color: #6d5ce7; font-size: .73rem; font-weight: 850; letter-spacing: .11em; }
h1 { max-width: 650px; margin: 10px auto; font-size: clamp(2rem, 6vw, 3.4rem); line-height: 1.05; letter-spacing: -.04em; }
#intro { margin: 0 auto 28px; color: #65708b; font-size: 1rem; line-height: 1.55; }
.delivery-card { overflow: hidden; border: 1px solid #dfe4f0; border-radius: 24px; background: #fff; box-shadow: 0 18px 45px rgba(18,27,59,.09); text-align: left; }
.demo-version-list { display: grid; gap: 16px; padding: 22px; background: #fafbfd; }
.demo-version { overflow: hidden; border: 1px solid #dfe4f0; border-radius: 16px; background: #fff; }
.version-head { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 16px 18px; color: #fff; background: #131a36; }
.version-meta { display: grid; gap: 3px; min-width: 0; }
.version-tag { color: #b9aeff; font-size: .7rem; font-weight: 850; letter-spacing: .1em; }
.version-title { overflow: hidden; color: #fff; font-size: 1rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.version-duration { flex: 0 0 auto; color: #c8beff; font-size: .72rem; letter-spacing: .08em; }
audio { width: calc(100% - 44px); margin: 22px; }
.download { display: block; margin: 0 22px 24px; padding: 14px 18px; border-radius: 12px; color: #fff; background: #7055e9; font-weight: 800; text-align: center; text-decoration: none; }
.lyrics { border-top: 1px solid #e7eaf1; background: #fafbfd; }
.lyrics summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; color: #18213b; font-size: 1rem; font-weight: 850; cursor: pointer; list-style: none; }
.lyrics summary::-webkit-details-marker { display: none; }
.lyrics summary::after { content: '+'; color: #7055e9; font-size: 1.35rem; line-height: 1; }
.lyrics[open] summary::after { content: '−'; }
.lyrics-content { padding: 2px 22px 22px; }
.lyrics-download { margin: 22px 0 0; }
.lyrics-download[hidden] { display: none; }
.lyrics-download-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:22px; }
.lyrics-download-actions .download { width:100%; min-height:52px; margin:0; border:0; font:800 .88rem/1.25 Inter,Arial,sans-serif; cursor:pointer; }
.lyrics pre { margin: 0; white-space: pre-wrap; color: #38445c; font-family: Georgia, serif; font-size: 1rem; line-height: 1.75; }
.lyric-section { margin: 28px 0 11px; color: #111; font-family: Inter, Arial, sans-serif; font-size: 1rem; font-weight: 850; }
.lyric-section:first-child { margin-top: 0; }
.lyric-line { margin: 0; color: #38445c; font-family: Georgia, serif; font-size: 1rem; line-height: 1.72; }
.lyric-line + .lyric-line { margin-top: 3px; }
.upgrade { padding: 26px 24px; border-top: 1px solid #e7eaf1; background-image: linear-gradient(145deg, rgba(8,14,43,.96), rgba(26,31,79,.9)), url("assets/song-wave-hero.png"); background-position: center; background-size: cover; color: #fff; }
.upgrade > span { color: #c4baff; font-size: .72rem; font-weight: 850; letter-spacing: .1em; }
.upgrade h2 { margin: 7px 0 4px; font-size: 1.25rem; }
.upgrade p { margin: 0 0 17px; color: #dce1f5; line-height: 1.5; }
.upgrade-choices { display: grid; gap: 10px; margin: 0 0 15px; padding: 0; border: 0; }
.upgrade-choices legend { margin: 0 0 9px; padding: 0; color: #fff; font-size: .94rem; font-weight: 850; }
.upgrade-choice { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 14px 15px; border: 1px solid rgba(255,255,255,.27); border-radius: 14px; background: rgba(9,15,42,.76); box-shadow: inset 0 1px rgba(255,255,255,.04); cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
.upgrade-choice:hover { border-color: rgba(208,198,255,.75); transform: translateY(-1px); }
.upgrade-choice:has(input:checked) { border-color: #c7bdff; background: linear-gradient(120deg, rgba(112,85,233,.54), rgba(74,52,137,.58)); box-shadow: 0 0 0 2px rgba(198,186,255,.2), inset 0 1px rgba(255,255,255,.12); }
.upgrade-choice input { width: 19px; height: 19px; margin: 0; accent-color: #a99bff; }
.upgrade-choice-copy { display: grid; gap: 3px; min-width: 0; }
.upgrade-choice-copy b { color: #fff; font-size: .95rem; line-height: 1.25; }
.upgrade-choice-copy small { color: #dce1f5; font-size: .79rem; line-height: 1.35; }
.upgrade-choice-price { display: grid; gap: 2px; color: #fff; text-align: right; white-space: nowrap; }
.upgrade-choice-price b { font-size: .85rem; }
.upgrade-choice-price small { color: #dce1f5; font-size: .72rem; }
.upgrade-link { display: block; padding: 15px 18px; border-radius: 13px; color: #fff; background: linear-gradient(100deg, #6657ee, #8658ec 55%, #9c5bea); box-shadow: 0 12px 24px rgba(30,18,98,.32); font-weight: 850; text-align: center; text-decoration: none; }
.feedback { border-top: 1px solid #e7eaf1; background: #f8f7ff; }
.feedback > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px; color:#18213b; font-weight:850; cursor:pointer; list-style:none; }
.feedback > summary::-webkit-details-marker { display:none; }
.feedback > summary::after { content:'+'; color:#7055e9; font-size:1.35rem; line-height:1; }
.feedback[open] > summary::after { content:'−'; }
.feedback-content { padding:0 22px 22px; }
.feedback p { margin: 0; color: #68748d; font-size: .86rem; line-height: 1.45; }
.feedback-link { flex: 0 0 auto; padding: 11px 14px; border: 1px solid #7764e8; border-radius: 10px; color: #4938b7; background: #fff; font-weight: 800; text-align: center; text-decoration: none; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,background .16s ease; }
.feedback-link:hover { transform:translateY(-1px); background:#f3f0ff; box-shadow:0 8px 18px rgba(80,61,181,.13); }
.expiry, .support { color: #68748d; font-size: .84rem; line-height: 1.55; }
.expiry { margin: 0; padding: 13px 20px 16px; border-top: 1px solid #e7eaf1; color: #68748d; background: #fafbfd; font-size: .78rem; font-weight: 650; text-align: center; }
#feedback-form { margin-top:14px; }
#feedback-form label { display: block; font-weight: 750; margin: 16px 0 7px; }
#feedback-form select, #feedback-form textarea { box-sizing: border-box; width: 100%; padding: 12px; font: inherit; border: 1px solid #b9c3d9; border-radius: 10px; background: white; color: #182343; }
#feedback-form textarea { resize: vertical; margin-bottom: 14px; }
#feedback-status { margin-top: 12px; font-weight: 700; color: #30446b; }
.upgrade-link[aria-disabled="true"] { opacity: .65; }
.support { max-width: 620px; margin: 22px auto 0; }
.support a { color: #4c3fbb; font-weight: 700; }
@media (max-width: 540px) { .delivery-page { width:min(100% - 20px,720px); padding:34px 0; } .delivery-logo { width:54px; height:54px; margin-bottom:16px; } #intro { margin-bottom:20px; } .upgrade { padding: 20px 18px; } .upgrade-choice { grid-template-columns: auto minmax(0, 1fr); } .upgrade-choice-price { grid-column: 2; text-align: left; } .feedback-link { width: 100%; } }
/* Owner-only gift editor stays collapsed until the optional feature is needed. */
.gift-editor { padding:0; border:1px solid #d9d4f6; background:linear-gradient(145deg,#f8f7ff,#fff); }
.gift-editor summary { padding:20px 22px; cursor:pointer; color:#171c3b; font-weight:850; list-style-position:inside; }
.gift-editor summary small { margin-left:6px; color:#75809a; font-size:.72rem; font-weight:700; }
.gift-editor[open] summary { border-bottom:1px solid #e5e0fb; }
.gift-editor form { padding:6px 22px 24px; }
.gift-editor label { display:block; margin:18px 0 8px; color:#222a49; font-weight:750; }
.gift-editor textarea,.gift-editor input[type=url] { display:block; width:100%; box-sizing:border-box; margin-top:8px; padding:13px 14px; border:1px solid #cdd3e4; border-radius:12px; background:#fff; color:#18213b; font:inherit; box-shadow:0 1px 2px rgba(18,27,59,.04); }
.gift-editor textarea:focus,.gift-editor input[type=url]:focus,.gift-editor input[type=file]:focus-visible { outline:3px solid rgba(112,85,233,.2); border-color:#7055e9; }
.gift-editor input[type=file] { display:block; width:100%; margin-top:8px; padding:8px; border:1px dashed #bcb4ec; border-radius:12px; background:#fff; color:#56617a; font:inherit; }
.gift-editor input[type=file]::file-selector-button { margin-right:12px; padding:10px 14px; border:0; border-radius:9px; color:#fff; background:#7055e9; font:800 .82rem/1.2 Inter,Arial,sans-serif; cursor:pointer; }
.gift-editor button,.gift-editor [data-open-gift],.gift-editor [data-cover-download] { display:inline-flex; align-items:center; justify-content:center; min-height:44px; margin:8px 8px 8px 0; padding:11px 15px; border:1px solid #7764e8; border-radius:10px; color:#4938b7; background:#fff; font:800 .82rem/1.25 Inter,Arial,sans-serif; text-align:center; text-decoration:none; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,background .16s ease; }
.gift-editor button:hover:not(:disabled),.gift-editor [data-open-gift]:hover,.gift-editor [data-cover-download]:hover { transform:translateY(-1px); background:#f1eeff; box-shadow:0 8px 18px rgba(80,61,181,.13); }
.gift-editor button[type=submit] { color:#fff; border-color:#7055e9; background:linear-gradient(100deg,#6657ee,#8658ec 58%,#9c5bea); box-shadow:0 10px 22px rgba(75,52,175,.22); }
.gift-editor button[type=submit]:hover:not(:disabled) { background:linear-gradient(100deg,#5b4ce2,#7e50e3 58%,#9251df); }
.gift-editor button:disabled { opacity:.42; cursor:not-allowed; }
.gift-editor [data-revoke] { color:#5d667c; border-color:#ccd2e1; }
.gift-editor p { color:#56617a; line-height:1.45; }
.gift-editor .gift-intro { margin:12px 0 4px; }
.gift-editor .field-hint { margin:0 0 10px; font-size:.85rem; font-weight:400; }
.gift-editor .field-help { margin:0 0 10px; }
.gift-editor .field-help > summary { min-height:44px; padding:10px 0; border:0; font-size:.85rem; font-weight:500; color:#56617a; }
.gift-editor .field-help > p { margin:0 0 10px; font-size:.85rem; }
.gift-editor img { display:block; width:min(220px,100%); height:auto; margin:18px 0 8px; border:1px solid #d8dcef; border-radius:14px; box-shadow:0 10px 28px rgba(18,27,59,.12); }
.gift-photo-actions { display:flex; flex-wrap:wrap; gap:8px; margin:2px 0 10px; }
.gift-photo-actions button { margin:0; }
.gift-editor [role=status]:not(:empty) { margin:14px 0; padding:12px 14px; border-radius:10px; background:#eef0ff; color:#30256f; font-weight:700; }
@media (max-width:540px) { .lyrics-download-actions { grid-template-columns:1fr; } .gift-editor summary { padding:18px; } .gift-editor form { padding:2px 18px 18px; } }

/* Branding follows the authenticated order, including links opened on another device. */
#delivery-partner { display:flex; align-items:center; justify-content:center; gap:14px; margin:0 0 24px; padding:14px; border-radius:12px; background:var(--partner-highlight-soft); color:var(--partner-accent-dark); overflow-wrap:anywhere; }
#delivery-partner img { width:100px; max-height:54px; object-fit:contain; }
html[data-partner-theme="true"] { background:#fffaf3; color:#251d20; }
html[data-partner-theme="true"] .version-head { background:var(--partner-header); color:var(--partner-on-header); }
html[data-partner-theme="true"] :is(.eyebrow,.lyrics summary,.feedback summary) { color:var(--partner-accent-dark); }
html[data-partner-theme="true"] :is(.download,.upgrade-link,.gift-editor button) { background:var(--partner-accent); color:var(--partner-on-header); }
html[data-partner-theme="true"] .upgrade { background-image:linear-gradient(145deg, var(--partner-header-dark), color-mix(in srgb,var(--partner-header) 90%,transparent)),url("assets/song-wave-hero.png"); }
html[data-partner-theme="true"] .upgrade > span { color:var(--partner-on-header); }
html[data-partner-theme="true"] .upgrade-choice:has(input:checked) { background:var(--partner-header); border-color:var(--partner-highlight); box-shadow:none; }
html[data-partner-theme="true"] .upgrade-choice input { accent-color:var(--partner-accent); }
html[data-partner-theme="true"] .feedback-link { color:var(--partner-accent-dark); border-color:var(--partner-accent); }
html[data-partner-theme="true"] .site-language select { color:var(--partner-on-header); background:var(--partner-header); border-color:var(--partner-header); }
html[data-partner-theme="true"] .site-language-control::after { border-color:var(--partner-on-header); }
html[data-partner-theme="true"] .site-language option:is([value="sq"],[value="tr"],[value="hr"],[value="sr"]) { display:none; }