/* RatunekNFC 0.16.1 — kolory z zaakceptowanego wzoru. Układ w style.css. */
:root{
  color-scheme:dark;
  --paper:#0e1929;
  --surface:#172638;
  --surface-hover:#22364d;
  --ink:#e4ebf2;
  --muted:#afbed0;
  --mint:#22364d;
  --soft:#142236;
  --white:#172638;
  --line:#36495e;
  --control-line:#71869e;
  --orange:#ffb176;
  --brand:#ff731d;
  --brand-hover:#ff8b45;
  --brand-text:#ffb176;
  --on-brand:#0e1929;
  --red:#ffb4a4;
  --warning:#3b291e;
}
body{color:var(--ink);background:var(--paper)}
.header{background:#172638fa}
.prototype{background:var(--surface);color:var(--muted)}
.dot{background:var(--brand)}
.brand-symbol{background:var(--brand);color:var(--on-brand)}
.brand-light,.brand-dot{color:var(--brand)}
.hero h1 em{color:var(--brand-text)}
.hero-art{background:var(--surface);border:1px solid var(--line)}
.hero-art:before{border-color:var(--line)}
.hero-art .keychain{transform:none;filter:none}
.product-note{border-color:var(--line)}
.dark,.nav-activate,.product-demo-label,.side-nav .active{background:var(--brand);color:var(--on-brand)}
.dark:hover,.nav-activate:hover,.side-nav .active:hover{background:var(--brand-hover);color:var(--on-brand)}
.outline,.nav-toggle{border-color:var(--control-line);color:var(--ink)}
.outline:hover,.light:hover{background:var(--surface-hover);color:var(--ink)}
.light{background:var(--surface-hover);color:var(--ink)}
.quick-action,.card,.product-card,.stat{background:var(--surface)}
.side-nav{background:var(--surface)}
.quick-action:hover,.side-nav a:hover,.side-nav button:hover,.mobile-nav a:hover{background:var(--surface-hover);border-color:var(--control-line)}
.quick-action svg,.step-number{color:var(--brand-text)}
.step{border-color:var(--line)}
.split-section{background:var(--surface);border:1px solid var(--line);color:var(--ink)}
.split-section h2,.split-section p,.split-section .eyebrow,.data-list>div,.data-list small{color:var(--ink)}
.split-section .button.light{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.split-section .button.light:hover{background:var(--brand-hover);color:var(--on-brand);border-color:var(--brand-hover)}
.data-list>div{border-color:var(--line)}
.data-list svg{color:var(--brand-text)}
.data-list small{color:var(--muted)}
.pricing-card,.cta,.activation-aside,.product-visual{background:var(--surface);border-color:var(--line)}
.price-includes>div,.footer-bottom{border-color:var(--line)}
footer{background:var(--surface)}
.label,.success-icon{background:var(--surface-hover);color:var(--ink)}
.avatar{background:var(--paper);color:var(--ink)}
.demo-alert{background:var(--soft);border-color:var(--line);color:var(--muted)}
.card{box-shadow:0 5px 20px #0000000a}
.form-field input,.form-field select,.profile-textarea{background:var(--paper);color:var(--ink);border-color:var(--control-line);min-height:54px}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
.form-field select option{background:var(--paper);color:var(--ink)}
input:autofill{box-shadow:0 0 0 1000px var(--paper) inset;color:var(--ink)}
input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--paper) inset;-webkit-text-fill-color:var(--ink);caret-color:var(--ink)}
.medical-section{background:var(--paper);border-color:var(--line)}
.medical-section.allergy{background:var(--warning);border-color:#745238;border-left:4px solid var(--brand)}
.medical-section p,.medical-section ul{font-size:22px;line-height:1.6}
.emergency h2{font-size:17px;letter-spacing:.035em}
.emergency .profile-header{padding-bottom:24px}
.read-confirmed{background:var(--paper);color:var(--ink)}
.read-contact{background:var(--paper);border-color:var(--line)}
.read-contact h2{color:var(--ink)}
.read-contact .read-call{background:var(--ink);color:var(--on-brand);border-color:var(--ink)}
.read-contact .read-call:hover{background:#ffffff;color:var(--on-brand);border-color:#ffffff}
.switch{background:var(--surface-hover);border-color:var(--control-line)}
.switch:before{background:var(--ink);box-shadow:0 1px 3px #00000033}
.switch:checked{background:var(--brand);border-color:var(--brand)}
.switch:checked:before{background:var(--on-brand)}
.checkline input,.form-field .fine input[type=checkbox]{accent-color:var(--brand)}
.progress span{border-color:var(--line)}
.progress span.done,.progress [aria-current=step],.onboarding-steps [aria-current=step]{border-color:var(--brand)}
.onboarding-steps li{background:var(--surface);border-color:var(--line)}
.onboarding-steps li span,.onboarding-steps .done,.setup-step{background:var(--surface-hover);border-color:var(--line)}
.billing-notice{background:var(--soft);color:var(--ink);border-color:var(--line);border-left-color:var(--brand)}
.danger-zone{background:#30232c;border-color:#98675f}
.red-button{background:#30232c;color:var(--red);border-color:#98675f}
.red-button:hover{background:#412d35}
.status-dot{background:#8bd7b0}
.status-dot.off{background:var(--brand-text)}
.order-progress li{background:var(--surface);border-color:var(--line);color:var(--muted)}
.order-progress li[aria-current=step]{border-color:var(--brand);color:var(--ink)}
.order-progress li>span{background:var(--surface-hover);color:var(--ink)}
.order-model{background:var(--surface);border-color:var(--line)}
.order-model:has(input:checked){background:var(--surface-hover);border-color:var(--brand)}
.order-model:focus-within{outline-color:var(--brand-text)}
.order-model>input{accent-color:var(--brand)}
.order-model>strong{color:var(--ink)}
.order-total{background:var(--paper);border-color:var(--line)}
#toast{background:var(--ink);color:var(--on-brand);box-shadow:0 5px 20px #00000026}
.skip{background:var(--surface);color:var(--ink);border-color:var(--brand)}
.product-demo:hover{border-color:var(--brand)}
.product-demo:focus-visible{outline-color:var(--brand-text)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:var(--brand-text)}
dialog::backdrop{background:#00000099}
::selection{background:var(--brand);color:var(--on-brand)}
@media(max-width:720px){.medical-section p,.medical-section ul{font-size:20px}.hero h1{font-size:clamp(38px,8vw,51px)}}
@media(forced-colors:active){:root{color-scheme:light dark}.switch:checked{background:Highlight}.side-nav .active{border:2px solid Highlight}}

/* Accessible delivery choices and breathing room above the map action. */
#live-delivery .delivery-methods{border:0;padding:0;margin:24px 0 0;min-width:0}
.delivery-methods legend{font-size:18px;font-weight:700;margin-bottom:14px;padding:0;color:var(--ink)}
.delivery-method-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.delivery-option{display:flex;align-items:center;gap:14px;min-height:110px;padding:20px;border:2px solid var(--line);border-radius:14px;background:var(--paper);cursor:pointer}
.delivery-option:has(input:checked){border-color:var(--brand);background:var(--surface-hover)}
.delivery-option:focus-within{outline:3px solid var(--brand-text);outline-offset:3px}
.delivery-option input[type=radio]{appearance:auto;flex:0 0 22px;width:22px;height:22px;margin:0;accent-color:var(--brand)}
.delivery-option span{flex:1;min-width:0}
.delivery-option strong{display:block;font-size:18px;line-height:1.4;color:var(--ink)}
.delivery-option small{display:block;margin-top:6px;font-size:15px;line-height:1.5;color:var(--muted)}
.delivery-option b{font-size:16px;color:var(--ink);white-space:normal}
.delivery-option:has(input:disabled){cursor:default}
#live-inpost-choice{margin:28px 0 30px}
#live-delivery>.delivery-methods+div{margin-top:28px}
#live-delivery .form-field{margin-top:20px}
@media(max-width:720px){.delivery-method-options{grid-template-columns:1fr}.delivery-option{padding:18px;min-height:96px;gap:12px}.delivery-option b{max-width:105px}#live-inpost-map{width:100%;white-space:normal}}

.service-plans{border:0;padding:0;margin:24px 0 28px;min-width:0}

/* Transparent vector logo: natural proportions, no cropping or background. */
.brand:has(.brand-logo){display:inline-flex;align-items:center;width:240px;flex-shrink:0;padding:8px 0}
.brand .brand-logo{display:block;position:static;width:100%;height:auto;max-width:100%;transform:none}
.footer-brand:has(.brand-logo){width:250px}
.emergency-top .brand:has(.brand-logo){width:220px}
@media(max-width:1100px){.header .brand:has(.brand-logo){width:205px}}
@media(max-width:720px){.header .brand:has(.brand-logo){width:155px}.emergency-top{flex-wrap:wrap}.emergency-top .brand:has(.brand-logo){width:200px}}
@media(max-width:390px){.header .brand:has(.brand-logo){width:135px}}

.catalog-photo{position:relative;display:block;overflow:hidden;width:100%;background:#edf0f3;border-radius:14px}
.catalog-photo>img{position:absolute;display:block;width:var(--photo-width)!important;max-width:none!important;height:auto!important;left:var(--photo-left);top:var(--photo-top);object-fit:initial!important;margin:0!important;transform:none!important}
.catalog-visual{display:flex;align-items:center;justify-content:center;padding:12px;min-height:320px}
.catalog-visual>.catalog-photo{width:min(100%,250px)}
.catalog-visual>.catalog-photo-wallet{width:100%}
.catalog-swatches{display:flex;align-items:center;justify-content:center;gap:6px;border:0;padding:10px 0;margin:4px 0 16px;min-width:0}
.catalog-swatch{position:relative;display:grid;place-items:center;width:44px;height:44px;cursor:pointer;flex-shrink:0}
.catalog-swatch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.catalog-swatch>span{display:block;width:24px;height:24px;border-radius:50%;border:2px solid #8295a9}
.swatch-white{background:#fff}.swatch-navy{background:#203b5b}.swatch-orange{background:#ff731d}
.catalog-swatch:has(input:checked)>span{outline:3px solid var(--brand);outline-offset:4px}
.catalog-swatch:has(input:focus-visible){outline:3px solid var(--brand-text);outline-offset:2px;border-radius:10px}
.catalog-color-label{font-size:14px;margin-left:6px;color:var(--muted)}
.catalog-reverse{margin:0 0 18px}.catalog-reverse summary{cursor:pointer;color:var(--muted)}
.catalog-picker .order-model-option{min-width:0;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.catalog-picker .order-model{border:0;border-radius:0;padding-bottom:12px}
.catalog-picker [data-catalog-photo]{display:block;width:100%}
.catalog-picker .catalog-photo{max-width:240px;margin:0 auto}
.catalog-picker .catalog-photo-wallet{max-width:100%}
.catalog-picker .order-model-option:has(input[name=model]:checked){border:2px solid var(--brand)}
.catalog-picker .catalog-swatches{flex-wrap:wrap;margin:0;padding:12px 4px 20px}
.order-art .catalog-photo{max-width:220px;margin:auto}.order-art .catalog-photo-wallet{max-width:300px}
.hero-art>.catalog-photo,.activation-aside>.catalog-photo{width:min(78%,320px);margin:30px auto}
@media(max-width:720px){.catalog-visual{min-height:280px}.catalog-picker .catalog-photo{max-width:220px}}

.catalog-turntable{position:relative;width:100%;perspective:1000px;max-width:250px}
.catalog-turntable:has(.catalog-photo-wallet){max-width:100%}
.catalog-flip-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .55s ease}
.catalog-turntable.is-back .catalog-flip-inner{transform:rotateY(180deg)}
.catalog-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.catalog-face>span{display:block;width:100%;height:100%}
.catalog-back{transform:rotateY(180deg)}
.catalog-face .catalog-photo{width:100%;height:100%;max-width:none;margin:0}
.catalog-turn{display:block;min-height:44px;margin:0 auto 18px;font-size:15px;color:var(--brand-text)}
.catalog-picker .catalog-turntable{margin:auto}
@media(prefers-reduced-motion:reduce){.catalog-flip-inner{transition:none}}
.catalog-visual{height:360px!important;min-height:360px!important}
.catalog-turntable{flex:none}
.gallery-actions{flex-wrap:wrap}
@media(max-width:720px){.catalog-visual{height:350px!important;min-height:350px!important}.gallery-actions{flex-direction:column;align-items:stretch}.gallery-actions .button{width:100%;white-space:normal}}
@media(max-width:720px){.footer-top{grid-template-columns:1fr}.footer-top>*{min-width:0}}

/* Fixed frame and scale across rectangular colors and sides. */
.catalog-turntable:has(.catalog-photo-classic){max-width:205px}

/* Transparent products use aligned 1000px canvases, without per-color crops. */
.catalog-photo{background:transparent;border-radius:0;aspect-ratio:1}
.catalog-photo>img{position:static;display:block;width:100%!important;height:100%!important;max-width:100%!important;object-fit:contain!important;left:auto;top:auto}
.catalog-turntable,.catalog-turntable:has(.catalog-photo-classic),.catalog-turntable:has(.catalog-photo-wallet){max-width:330px;aspect-ratio:1}
.catalog-face .catalog-photo,.catalog-picker .catalog-face .catalog-photo{max-width:none;width:100%;height:100%}
.order-art .catalog-photo,.order-art .catalog-photo-wallet{max-width:330px}

/* Overlay only the outgoing photo; keep the incoming one in normal flow. */
[data-catalog-photo],[data-catalog-back]{position:relative}
.catalog-photo.catalog-outgoing{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

#live-sharing.sharing-next-step{outline:3px solid var(--brand);outline-offset:5px}
.sharing-next-notice{border-left:4px solid var(--brand);padding:12px 16px;background:var(--surface);font-size:18px;line-height:1.6}
#live-sharing-title:focus{outline:2px solid var(--brand);outline-offset:5px}

.card-visibility{border:2px solid var(--brand);padding:clamp(20px,4vw,32px)}
.card-visibility h2{font-size:clamp(24px,3vw,32px);line-height:1.25;margin:12px 0}
.card-visibility p{font-size:18px;line-height:1.6;max-width:65ch}
.card-visibility-visible{border-color:#77c8ad}
#live-profile-title:focus{outline:2px solid var(--brand);outline-offset:5px}

.next-steps-intro{border:2px solid var(--brand)}
.next-steps-intro>p{font-size:18px;line-height:1.6}
.next-steps-list{list-style:none;padding:0;margin:24px 0}
.next-steps-list li{display:flex;align-items:flex-start;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.next-step-marker{display:grid;place-items:center;flex:0 0 40px;height:40px;border:2px solid var(--brand);border-radius:50%;font-weight:700}
.next-steps-list .is-done .next-step-marker{border-color:#77c8ad;color:#77c8ad}
.next-steps-list h3{font-size:20px;margin:0 0 8px}.next-steps-list p{margin:0;font-size:17px;line-height:1.6}

.unsaved-notice{padding:12px 16px;border-left:4px solid var(--brand);font-size:17px;line-height:1.5}
.unsaved-notice[hidden]{display:none}

.profile-updated{display:flex;flex-direction:column;gap:6px;border-left:4px solid var(--brand);padding:14px 18px;margin:20px 0;background:rgba(255,255,255,.035);overflow-wrap:anywhere}
.profile-updated>span{font-size:16px;color:var(--muted)}
.profile-updated>strong{font-size:20px;line-height:1.4}
.profile-updated>small{font-size:14px;line-height:1.5;color:var(--muted)}

.tag-actions{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:100%}.tag-actions button{white-space:normal}.tag-actions summary{cursor:pointer;min-height:32px}.tag-actions details{max-width:340px}

.service-validity{border:2px solid var(--brand)}.service-until{display:block;font-size:clamp(28px,4vw,40px);line-height:1.3}.service-validity p{font-size:18px;line-height:1.6}

.field-hint,.field-error{display:block;font-size:15px;line-height:1.5;margin:6px 0 10px}.field-hint{color:var(--muted)}.field-error{color:#ffb6a0;font-weight:600}[aria-invalid="true"]{outline:2px solid #ffb6a0;outline-offset:2px}.field-error[hidden],.connection-notice[hidden]{display:none}.connection-notice{position:fixed;bottom:16px;left:16px;right:16px;z-index:1000;max-width:700px;margin:auto;padding:16px 20px;border:2px solid var(--brand);border-radius:12px;background:#172638;color:#e4ebf2;font-size:17px;line-height:1.5}.page-error:focus{outline:2px solid var(--brand);outline-offset:5px}

.help-instructions{padding-left:26px;font-size:18px;line-height:1.65}.help-instructions li{padding:4px 0 8px}#support-order-id{overflow-wrap:anywhere;font-size:16px}

/* Keyboard, touch, zoom and narrow-screen improvements. */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #ffac70;outline-offset:4px}
.button,.text-button,.nav-toggle,.side-nav a,.side-nav button,.mobile-nav a{min-height:44px}
input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:max(16px,1rem);max-width:100%;box-sizing:border-box}
input[type=checkbox]:not(.switch),input[type=radio]{min-width:22px;min-height:22px}
main,section,article,.card,.grid-2>*,.product-card,.order-overview>*,.account-layout>*{min-width:0}
h1,h2,h3,p,.visibility-row,.read-phone{overflow-wrap:anywhere}
.button{white-space:normal;text-align:center}
@media(max-width:480px){.nav{flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.nav-actions{flex-wrap:wrap;margin-left:auto}.card-title,.visibility-row{flex-wrap:wrap}.checkline{align-items:flex-start}.next-step-marker{flex-shrink:0}.catalog-swatches{flex-wrap:wrap}.connection-notice{left:8px;right:8px;bottom:8px;font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}
