/* Wzornik — lustro palety i komponentów serwisu. */
.twz {
	--tlo: #020316; --tlo-panel: #070518; --tlo-karta: #08061a;
	--zloto: #fde291; --zloto-cieply: #f9d57a; --zloto-ciemne: #e6c48a; --zloto-etyk: #cda474;
	--lawenda: #ad97d3; --neon: #a06ffb; --zar: #e8752f;
	--tekst: #aba9b6; --tekst-slaby: #9393a7; --tekst-mocny: #e0dbde;
	--serif: 'Cormorant Garamond', 'Times New Roman', serif; --sans: 'Jost', system-ui, sans-serif;
	max-width: 1280px; margin: 0 auto; padding: 30px 28px 80px; color: var( --tekst ); font: 300 14px/1.7 var( --sans ); background: var( --tlo );
}
.twz *, .twz *::before, .twz *::after { box-sizing: border-box; }
body:has( .twz ) .wp-site-blocks > header, body:has( .twz ) header.wp-block-template-part, body:has( .twz ) .wp-site-blocks > footer, body:has( .twz ) footer.wp-block-template-part, body:has( .twz ) .wp-block-post-title { display: none !important; }
body:has( .twz ) .wp-site-blocks, body:has( .twz ) .wp-block-group, body:has( .twz ) .wp-block-post-content { padding: 0 !important; margin: 0 !important; max-width: none !important; }
body:has( .twz ) .wp-block-post-content > *, body:has( .twz ) .entry-content > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
body:has( .twz ) { background: #020316; }
.twz-proba { margin: 0 0 30px; font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; color: var( --tekst-slaby ); text-align: center; }
.twz-glowa { text-align: center; max-width: 780px; margin: 0 auto 50px; }
.twz-nad { margin: 0 0 10px; font-size: 11px; letter-spacing: .34em; text-transform: uppercase; color: var( --zloto-etyk ); }
.twz-nad i { font-style: normal; color: var( --zloto-ciemne ); margin: 0 10px; }
.twz-h1 { margin: 0 0 14px; font: 500 clamp( 30px, 4vw, 48px )/1.12 var( --serif ); color: var( --tekst-mocny ); }
.twz-h1 b { font-weight: 500; color: var( --zloto-cieply ); }
.twz-h1--demo { font-size: 34px; color: var( --zloto-cieply ); }
.twz-lead { margin: 0; font-size: 15px; line-height: 1.7; color: var( --lawenda ); }
.twz-tekst { margin: 0; color: var( --tekst ); }
.twz-sekcja { margin: 0 0 46px; padding: 26px 30px; border: 1px solid rgba( 160, 111, 251, .4 ); border-radius: 18px; background: var( --tlo-panel ); box-shadow: 0 0 30px rgba( 116, 66, 214, .2 ); }
.twz-sekcja__nad { margin: 0 0 18px; font-size: 12px; letter-spacing: .32em; text-transform: uppercase; color: var( --zloto ); }
.twz-etyk { display: block; margin: 0 0 6px; font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var( --zloto-etyk ); }

.twz-paleta { display: grid; grid-template-columns: repeat( auto-fill, minmax( 160px, 1fr ) ); gap: 12px; }
.twz-probka { display: grid; gap: 4px; padding: 10px; border: 1px solid rgba( 230, 196, 138, .16 ); border-radius: 12px; background: var( --tlo-karta ); }
.twz-probka i { display: block; height: 54px; border-radius: 8px; box-shadow: inset 0 0 0 1px rgba( 255, 255, 255, .08 ); }
.twz-probka b { font-weight: 400; font-size: 12px; color: var( --tekst-mocny ); }
.twz-probka code { font-size: 11px; color: var( --zloto ); }
.twz-probka span { font-size: 11px; color: var( --tekst-slaby ); line-height: 1.4; }

.twz-typo { display: grid; gap: 18px; }
.twz-typo__wiersz { padding: 0 0 14px; border-bottom: 1px solid rgba( 230, 196, 138, .1 ); }
.twz-typo__wiersz--uwaga { border-left: 3px solid var( --zar ); padding-left: 14px; }
.twz-lead--demo { max-width: 60ch; }
.twz-glify { margin: 0; font: 400 26px var( --serif ); color: var( --zloto ); letter-spacing: .1em; }
.twz-cjk { margin: 0; font: 400 26px 'Noto Serif SC', serif; color: var( --zloto ); letter-spacing: .1em; }
.twz-cinzel { margin: 0; font: 600 24px Cinzel, Georgia, serif; color: var( --zloto ); letter-spacing: .08em; }

.twz-komponenty { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: 18px; }
.twz-kom { padding: 16px; border: 1px solid rgba( 230, 196, 138, .14 ); border-radius: 12px; background: var( --tlo-karta ); }
.twz-kom--szeroki { grid-column: 1 / -1; }
.twz-rzad { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; }
.twz-btn { height: 44px; padding: 0 26px; border: 1px solid var( --zloto-ciemne ); border-radius: 999px; background: linear-gradient( 180deg, rgba( 253, 226, 145, .16 ), rgba( 253, 226, 145, .04 ) ); color: var( --zloto ); font: 400 12px var( --sans ); letter-spacing: .2em; text-transform: uppercase; cursor: pointer; }
.twz-btn--pelny { background: linear-gradient( 180deg, #fde9a8, #e2bf6e ); color: #241a05; font-weight: 500; }
.twz-link { padding: 0; border: 0; border-bottom: 1px solid rgba( 230, 196, 138, .3 ); background: none; color: var( --zloto-ciemne ); font: 300 12.5px var( --sans ); letter-spacing: .18em; text-transform: uppercase; cursor: pointer; }
.twz-chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border: 1px solid rgba( 230, 196, 138, .22 ); border-radius: 999px; font-size: 13px; color: var( --tekst-mocny ); }
.twz-chip b { font: 400 17px var( --serif ); color: var( --zloto ); }
.twz-chip--zar { border-color: rgba( 232, 117, 47, .45 ); }
.twz-chip--zar b { color: var( --zar ); }
.twz-medalion { position: relative; display: grid; place-items: center; width: 96px; height: 96px; border: 1px solid var( --zloto-ciemne ); border-radius: 999px; background: radial-gradient( circle at 50% 35%, rgba( 253, 226, 145, .18 ), transparent 62% ), var( --tlo-karta ); box-shadow: 0 0 0 4px var( --tlo-panel ), 0 0 0 5px rgba( 230, 196, 138, .3 ), 0 0 30px rgba( 253, 226, 145, .2 ); }
.twz-medalion b { font: 500 40px/1 var( --serif ); color: var( --zloto ); }
.twz-medalion small { position: absolute; bottom: 12px; font-size: 8.5px; letter-spacing: .24em; text-transform: uppercase; color: var( --zloto-etyk ); }
.twz-medalion--maly { width: 64px; height: 64px; }
.twz-medalion--maly b { font-size: 28px; }
.twz-pas { display: flex; height: 7px; margin: 8px 0 6px; border-radius: 999px; overflow: hidden; background: rgba( 255, 255, 255, .06 ); }
.twz-pas i { display: block; height: 100%; }
.twz-drobne { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var( --tekst-slaby ); }
.twz-kafel { display: grid; justify-items: center; gap: 6px; width: 170px; padding: 12px 10px 14px; border: 1px solid rgba( 230, 196, 138, .18 ); border-radius: 14px; background: rgba( 2, 3, 22, .45 ); color: var( --tekst ); font: inherit; text-align: center; cursor: pointer; }
.twz-kafel__nad { font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var( --zloto-etyk ); }
.twz-kafel__obraz { display: block; width: 80px; height: 120px; border-radius: 8px; background: linear-gradient( 160deg, #2a2450, #0b0820 ); box-shadow: inset 0 0 0 1px rgba( 255, 255, 255, .08 ); }
.twz-kafel b { font: 500 18px var( --serif ); color: var( --zloto-cieply ); }
.twz-kafel small { font-size: 11.5px; color: var( --tekst-slaby ); }
.twz-pole { display: grid; gap: 6px; max-width: 260px; }
.twz-pole span { font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var( --zloto-etyk ); }
.twz-pole input { height: 42px; padding: 0 14px; border: 1px solid rgba( 230, 196, 138, .28 ); border-radius: 10px; background: rgba( 2, 3, 22, .7 ); color: var( --tekst-mocny ); font: 300 15px var( --sans ); color-scheme: dark; }
.twz-okno-demo { display: grid; place-items: center; padding: 30px; border-radius: 12px; background: radial-gradient( 600px 200px at 50% 0, rgba( 116, 66, 214, .25 ), transparent ), rgba( 2, 3, 22, .8 ); backdrop-filter: blur( 6px ); }
.twz-okno-demo__panel { position: relative; width: 380px; border: 1px solid rgba( 230, 196, 138, .3 ); border-radius: 14px; background: #08061a; overflow: hidden; box-shadow: 0 30px 60px rgba( 0, 0, 0, .6 ); }
.twz-okno-demo__x { position: absolute; top: 10px; right: 14px; font-size: 22px; color: var( --zloto ); }
.twz-okno-demo__hero { display: grid; place-items: center; height: 150px; font: 400 80px var( --serif ); color: var( --zloto ); background: radial-gradient( circle at 50% 50%, rgba( 253, 226, 145, .2 ), transparent 60% ), #0f0b26; }
.twz-okno-demo__tresc { padding: 16px 20px 22px; }
.twz-okno-demo__tytul { display: block; font: 500 22px var( --serif ); color: var( --zloto-cieply ); }
.twz-okno-demo__tag { display: block; margin: 2px 0 12px; font-size: 12px; color: var( --lawenda ); font-style: italic; }
.twz-okno-demo__tresc p { margin: 0; font-size: 13.5px; color: var( --tekst ); }

.twz-dzialy { display: grid; grid-template-columns: repeat( 6, 1fr ); gap: 12px; }
.twz-dzial { display: grid; justify-items: center; gap: 6px; padding: 16px 10px 14px; border: 1px solid color-mix( in srgb, var( --akcent ) 40%, transparent ); border-radius: 14px; background: linear-gradient( 180deg, color-mix( in srgb, var( --akcent ) 10%, transparent ), transparent 60% ), var( --tlo-karta ); color: var( --tekst ); text-align: center; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.twz-dzial:hover { transform: translateY( -2px ); box-shadow: 0 14px 30px rgba( 0, 0, 0, .4 ), 0 0 20px color-mix( in srgb, var( --akcent ) 25%, transparent ); }
.twz-dzial__znak { display: grid; place-items: center; width: 56px; height: 56px; border: 1px solid var( --akcent ); border-radius: 999px; font: 400 26px 'Cormorant Garamond', 'Noto Serif SC', serif; color: var( --akcent ); box-shadow: 0 0 18px color-mix( in srgb, var( --akcent ) 30%, transparent ); }
.twz-dzial__nazwa { font-weight: 400; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var( --zloto ); }
.twz-dzial__hex { font-size: 10.5px; color: var( --akcent ); }
.twz-dzial__pasek { display: flex; gap: 3px; width: 100%; }
.twz-dzial__pasek i { flex: 1; height: 4px; border-radius: 999px; background: var( --zloto ); }
.twz-dzial__pasek i:nth-child( 2 ) { background: var( --akcent ); }
.twz-dzial__pasek i:nth-child( 3 ) { background: var( --lawenda ); }
.twz-dzial__odst { font-size: 10.5px; line-height: 1.4; color: var( --tekst-slaby ); }

.twz-reguly { margin: 0 0 26px; padding: 0 0 0 18px; font-size: 14px; color: var( --tekst ); }
.twz-reguly li { margin: 0 0 6px; }
.twz-reguly--pyt li { color: var( --tekst-mocny ); }
.twz-reguly--pyt li::marker { color: var( --zar ); }

@media ( max-width: 1000px ) { .twz-komponenty { grid-template-columns: 1fr 1fr; } .twz-dzialy { grid-template-columns: repeat( 3, 1fr ); } }
@media ( max-width: 640px ) { .twz-komponenty, .twz-dzialy { grid-template-columns: 1fr; } .twz-okno-demo__panel { width: 100%; } }

body:has( .twz ) .wp-block-post-content > .twz, body:has( .twz ) .entry-content > .twz, .twz { max-width: 1520px !important; margin-left: auto !important; margin-right: auto !important; }