:root{color:#122033;font-synthesis:none;text-rendering:optimizelegibility;--navy:#0b2545;--navy-deep:#071827;--orange:#f5821f;--orange-light:#ff9d40;--muted:#647184;--line:#e3e8ef;--surface:#fff;background:#f5f7fa;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#f5f7fa;min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #f5821f47}.app-shell{min-height:100vh}.sidebar{z-index:20;color:#fff;background:radial-gradient(circle at 15% 4%, #194a7a 0, var(--navy) 35%, var(--navy-deep) 100%);flex-direction:column;width:250px;padding:30px 20px;display:flex;position:fixed;inset:0 auto 0 0}.brand{color:inherit;letter-spacing:-.025em;align-items:center;gap:10px;font-size:18px;font-weight:750;text-decoration:none;display:inline-flex}.brand img{width:35px;height:35px}.brand strong{color:var(--orange-light)}.sidebar nav{gap:8px;margin-top:54px;display:grid}.nav-item{color:#ffffffab;border-radius:11px;grid-template-columns:23px 1fr auto;align-items:center;gap:12px;min-height:47px;padding:0 14px;font-size:14px;font-weight:650;text-decoration:none;display:grid}.nav-item svg{width:20px}.nav-item.active{color:#fff;box-shadow:inset 3px 0 var(--orange);background:#ffffff1c}.nav-item.disabled{cursor:default;opacity:.65}.nav-item small{color:var(--orange-light);letter-spacing:.05em;text-transform:uppercase;font-size:9px}.sidebar-language{color:#fff9;justify-content:space-between;align-items:center;gap:12px;margin:22px 4px 0;font-size:10px;font-weight:700;display:flex}.sidebar-language .language-switch{background:#00000021;border-color:#ffffff21}.sidebar-language .language-switch button{color:#ffffff9e}.sidebar-language .language-switch button.selected{color:var(--navy);background:#fff}.sidebar-note{color:#fff9;border:1px solid #ffffff1c;border-radius:12px;grid-template-columns:10px 1fr;gap:3px 9px;margin-top:auto;padding:16px 14px;font-size:11px;display:grid}.sidebar-note strong{color:#fff;grid-column:2;font-size:13px}.status-dot{background:#41d68d;border-radius:50%;width:8px;height:8px;margin-top:3px;box-shadow:0 0 0 4px #41d68d1f}.main-content{margin-left:250px;padding:0 46px 30px}.topbar{display:none}.hero-intro{max-width:1220px;margin:0 auto;padding:58px 0 34px}.eyebrow{color:#b65106;letter-spacing:.08em;text-transform:uppercase;background:#fff3e9;border:1px solid #f5821f38;border-radius:999px;padding:6px 11px;font-size:10px;font-weight:800;display:inline-flex}.hero-intro h1{max-width:780px;color:var(--navy);letter-spacing:-.045em;margin:17px 0 0;font-size:clamp(32px,4vw,50px);line-height:1.08}.hero-intro p{max-width:690px;color:var(--muted);margin:14px 0 0;font-size:16px;line-height:1.65}.workspace{grid-template-columns:minmax(330px,.82fr) minmax(500px,1.18fr);align-items:start;gap:22px;max-width:1220px;margin:0 auto;display:grid}.panel{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 45px -34px #0b254566}.form-panel,.preview-panel{overflow:hidden}.panel-heading{border-bottom:1px solid var(--line);background:#fbfcfd;min-height:88px;padding:20px 23px}.panel-heading>div:first-child{align-items:center;gap:10px;display:flex}.panel-heading h2,.guide h2{color:var(--navy);letter-spacing:-.015em;margin:0;font-size:17px}.panel-heading p{color:var(--muted);margin:6px 0 0 38px;font-size:12px}.step-number{color:#fff;background:var(--orange);border-radius:8px;flex:0 0 28px;place-items:center;width:28px;height:28px;font-size:10px;font-weight:850;display:inline-grid}.field-grid{grid-template-columns:1fr 1fr;gap:17px 13px;padding:23px;display:grid}.field{gap:7px;display:grid}.field-wide{grid-column:1/-1}.field span{color:#344156;font-size:11px;font-weight:750}.field input,.field select{width:100%;min-height:42px;color:var(--navy);background:#fff;border:1px solid #d7dee8;border-radius:9px;padding:10px 11px;font-size:13px;transition:border-color .18s,box-shadow .18s}.field input:hover,.field select:hover{border-color:#b5c0ce}.field input:focus,.field select:focus{border-color:var(--orange);outline:none;box-shadow:0 0 0 3px #f5821f1c}.field input::placeholder{color:#a5afbc}.form-actions,.preview-actions{gap:10px;padding:0 23px 23px;display:flex}.button{cursor:pointer;border:1px solid #0000;border-radius:9px;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:9px 15px;font-size:12px;font-weight:750;transition:transform .16s,box-shadow .16s,background .16s;display:inline-flex}.button:hover{transform:translateY(-1px)}.button.primary{color:#fff;background:var(--orange);box-shadow:0 9px 18px -11px #f5821fcc}.button.primary:hover{background:#dd6e12}.button.secondary{color:var(--navy);background:#fff;border-color:#d5dce5}.button.hostinger-button{color:#9a490c;background:#fff8f1;border-color:#f4c79e}.button.ghost{color:var(--muted);background:0 0}.preview-heading{justify-content:space-between;align-items:center;gap:14px;display:flex}.background-toggle,.language-switch{border:1px solid var(--line);background:#f3f5f8;border-radius:8px;padding:3px;display:inline-flex}.background-toggle button,.language-switch button{cursor:pointer;min-height:28px;color:var(--muted);background:0 0;border:0;border-radius:6px;padding:5px 9px;font-size:10px;font-weight:750}.background-toggle button.selected,.language-switch button.selected{color:var(--navy);background:#fff;box-shadow:0 2px 7px #0b25451a}.preview-stage{align-items:center;min-height:284px;padding:36px 30px;transition:background .2s;display:flex;overflow-x:auto}.preview-stage.white{background:#fff}.preview-stage.gray{background-color:#edf1f5;background-image:radial-gradient(#c7ced8 .7px,#0000 .7px);background-size:13px 13px}.preview-stage>div{background:#fff;border:1px solid #0b254512;border-radius:8px;min-width:510px;padding:25px;box-shadow:0 10px 25px -22px #0b254566}.preview-actions{border-top:1px solid var(--line);padding-top:20px}.copy-help{color:var(--muted);margin:-12px 23px 22px;font-size:10px;line-height:1.5}.copy-help strong{color:var(--navy)}.guide{grid-template-columns:.62fr 1.38fr;align-items:start;gap:30px;max-width:1220px;margin:22px auto 0;padding:24px;display:grid}.guide-copy{align-items:flex-start;gap:12px;display:flex}.guide-copy p{color:var(--muted);margin:7px 0 0;font-size:12px;line-height:1.55}.guide-body{min-width:0}.guide-tabs{gap:7px;margin-bottom:18px;padding-bottom:5px;display:flex;overflow-x:auto}.guide-tabs button{cursor:pointer;color:#526075;background:#fff;border:1px solid #d9e0e8;border-radius:8px;flex:none;min-height:34px;padding:7px 11px;font-size:10px;font-weight:750}.guide-tabs button:hover{border-color:#b7c1ce}.guide-tabs button.selected{color:#fff;border-color:var(--navy);background:var(--navy)}.guide-instructions h3{color:var(--navy);margin:0 0 13px;font-size:14px}.guide ol{grid-template-columns:1fr 1fr;gap:11px 18px;margin:0;padding:0;list-style:none;display:grid}.guide li{color:#465469;align-items:flex-start;gap:9px;font-size:11px;line-height:1.45;display:flex}.guide li span{width:21px;height:21px;color:var(--orange);background:#fff1e6;border-radius:50%;flex:0 0 21px;place-items:center;font-size:9px;font-weight:850;display:grid}.guide-note{border-left:3px solid var(--orange);color:#5c6879;background:#fff8f1;border-radius:0 7px 7px 0;margin:17px 0 0;padding:11px 13px;font-size:10px;line-height:1.55}.guide-note strong{color:#984b0e}.guide-source-warning{color:#6f3b20;margin:10px 0 0;font-size:10px;line-height:1.55}.guide-source-warning strong{color:#a84113}footer{color:#8a95a4;text-align:center;max-width:1220px;margin:25px auto 0;font-size:10px}.toast{z-index:50;color:#fff;background:var(--navy);opacity:0;pointer-events:none;border-radius:10px;align-items:center;gap:9px;max-width:360px;padding:13px 17px;font-size:12px;font-weight:650;transition:opacity .2s,transform .2s;display:flex;position:fixed;bottom:25px;right:25px;transform:translateY(12px);box-shadow:0 18px 35px -18px #071827cc}.toast.visible{opacity:1;transform:translateY(0)}.toast span{color:#5be09d;font-size:16px}@media (width<=1050px){.sidebar{width:210px}.main-content{margin-left:210px;padding-inline:28px}.workspace{grid-template-columns:1fr}}@media (width<=720px){.sidebar{display:none}.main-content{margin-left:0;padding:0 16px 24px}.topbar{min-height:66px;color:var(--navy);border-bottom:1px solid var(--line);background:#fff;justify-content:space-between;align-items:center;margin-inline:-16px;padding:0 17px;display:flex}.topbar .brand strong{color:var(--orange)}.topbar .brand img{width:30px;height:30px}.hero-intro{padding:39px 0 25px}.hero-intro h1{font-size:34px}.workspace{grid-template-columns:minmax(0,1fr)}.field-grid{grid-template-columns:1fr}.field-wide{grid-column:auto}.preview-heading{flex-direction:column;align-items:flex-start}.preview-stage{padding:25px 18px}.guide,.guide ol{grid-template-columns:1fr}.form-actions,.preview-actions{flex-direction:column}.button{width:100%}.toast{bottom:16px;left:16px;right:16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}