:root{--bg:#f6f8fb;--soft:#fff;--card:rgba(255,255,255,.84);--text:#121826;--muted:#637083;--line:rgba(18,24,38,.1);--p:#2663ff;--p2:#7c3aed;--good:#0f9f6e;--bad:#dc2626;--shadow:0 24px 70px rgba(15,23,42,.12);--focus:0 0 0 4px rgba(38,99,255,.18)}[data-theme=dark]{--bg:#080b12;--soft:#0e1422;--card:rgba(17,24,39,.86);--text:#eef2ff;--muted:#9aa7bc;--line:rgba(238,242,255,.12);--p:#77a4ff;--p2:#c084fc;--good:#34d399;--bad:#fb7185;--shadow:0 24px 70px rgba(0,0,0,.38);--focus:0 0 0 4px rgba(119,164,255,.2)}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Inter,system-ui,sans-serif;color:var(--text);background:radial-gradient(circle at top left,rgba(38,99,255,.2),transparent 32rem),radial-gradient(circle at top right,rgba(124,58,237,.18),transparent 30rem),linear-gradient(135deg,var(--bg),var(--soft))}.shell{width:min(1180px,calc(100% - 28px));margin:auto;padding:18px 0 28px}.top{position:sticky;top:10px;z-index:40;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 14px;margin-bottom:24px;border:1px solid var(--line);border-radius:22px;background:var(--card);box-shadow:0 10px 30px rgba(0,0,0,.12);backdrop-filter:blur(22px)}.brand{display:flex;align-items:center;gap:10px;font-weight:850}.logo{display:grid;place-items:center;width:44px;height:44px;border-radius:15px;color:#fff;background:linear-gradient(135deg,var(--p),var(--p2))}.logo svg{width:27px}.tools{display:flex;gap:10px}.theme,.langbtn{display:flex;align-items:center;gap:9px;min-height:44px;padding:9px 13px;border:1px solid var(--line);border-radius:999px;color:var(--text);background:var(--card);font-weight:800}.custom{position:relative}.menu{position:absolute;right:0;top:calc(100% + 8px);display:none;min-width:190px;padding:7px;border:1px solid var(--line);border-radius:16px;background:var(--soft);box-shadow:var(--shadow)}.custom.open .menu{display:grid;gap:4px}.choice{display:flex;align-items:center;gap:9px;width:100%;padding:11px;border-radius:11px;color:var(--text);background:transparent;border:0;font-weight:750;text-align:left}.choice:hover,.choice.sel{color:#fff;background:linear-gradient(135deg,var(--p),var(--p2))}.flag{width:24px;height:16px;border-radius:3px;box-shadow:0 0 0 1px rgba(127,127,127,.2)}.hero{display:grid;grid-template-columns:1fr minmax(320px,440px);gap:24px}.card{padding:clamp(20px,3vw,30px);border:1px solid var(--line);border-radius:26px;background:var(--card);box-shadow:var(--shadow);backdrop-filter:blur(22px)}.intro{margin-bottom:24px}.eyebrow{color:var(--p);font-weight:800}h1{margin:14px 0 10px;font-size:clamp(2rem,5vw,4.5rem);line-height:.98;letter-spacing:-.065em}.lead,.hint,.note{color:var(--muted);line-height:1.65}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px;margin:20px 0;border-radius:17px;background:color-mix(in srgb,var(--muted) 10%,transparent)}button,input,textarea{font:inherit}.tab,.btn{border:0;border-radius:13px;padding:11px;color:var(--muted);background:transparent;font-weight:800}.tab.on,.primary{color:#fff;background:linear-gradient(135deg,var(--p),var(--p2))}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.field{display:grid;gap:7px}.full{grid-column:1/-1}label{font-weight:750}input,textarea,.selectbtn{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:15px;color:var(--text);background:var(--soft);outline:0}input:focus,textarea:focus,.selectbtn:focus{border-color:var(--p);box-shadow:var(--focus)}textarea{min-height:110px;resize:vertical}.select{position:relative}.selectbtn{display:flex;justify-content:space-between;text-align:left;font-weight:700}.selectmenu{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 7px);display:none;padding:7px;border:1px solid var(--line);border-radius:15px;background:var(--soft);box-shadow:var(--shadow)}.select.open .selectmenu{display:grid}.opt{padding:10px;border:0;border-radius:10px;color:var(--text);background:transparent;text-align:left}.opt:hover,.opt.sel{color:#fff;background:linear-gradient(135deg,var(--p),var(--p2))}.preview{position:sticky;top:94px;align-self:start}.qrbox{display:grid;place-items:center;min-height:350px;padding:25px;border:1px solid var(--line);border-radius:22px}#qr{width:min(100%,320px)}#qr canvas,#qr svg{width:100%!important;height:auto!important;border-radius:16px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.btn{min-height:46px;color:var(--text);background:var(--soft);border:1px solid var(--line)}.btn.primary{color:#fff}.status{min-height:22px;color:var(--good)}.footer{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:24px;padding:17px 20px}.footlinks{display:flex;align-items:center;gap:10px}.footer a{color:var(--p);font-weight:800;text-decoration:none}.consentBtn{display:flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid var(--line);border-radius:11px;color:var(--muted);background:var(--soft);font-weight:750}.consentBtn svg{width:17px}.banner{position:fixed;z-index:60;left:20px;right:20px;bottom:20px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;max-width:980px;margin:auto;padding:18px}.bannerBtns{display:flex;gap:8px;flex-wrap:wrap}.modalbg{position:fixed;z-index:70;inset:0;display:none;place-items:center;padding:18px;background:rgba(0,0,0,.45)}.modalbg.open{display:grid}.modal{width:min(560px,100%)}.hidden{display:none!important}@media(max-width:900px){.hero{grid-template-columns:1fr}.preview{position:relative;top:0}}@media(max-width:650px){.top{align-items:flex-start}.tools{flex-direction:column}.tabs,.grid,.actions{grid-template-columns:1fr}.banner{grid-template-columns:1fr}.footlinks{width:100%;justify-content:space-between}}

.arrow-icon{width:10px;height:10px;flex:0 0 auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s ease}.custom.open .arrow-icon,.select.open .arrow-icon{transform:rotate(225deg) translate(-2px,-2px)}
input[type=color]{display:block;width:100%;height:48px;padding:5px;border:1px solid var(--line);border-radius:15px;background:var(--soft);cursor:pointer;overflow:hidden}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:0;border-radius:10px}input[type=color]::-moz-color-swatch{border:0;border-radius:10px}
.consent-options{display:grid;gap:10px;margin:18px 0}.consent-option{display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--soft);cursor:pointer}.consent-option:has(input:checked){border-color:var(--p);box-shadow:var(--focus)}.consent-option input{width:18px;height:18px;margin-top:2px;accent-color:var(--p)}.consent-option strong{display:block}.consent-option small{display:block;margin-top:4px;color:var(--muted);line-height:1.45}

.tab{position:relative;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}.tab.on{transform:translateY(-2px) scale(1.025);box-shadow:0 8px 24px rgba(84,132,255,.34),0 0 22px rgba(168,100,255,.22);filter:saturate(1.08)}.panel:not(.hidden){animation:panelPop .22s ease both}.panel:not(.hidden) input:focus,.panel:not(.hidden) textarea:focus{transform:translateY(-1px);box-shadow:var(--focus),0 8px 22px rgba(38,99,255,.12)}@keyframes panelPop{from{opacity:.75;transform:translateY(4px) scale(.995)}to{opacity:1;transform:translateY(0) scale(1)}}

/* Liquid glass refinement: visual-only, keeps existing layout and behavior */
.top,.card,.menu,.selectmenu,.modal,.banner{isolation:isolate;overflow:visible;background:linear-gradient(145deg,color-mix(in srgb,var(--card) 86%,rgba(255,255,255,.18)),color-mix(in srgb,var(--card) 70%,transparent));border-color:color-mix(in srgb,var(--line) 72%,rgba(255,255,255,.32));-webkit-backdrop-filter:blur(28px) saturate(155%);backdrop-filter:blur(28px) saturate(155%);box-shadow:0 22px 55px rgba(15,23,42,.14),inset 0 1px 0 rgba(255,255,255,.48),inset 0 -1px 0 rgba(255,255,255,.08);transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,transform .25s cubic-bezier(.2,.8,.2,1)}
.top{overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--card) 76%,rgba(255,255,255,.22)),color-mix(in srgb,var(--card) 58%,transparent));box-shadow:0 16px 44px rgba(15,23,42,.18),inset 0 1px 0 rgba(255,255,255,.58),inset 0 -1px 0 rgba(255,255,255,.10)}
.top::before,.card::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:0;border-radius:inherit;background:linear-gradient(115deg,rgba(255,255,255,.34),rgba(255,255,255,.06) 32%,transparent 56%,rgba(124,58,237,.08));opacity:.62}
.top::after{content:"";position:absolute;pointer-events:none;top:-120%;left:-28%;width:34%;height:340%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);animation:glassSheen 9s ease-in-out infinite}
.theme,.langbtn,.selectbtn,.btn,.consentBtn{background:linear-gradient(145deg,color-mix(in srgb,var(--soft) 76%,rgba(255,255,255,.18)),color-mix(in srgb,var(--soft) 62%,transparent));border-color:color-mix(in srgb,var(--line) 72%,rgba(255,255,255,.28));-webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 7px 20px rgba(15,23,42,.08);transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease,border-color .2s ease,background .25s ease}
.theme:hover,.langbtn:hover,.selectbtn:hover,.btn:hover,.consentBtn:hover{transform:translateY(-1px) scale(1.012);border-color:color-mix(in srgb,var(--p) 38%,var(--line));box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 11px 26px rgba(38,99,255,.13)}
.theme:active,.langbtn:active,.selectbtn:active,.btn:active,.consentBtn:active{transform:translateY(0) scale(.985)}
.menu,.selectmenu{overflow:hidden;animation:glassMenuIn .2s cubic-bezier(.2,.8,.2,1) both}.choice,.opt{transition:transform .18s ease,background .2s ease,box-shadow .2s ease}.choice:hover,.opt:hover{transform:translateX(2px)}
.qrbox,input,textarea,input[type=color]{background:linear-gradient(145deg,color-mix(in srgb,var(--soft) 86%,rgba(255,255,255,.15)),color-mix(in srgb,var(--soft) 72%,transparent));box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(0,0,0,.035);transition:box-shadow .25s ease,border-color .25s ease,transform .2s ease}
input:focus,textarea:focus{box-shadow:var(--focus),inset 0 1px 0 rgba(255,255,255,.35),0 12px 28px rgba(38,99,255,.12)}
[data-theme=dark] .top,[data-theme=dark] .card,[data-theme=dark] .menu,[data-theme=dark] .selectmenu,[data-theme=dark] .modal,[data-theme=dark] .banner{border-color:rgba(255,255,255,.12);box-shadow:0 24px 60px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.13),inset 0 -1px 0 rgba(255,255,255,.035)}
[data-theme=dark] .top::before,[data-theme=dark] .card::before{background:linear-gradient(115deg,rgba(255,255,255,.12),rgba(255,255,255,.025) 34%,transparent 58%,rgba(124,58,237,.10))}
@keyframes glassSheen{0%,72%,100%{left:-38%;opacity:0}80%{opacity:.48}94%{left:120%;opacity:0}}
@keyframes glassMenuIn{from{opacity:0;transform:translateY(-7px) scale(.975);filter:blur(3px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@media(prefers-reduced-motion:reduce){.top::after{animation:none}.menu,.selectmenu{animation:none}.top,.card,.theme,.langbtn,.selectbtn,.btn,.consentBtn{transition:none}}

/* Targeted fixes: dropdown stacking and field validation */
.top{overflow:visible!important;z-index:100}.top::after{border-radius:inherit;clip-path:inset(0 round 22px)}.tools,.custom{position:relative;z-index:110}.custom.open{z-index:130}.custom .menu{z-index:140;overflow:hidden}.field-error{margin:2px 2px 0;color:var(--bad);font-size:.82rem;line-height:1.4}.invalid{border-color:var(--bad)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--bad) 18%,transparent)!important}.valid{border-color:color-mix(in srgb,var(--good) 62%,var(--line))!important}
.top::after{inset:0!important;top:0!important;left:0!important;width:auto!important;height:auto!important;transform:none!important;border-radius:inherit;background:linear-gradient(112deg,transparent 0%,transparent 34%,rgba(255,255,255,.30) 47%,transparent 60%,transparent 100%)!important;background-size:240% 100%!important;background-position:130% 0;animation:glassSheenContained 9s ease-in-out infinite!important}.card:has(.select.open){position:relative;z-index:80}.select.open{z-index:200}.select.open .selectmenu{z-index:210}.footer{position:relative;z-index:1}#qr.no-margin canvas,#qr.no-margin svg{border-radius:0!important}@keyframes glassSheenContained{0%,72%,100%{background-position:130% 0;opacity:0}80%{opacity:.48}94%{background-position:-130% 0;opacity:0}}@media(prefers-reduced-motion:reduce){.top::after{animation:none!important}}

.appearance-grid{margin-top:20px}