/* Visual language of multicom.com.pl: white, neutral grey, red #dd1f26,
   Lato body / Open Sans headings and square buttons. Keyboard colors are independent. */
@font-face{font-family:Lato;src:url('fonts/lato-regular-ext.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Lato;src:url('fonts/lato-regular.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Lato;src:url('fonts/lato-bold-ext.woff2') format('woff2');font-weight:700;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Lato;src:url('fonts/lato-bold.woff2') format('woff2');font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Open Sans';src:url('fonts/open-sans-ext.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Open Sans';src:url('fonts/open-sans.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--ink:#333;--muted:#747474;--green:#dd1f26;--mint:#fbecee;--line:#e5e5e5;--paper:#fff;font-family:Lato,Arial,sans-serif;background:#fff}
main{max-width:1280px;padding:38px 40px 0}.intro{padding-bottom:26px;border-bottom:1px solid var(--line);margin-bottom:32px}h1,h2{font-family:"Open Sans",Arial,sans-serif;font-weight:400}h1{font-size:clamp(27px,3vw,38px);letter-spacing:-1px}h2{font-size:26px;line-height:1.3}.intro p{line-height:1.7}.eyebrow{letter-spacing:1.2px}.wifi-mark{background:#fafafa;border-color:#eee;border-radius:0}.workspace{grid-template-columns:205px minmax(0,1fr);gap:30px}.chapter{color:#777}.chapter:hover{color:#dd1f26}.chapter .number{border-radius:0;border-color:#ddd;background:#fff}.chapter.done .number{background:#fbecee;border-color:#f2ccd0;color:#dd1f26}.chapter.active .number{background:#dd1f26;border-color:#dd1f26}.aside-note,.aside-note span{color:#888}
.guide{border-color:#e0e0e0;border-radius:0;box-shadow:none}.guide-body{grid-template-columns:48% 52%;min-height:570px}.device-area{background:#f5f5f5}.device-area:before{display:none}.device-caption,.device-legend{color:#777}.device-caption button{background:#fff;border-color:#ddd;color:#666;border-radius:0}.live-dot{background:#999}.legend-key{border-color:#edae36;border-radius:2px}#device{max-width:295px;filter:drop-shadow(0 10px 9px #0002)}.instruction-area{padding:36px 30px 22px}.step-tag{color:#dd1f26;letter-spacing:.8px}.step-tag:before{height:2px}.key-chip{background:#f5f5f5;border-color:#ddd;border-radius:0}.seq-arrow{color:#999}.expect{border:0;border-left:3px solid #dd1f26;border-radius:0;background:#f7f7f7}.expect .small-label{color:#777}.expect p{color:#555!important}.tip{color:#888}.primary,.secondary{border-radius:0}.primary{text-transform:uppercase;letter-spacing:.25px}.primary:hover{background:#bd161c;border-color:#bd161c}.secondary{border-color:#ddd;color:#666}.secondary:hover{background:#f4f4f4}.help-button{color:#777}.help-button:hover{color:#dd1f26}
footer{border-top:1px solid var(--line);margin-top:26px;padding:20px 0;align-items:center;flex-wrap:wrap;color:#888}footer b{color:#666}footer a:hover{color:#dd1f26}footer .text-button{padding:0;font-size:10px}dialog{border-radius:0;border-color:#ddd;box-shadow:0 24px 80px #0003}dialog::backdrop{background:#2228;backdrop-filter:none}.help-option{background:#f7f7f7;border-radius:0;color:#555}.help-option:hover{color:#dd1f26;border-color:#dd1f26}.help-answer{background:#f7f7f7;border-radius:0}textarea{border-color:#ddd;border-radius:0}#zoom-dialog{max-width:520px}#zoom-device{max-width:430px}
/* Preserve white primary legends, blue SHIFT functions, red arrows and power. */
.key-active{animation:none}.key-active .key-highlight{opacity:1;animation:key-glow 2.5s ease-in-out infinite;filter:drop-shadow(0 0 2px #ffbd42)}
@keyframes key-glow{50%{opacity:.65;filter:drop-shadow(0 0 4px #ffbd42)}}
@media(min-width:1500px){main{padding-top:42px}.guide-body{min-height:570px}.instruction-area{padding:36px 30px 22px}#device{max-width:295px}}
@media(max-width:1150px){main{padding:30px 26px 0}.workspace{grid-template-columns:165px minmax(0,1fr);gap:22px}.instruction-area{padding:30px 22px}h2{font-size:24px}}
@media(max-width:850px){.workspace{grid-template-columns:minmax(0,1fr);gap:12px}.intro{margin-bottom:24px}.guide-body{min-height:500px}footer{line-height:1.7}footer span:nth-child(2){order:4;width:100%}}
@media(max-width:560px){main{padding:24px 14px 0}.intro{margin:0 0 22px;padding-bottom:20px}h1{font-size:28px;letter-spacing:-.8px}.guide-body{grid-template-columns:1fr}#device{max-width:238px;margin:5px auto 0}.device-legend{padding-top:10px}.instruction-area{padding:24px 22px 21px}h2{font-size:25px}footer{margin-top:22px;padding:18px 0}#zoom-device{max-width:360px}}
