/* Additions to the approved v13 design. Original stylesheets stay unchanged. */
.nav-test-link { color: var(--gold-light); }
.sample-test-addon { margin-top: 1.35rem; padding: clamp(1.35rem,3vw,2rem); display: flex; align-items: center; justify-content: space-between; gap: 2rem; border: 1px solid rgba(242,207,123,.25); border-radius: 1rem; color: white; background: linear-gradient(120deg, #09203a, #0b3157); box-shadow: 0 16px 38px rgba(3,19,38,.14); }
.sample-test-addon > div > span { color: var(--gold-light); font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.sample-test-addon h3 { margin: .25rem 0 .3rem; color: white; font-family: var(--serif); font-size: clamp(1.3rem,2vw,1.65rem); font-weight: 500; }
.sample-test-addon p { max-width: 620px; margin: 0; color: rgba(255,255,255,.7); font-size: .84rem; }
.sample-test-link { flex: 0 0 auto; min-width: 10.5rem; }

.subtle-link { color: var(--navy-800); text-underline-offset: .18em; font-size: .82em; }

.purchase-disclosure { margin-top: 1.3rem; border-top: 1px solid var(--line); }
.purchase-disclosure > summary { padding: 1rem 2.6rem 1rem 0; font-size: 1.02rem; }
.purchase-disclosure > summary::after { width: 1.65rem; height: 1.65rem; }
.purchase-steps { margin: .25rem 0 1.25rem; padding-left: 1.3rem; }
.purchase-steps li { padding-left: .3rem; margin-bottom: 1rem; color: var(--navy-800); font-size: .87rem; }
.purchase-steps li::marker { color: #8a5c06; font-weight: 700; }
.purchase-steps li p { margin: .25rem 0 0; font-size: .84rem; line-height: 1.6; }
.price-box .ios-price-note { font-size: .85rem; line-height: 1.55; }
.iphone-guide { margin-top: .65rem; text-align: left; }
.iphone-guide > summary { font-family: var(--sans); font-size: .8rem; line-height: 1.5; }
.iphone-guide-content { padding-bottom: 1rem; min-width: 0; }
.iphone-guide-content p { margin: 0 0 .85rem; font-size: .81rem; line-height: 1.6; }
.iphone-guide-content label { display: block; margin-bottom: .4rem; font-size: .72rem; font-weight: 700; color: var(--navy-800); }
.iphone-guide-content input { width: 100%; min-width: 0; padding: .65rem; border: 1px solid var(--line); border-radius: .4rem; background: white; color: var(--ink); font: .85rem var(--sans); }
.copy-link { min-height: 2.75rem; margin: .6rem 0; padding: .55rem .8rem; border: 1px solid var(--line); border-radius: .5rem; background: white; color: var(--navy-800); cursor: pointer; font: 700 .8rem var(--sans); }
.copy-status { display: block; color: var(--navy-800); font-size: .76rem; }
.iphone-guide-content .guide-price-hint { margin: .75rem 0 0; font-size: .75rem; }

.area-grid .area-expandable { display: block; padding: 0; min-width: 0; }
.area-grid .area-expandable:nth-child(odd) { padding: 0; }
.area-disclosure { border: 0; }
.area-disclosure > summary { min-height: 7rem; padding: 1.5rem 3.8rem 1.5rem 1.35rem; display: grid; grid-template-columns: 3rem minmax(0, 1fr); align-items: center; gap: 1rem; }
.area-expandable:nth-child(odd) .area-disclosure > summary { padding-left: 0; }
.area-disclosure > summary::after { right: 1.2rem; width: 1.65rem; height: 1.65rem; font-size: 1rem; }
.area-disclosure > summary i { display: none; }
.area-disclosure > summary:hover h3 { color: #8a5c06; }
.area-disclosure[open] > summary { padding-bottom: 1rem; }
.chapter-list { list-style: none; padding: 0 1.35rem 1.3rem; margin: 0; }
.area-expandable:nth-child(odd) .chapter-list { padding-left: 0; }
.chapter-list li { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr) auto; align-items: baseline; gap: .65rem; padding: .68rem 0; border-top: 1px solid var(--line); }
.area-grid .chapter-list span { font-family: var(--sans); font-weight: 400; font-size: .83rem; line-height: 1.55; }
.area-grid .chapter-list .chapter-number { color: #8a5c06; font-size: .69rem; font-variant-numeric: tabular-nums; }
.area-grid .chapter-list .chapter-title { color: var(--ink); overflow-wrap: anywhere; }
.chapter-list time { color: var(--muted); font-family: var(--sans); font-size: .73rem; white-space: nowrap; font-variant-numeric: tabular-nums; }

.audio-controls { margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--line); }
.audio-main-row { display: grid; grid-template-columns: 2.85rem minmax(0, 1fr); align-items: center; gap: .85rem; }
.audio-play { width: 2.85rem; height: 2.85rem; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; color: var(--gold-light); background: var(--navy-800); cursor: pointer; }
.audio-play:hover { background: var(--navy-950); }
.audio-play svg { width: 1.15rem; height: 1.15rem; fill: currentColor; }
.audio-timeline { min-width: 0; }
.audio-seek { display: block; width: 100%; height: 1.4rem; margin: 0; accent-color: var(--navy-800); cursor: pointer; }
.audio-time { display: flex; justify-content: space-between; gap: .5rem; color: var(--muted); font-size: .66rem; line-height: 1.4; font-variant-numeric: tabular-nums; }
.audio-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .35rem; margin-top: .5rem; }
.audio-skip-buttons { display: flex; gap: .2rem; }
.audio-skip { min-width: 2.75rem; min-height: 2.75rem; padding: .3rem; border: 0; border-radius: .45rem; color: var(--navy-800); background: transparent; cursor: pointer; font: 700 .75rem var(--sans); }
.audio-skip:hover { background: var(--paper); }
.audio-rate { display: flex; align-items: center; gap: .4rem; font-size: .68rem; color: var(--muted); }
.audio-rate select { min-height: 2.75rem; max-width: 4.8rem; padding: .3rem; border: 1px solid var(--line); border-radius: .45rem; color: var(--navy-800); background: white; cursor: pointer; font: 700 .78rem var(--sans); }
.sample-card .audio-error { margin: .5rem 0 0; color: #80570a; font-size: .76rem; }
.audio-native-hidden { display: none; }

.feedback-content { padding: .15rem 0 1.7rem; }
.feedback-content > p { margin: 0 0 1rem; }
.feedback-content .feedback-setup-note { padding: .7rem .85rem; border-left: 2px solid var(--gold); background: rgba(197, 154, 61, .07); font-size: .79rem; }
.feedback-content form { display: grid; gap: .5rem; }
.feedback-content label { display: block; margin-top: .65rem; color: var(--navy-800); font-size: .84rem; font-weight: 700; }
.feedback-content label span { color: var(--muted); font-weight: 400; }
.feedback-content input, .feedback-content select, .feedback-content textarea { display: block; width: 100%; min-width: 0; padding: .8rem; border: 1px solid var(--line); border-radius: .6rem; color: var(--ink); background: white; font: .95rem/1.5 var(--sans); }
.feedback-content textarea { resize: vertical; min-height: 8rem; }
.feedback-content .feedback-privacy { margin: .4rem 0 .75rem; font-size: .76rem; }
.feedback-content .button { justify-self: start; }
.feedback-content .feedback-status { margin: .5rem 0 0; font-size: .85rem; color: var(--navy-800); }
.feedback-status:empty { display: none; }

.help-widget { position: fixed; z-index: 110; right: 1.2rem; bottom: 1.2rem; display: flex; flex-direction: column; align-items: flex-end; gap: .65rem; }
.help-toggle { display: flex; gap: .6rem; align-items: center; min-height: 2.9rem; padding: .7rem 1rem; border: 1px solid rgba(197, 154, 61, .5); border-radius: 999px; color: var(--navy-800); background: var(--paper); box-shadow: 0 5px 20px rgba(3, 19, 38, .12); cursor: pointer; font: 700 .8rem var(--sans); }
.help-toggle svg { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.help-label-small { display: none; }
.help-panel { width: min(21rem, calc(100vw - 2.4rem)); max-height: calc(100dvh - 6rem); overflow-y: auto; padding: 1.2rem; border: 1px solid var(--line); border-radius: 1rem; color: var(--ink); background: var(--paper); box-shadow: var(--shadow); }
.help-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .55rem; }
.help-panel-heading strong { font-family: var(--serif); color: var(--navy-800); font-size: 1.2rem; font-weight: 500; }
.help-panel-heading button { display: grid; place-items: center; width: 2.75rem; min-width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: transparent; color: var(--navy-800); cursor: pointer; font: 1.5rem var(--sans); }
.help-panel-heading button:hover { background: rgba(11, 37, 69, .05); }
.help-panel > a { display: flex; justify-content: space-between; gap: .7rem; padding: .8rem 0; border-top: 1px solid var(--line); font-size: .84rem; text-decoration: none; color: var(--navy-800); }
.help-panel > a:hover { color: #8a5c06; }
.help-panel > a > span { color: #8a5c06; }
.help-panel > p { margin: 1rem 0 0; font-size: .75rem; color: var(--muted); }
.help-panel > p a { color: var(--navy-800); }
.help-widget[hidden], .help-panel[hidden], #chapter-context[hidden], #copy-patreon-link[hidden] { display: none; }
.area-disclosure summary:focus-visible, .purchase-disclosure summary:focus-visible, .audio-controls :focus-visible, .feedback-content :focus-visible, .help-widget :focus-visible, .copy-link:focus-visible, #patreon-web-link:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.purchase-disclosure, #pristup-faq, #podnety, #pristup, #podnety-sukromie { scroll-margin-top: 2rem; }

@media (max-width: 720px) {
  .sample-test-addon { align-items: flex-start; flex-direction: column; gap: .65rem; }
  .sample-test-link { width: 100%; }
  .help-widget { right: .75rem; bottom: calc(5rem + env(safe-area-inset-bottom)); }
  .help-toggle { min-height: 2.75rem; padding: .6rem .8rem; }
  .help-label-wide { display: none; }
  .help-label-small { display: inline; }
  .help-panel { width: min(21rem, calc(100vw - 1.5rem)); max-height: calc(100dvh - 9.25rem - env(safe-area-inset-bottom)); padding: 1rem; }
  .feedback-content input, .feedback-content select, .feedback-content textarea, .iphone-guide-content input { font-size: 1rem; }
}
@media (max-width: 640px) {
  .area-grid .area-expandable { min-height: 5.5rem; }
  .area-disclosure > summary, .area-expandable:nth-child(odd) .area-disclosure > summary { min-height: 5.5rem; padding: 1.2rem 2.5rem 1.2rem 0; }
  .area-disclosure > summary::after { right: 0; }
  .chapter-list { padding-right: 0; padding-left: 0; }
  .chapter-list li { gap: .5rem; }
}

.feedback-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#feedback-submit:disabled { cursor: not-allowed; opacity: .6; }
.feedback-status[data-state="error"] { color: #922b21; }
.feedback-status[data-state="success"] { color: #23552e; }