:root{--color-primary: #4CAF50;--color-secondary: #008CBA;--color-background: #f1f1f1;--color-text-light: white;--color-error: #f87b00;--font-family-base: Rubik, sans-serif;--font-size-base: 16px}body{margin:0;padding:0}#app{font-family:var(--font-family-base);background-color:var(--color-background);direction:rtl;text-align:right;min-height:100vh;display:flex;flex-direction:column;font-size:var(--font-size-base);@media (max-width: 480px){font-size:calc(var(--font-size-base) * .875)}header{background-color:var(--color-primary);padding:1.25rem;text-align:center;h1{color:var(--color-text-light);margin:0;font-size:1.5rem;@media (max-width: 480px){font-size:1.25rem}}}main{padding:1.25rem;flex-grow:1}.logo{display:block;margin:0 auto 1.25rem;max-width:9.375rem;@media (max-width: 480px){max-width:7.5rem}}.share-button{display:block;margin:1.875rem auto;padding:.75rem 1.5rem;font-size:1rem;background-color:var(--color-secondary);color:var(--color-text-light);border:none;border-radius:.3125rem;cursor:pointer;transition:background-color .3s ease;&:hover{filter:brightness(90%)}&:disabled{background-color:#ccc;cursor:not-allowed}@media (max-width: 480px){font-size:.875rem;padding:.625rem 1.25rem}}.share-code,.share-status,.mobile-message{text-align:center}.share-code{font-size:1.25rem;font-weight:700;margin-top:1.25rem;@media (max-width: 480px){font-size:1.125rem}}.share-status{font-size:1rem;margin-top:1.25rem;@media (max-width: 480px){font-size:.875rem}}.disconnect-button{display:block;margin:1.875rem auto;padding:.75rem 1.5rem;font-size:1rem;color:var(--color-text-light);border:none;border-radius:.3125rem;cursor:pointer;transition:background-color .3s ease;min-width:12.5rem;background-color:var(--color-error)}.disconnect-button:hover{background-color:#bd2130}.mobile-message{font-size:1.125rem;margin-top:2.5rem;@media (max-width: 480px){font-size:1rem}}.footer{background-color:var(--color-primary);color:var(--color-text-light);padding:.625rem;text-align:center;font-size:.875rem;display:flex;justify-content:center;align-items:center;margin-top:1.25rem;@media (max-width: 480px){font-size:.75rem}a{color:var(--color-text-light);text-decoration:none;display:flex;align-items:center;gap:.625rem}img{height:1.25rem;margin-left:.3125rem;@media (max-width: 480px){height:1rem}}}}