body {
            margin: 0;
            padding: 0;
            height: 100%;
            background-color: #f5f5f5;
        }

        #app-frame {
            width: 100%;
            border: none;
        }

        .converter-app {
            align-items: center;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }


        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        h1 {
            color: #111;
            font-size: clamp(1.8rem, 5vw, 2.2rem);
            font-weight: 600;
            margin-bottom: 8px;
        }

        .subtitle {
            color: var(--text-secondary);
            font-size: clamp(.9rem, 2.5vw, 1rem);
            line-height: 1.5;
            margin-bottom: 24px;
            max-width: 600px;
        }

        .a2 {
            padding-top: 50px;
            padding-left: 16px;
            padding-right: 16px;
            text-align: center;
        }

        .header {
            width: 100%;
            /* border: 1px solid red; */
            padding: 0 16px;
            display: flex;
            justify-content: center;
            font-size: 20px;
            color: #333;
            /* gap:24px; */
            /* background-color: white; */
            min-height: 60px;
            align-items: center;
            border-bottom: 1px solid #eee;
        }

        .header div {
            padding: 16px 24px;
        }

        .header a {
            display: inline-block;
            color: #666;
            text-decoration: none;
        }

        .header .active {
            color: #2196F3 !important;
        }