@import "https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap";body{color:#1a1a1a;height:100vh;margin:0;font-family:Ubuntu,sans-serif;font-style:normal;font-weight:300;background:linear-gradient(135deg,#eef7ff,#ece6ff,#ffe0e7)!important}.app-container{max-width:1200px;margin:auto;padding:32px}header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}header h1{font-size:24px;font-weight:700}@media screen and (max-width:500px){.app-container{margin:auto;padding:12px}header{text-align:center;flex-direction:column;align-items:center}header h1{font-size:16px;font-weight:700}}.logo{vertical-align:middle;height:32px;margin-right:6px}.card-grid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:20px;width:100%;margin-top:30px;display:grid}.card{cursor:pointer;text-align:center;background:#fff;border:1px solid #e6e6e6;border-radius:12px;padding:22px;transition:all .25s;box-shadow:0 4px 12px #00000012}.card:hover{transform:translateY(-5px);box-shadow:0 6px 18px #0000001f}.card h3{margin:0;font-size:18px;font-weight:600}@media screen and (max-width:550px){.card-grid{grid-template-columns:repeat(auto-fit,minmax(159px,2fr));gap:12px}.card{border-radius:10px;padding:18px}.card h3{font-size:16px}}.section-box{background:#ffffffe6;border-radius:16px;margin-top:24px;padding:24px;box-shadow:0 4px 12px #00000014}.section-title{margin-bottom:16px;font-size:20px;font-weight:600}textarea,input[type=text],input[type=password]{resize:none;background:#fafafa;border:1px solid #ccc;border-radius:8px;outline:none;width:98%;padding:12px;font-size:14px}textarea:focus,input:focus{border-color:#6e8bff}button{cursor:pointer;background:#f5f5f5;border:1px solid #ccc;border-radius:8px;padding:10px 16px;transition:all .2s}button:hover{background:#e8e8e8}button.primary{color:#fff;background:#00b3fe;border:none}button.primary:hover{background:#00b3fe}.radio-group,.select-group{align-items:center;gap:12px;margin-top:12px;display:flex}select{border:1px solid #ccc;border-radius:8px;outline:none;padding:8px 12px}.output-info{color:#666;margin-top:12px;font-size:13px;line-height:1.4}footer{color:#666;margin-top:24px;font-size:13px}.mr-2{margin-right:8px}.mt-2{margin-top:8px}.header-section{justify-content:space-between;align-items:center;gap:12px;display:flex}
