:root{--bg:#171a1d;--top:#212120;--panel:#2d2e2f;--panel2:#303234;--card:#343638;--text:#b4b8bf;--title:#d8dde3;--muted:#7d848d;--line:#3c3f43;--accent:#f1404b;--orange:#ff8a18;--blue:#2d73ff;--green:#36c275;--radius:5px;--wrap:1400px;--font:"Helvetica Neue",Helvetica,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;padding-top:80px;color:var(--text);background:var(--bg);font-family:var(--font);font-size:14px;line-height:1.6}
a{color:var(--text);text-decoration:none;transition:color .18s ease,background .18s ease,transform .18s ease}a:hover{color:var(--accent)}button,input,textarea,select{font:inherit}

.topbar{position:fixed;inset:0 0 auto;z-index:50;height:80px;padding:10px 0;background:var(--top)}.topbar-inner{width:var(--wrap);max-width:calc(100% - 20px);height:60px;margin:0 auto;display:flex;align-items:center;gap:18px}
.logo{display:inline-flex;align-items:center;gap:10px;min-width:168px;color:var(--accent);font-size:22px;font-weight:700;white-space:nowrap}.logo-mark{position:relative;width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 62% 36%,#fff 0 6px,transparent 7px),conic-gradient(from -28deg,var(--accent) 0 67%,transparent 67% 79%,var(--orange) 79% 100%);box-shadow:0 2px 10px rgba(0,0,0,.18)}.logo-mark:after{content:"";position:absolute;left:16px;top:10px;width:6px;height:18px;border-radius:4px;background:#fff}
.topnav{display:flex;gap:2px;margin:0;padding:0;list-style:none}.topnav li{position:relative}.topnav a{height:60px;padding:0 11px;display:inline-flex;align-items:center;gap:6px;color:var(--text);font-size:16px}.topnav a:hover,.topnav a.active{color:var(--accent)}.topnav li:after{content:"";position:absolute;left:50%;bottom:0;width:20px;height:4px;border-radius:4px;background:var(--accent);transform:translateX(-50%);opacity:0;transition:opacity .18s ease}.topnav li:hover:after,.topnav li:has(a.active):after{opacity:1}.top-right{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:14px;color:var(--text)}
.wrap{width:var(--wrap);max-width:calc(100% - 20px);margin:16px auto 0}.hero{min-height:230px;padding:34px 38px;border-radius:var(--radius);background:radial-gradient(circle at 86% 18%,rgba(241,64,75,.2),transparent 28%),radial-gradient(circle at 12% 35%,rgba(45,115,255,.18),transparent 26%),linear-gradient(135deg,#2d2e2f,#24272b 56%,#202326);overflow:hidden;position:relative}.hero h1{margin:0 0 12px;color:#eef1f5;font-size:32px;line-height:1.15}.hero p{max-width:680px;margin:0;color:#aeb4bc;font-size:16px;line-height:1.8}.hero-actions{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}.btn{height:40px;padding:0 18px;border:0;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;gap:8px;color:#fff;background:var(--accent);font-weight:600;cursor:pointer}.btn:hover{color:#fff;background:#d72f39}.btn.ghost{color:var(--accent);background:transparent;box-shadow:inset 0 0 0 1px var(--accent)}.btn.dark{color:#d7dbe0;background:#303234;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}.section{margin-top:16px;border-radius:var(--radius);background:var(--panel);overflow:hidden}.section-head{height:44px;padding:0 16px;display:flex;align-items:center;gap:8px;color:#d4d9df;font-size:17px;font-weight:700}.dot{width:5px;height:14px;border-radius:4px;background:var(--accent);box-shadow:7px 5px 0 rgba(241,64,75,.55);transform:rotate(38deg);margin-right:5px}.grid{display:grid;gap:12px;padding:16px}.app-icon{width:42px;height:42px;border-radius:9px;display:grid;place-items:center;color:#fff;background:var(--accent);font-weight:800;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}.footer{width:var(--wrap);max-width:calc(100% - 20px);margin:18px auto 34px;text-align:center;color:#646b74;font-size:12px}
@media(max-width:991.98px){:root{--wrap:100%}body{padding-top:0;background:#171a1d}.topbar{position:absolute;height:64px;padding:0;background:#202122}.topbar-inner{width:100%;max-width:none;height:64px;padding:0 12px}.topnav,.top-right{display:none}.logo{min-width:0;font-size:20px}.logo-mark{width:31px;height:31px}.wrap{max-width:none;margin:0;padding:78px 12px 0}.hero{min-height:auto;padding:22px 18px}.hero h1{font-size:24px}.hero p{font-size:14px}.grid{padding:12px;gap:10px}.footer{width:100%;padding:0 12px}}

.submit-layout{display:grid;grid-template-columns:minmax(0,1fr)380px;gap:16px;align-items:start}.form-card{padding:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{color:#d2d7dd;font-weight:600}.field input,.field select,.field textarea{width:100%;border:0;outline:0;border-radius:5px;color:#d7dbe0;background:#27292b;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);padding:0 12px}.field input,.field select{height:42px}.field textarea{min-height:130px;padding:12px;resize:vertical;line-height:1.65}.tips{display:grid;gap:10px;padding:16px}.tip{padding:14px;border-radius:5px;background:#303234;display:flex;gap:12px}.tip .css-icon {color:var(--accent);flex:0 0 22px;font-size:22px}.flow{grid-template-columns:repeat(4,1fr)}.flow-card{padding:18px;border-radius:5px;background:#303234;text-align:center}.flow-card .app-icon{margin:0 auto 10px}.submit-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}@media(max-width:991.98px){.submit-layout{display:block}.form-grid{grid-template-columns:1fr}.flow{grid-template-columns:repeat(4,minmax(72px,1fr));gap:8px}.flow-card{padding:12px 6px}.flow-card .app-icon{width:34px;height:34px;margin-bottom:7px}.flow-card b{font-size:13px}.flow-card p{margin:5px 0 0;font-size:11px;line-height:1.45}.tips{padding:12px}.submit-actions{justify-content:stretch}.submit-actions .btn{flex:1}}

    .mobile-cat-toggle,
    .mobile-search-toggle,
    .mobile-category-panel,
    .mobile-search-panel { display: none; }
    @media (max-width: 991.98px) {
      .topbar {
        position: absolute !important;
        height: 64px !important;
        padding: 0 !important;
        background: #202122 !important;
        pointer-events: auto !important;
      }
      .topbar-inner {
        width: 100% !important;
        max-width: none !important;
        height: 64px !important;
        margin: 0 !important;
        padding: 0 14px !important;
        border-radius: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 0 !important;
        background: #202122 !important;
        box-shadow: 0 5px 16px rgba(0,0,0,.24) !important;
        pointer-events: auto !important;
      }
      .topbar-inner::after { content: none !important; }
      .topnav,
      .top-right { display: none !important; }
      .topbar .logo {
        position: static !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
        min-width: 0 !important;
        height: 64px !important;
        line-height: 64px !important;
        margin: 0 auto !important;
        gap: 8px !important;
        display: inline-flex !important;
        align-items: center !important;
        color: #ff2434 !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
      }
      .topbar .logo-mark {
        width: 31px !important;
        height: 31px !important;
        flex: 0 0 31px !important;
      }
      .topbar .logo-mark::after {
        left: 13px !important;
        top: 8px !important;
        width: 5px !important;
        height: 15px !important;
      }
      .mobile-cat-toggle,
      .mobile-search-toggle {
        width: 38px;
        height: 38px;
        border: 0;
        border-radius: 5px;
        display: grid;
        place-items: center;
        padding: 0;
        color: #c6ccd4;
        background: transparent;
        cursor: pointer;
        flex: 0 0 38px;
        z-index: 3;
      }
      .mobile-cat-toggle .css-icon,
      .mobile-search-toggle .css-icon,
      .mobile-search-line .css-icon {
        width: 23px;
        height: 23px;
      }
      body.mobile-search-open .mobile-search-toggle .css-icon { display: none; }
      body.mobile-search-open .mobile-search-toggle::before {
        content: "×";
        color: #c6ccd4;
        font-size: 38px;
        line-height: 28px;
        font-weight: 300;
      }
      .mobile-category-panel {
        position: fixed;
        left: 12px;
        right: 12px;
        top: 76px;
        z-index: 220;
        padding: 10px;
        border-radius: 5px;
        background: #262829;
        box-shadow: 0 16px 38px rgba(0,0,0,.35);
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
      }
      body.mobile-category-open .mobile-category-panel { display: grid; }
      .mobile-category-panel a {
        height: 38px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #c5cad1;
        background: #303234;
        font-size: 14px;
      }
      .mobile-category-panel a:hover { color: #fff; background: #383b3e; }
      .mobile-search-panel {
        position: fixed;
        left: 0;
        right: 0;
        top: 64px;
        z-index: 210;
        padding: 14px 12px 16px;
        background: #202122;
        box-shadow: 0 12px 26px rgba(0,0,0,.28);
      }
      body.mobile-search-open .mobile-search-panel { display: block; }
      .mobile-search-form {
        margin: 0;
        display: grid;
        grid-template-columns: 100px minmax(0, 1fr);
        border: 2px solid #f1404b;
        border-radius: 5px;
        overflow: hidden;
        background: #282a2d;
      }
      .mobile-search-tabs {
        display: grid;
        grid-template-columns: 1fr;
        background: #242628;
        border-right: 1px solid #383b3e;
      }
      .mobile-search-tabs button {
        height: 36px;
        border: 0;
        border-bottom: 1px solid #34373a;
        color: #9fa6ae;
        background: transparent;
        font-size: 13px;
        cursor: pointer;
      }
      .mobile-search-tabs button:last-child { border-bottom: 0; }
      .mobile-search-tabs button.active {
        color: #fff;
        background: rgba(241,64,75,.16);
      }
      .mobile-search-line {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 54px;
        min-height: 108px;
      }
      .mobile-search-line input {
        width: 100%;
        min-width: 0;
        border: 0;
        outline: 0;
        padding: 0 14px;
        color: #d9dde3;
        background: #282a2d;
        font-size: 15px;
      }
      .mobile-search-line input::placeholder { color: #717983; }
      .mobile-search-line button {
        border: 0;
        display: grid;
        place-items: center;
        color: #fff;
        background: #f1404b;
        cursor: pointer;
      }
      .hero .search-wrap { display: none !important; }
      .mobile-menu,
      .mobile-side-toggle { display: none !important; }
    }

    @media (max-width: 991.98px) {
      .topbar .logo > span:last-child {
        display: inline !important;
        position: static !important;
        flex-direction: row !important;
        gap: 0 !important;
        letter-spacing: .2px !important;
      }
      .topbar .logo > span:last-child::after {
        content: none !important;
        display: none !important;
      }
      .mobile-category-panel {
        display: none;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 12px !important;
      }
      body.mobile-category-open .mobile-category-panel { display: grid !important; }
      .mobile-primary-nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
      }
      .mobile-primary-nav a,
      .mobile-subcats a {
        min-width: 0;
        height: 36px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #c5cad1;
        background: #303234;
        font-size: 13px;
      }
      .mobile-primary-nav a:first-child {
        color: #fff;
        background: rgba(241,64,75,.2);
      }
      .mobile-sub-title {
        padding: 2px 2px 0;
        color: #7d848d;
        font-size: 12px;
      }
      .mobile-subcats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 7px;
      }
      .mobile-subcats a {
        height: 32px;
        color: #9fa6ae;
        background: #292b2d;
        font-size: 12px;
      }
      .mobile-subcats a:hover,
      .mobile-primary-nav a:hover {
        color: #fff;
        background: #383b3e;
      }
      .mobile-search-form {
        grid-template-columns: 94px minmax(0, 1fr) !important;
        min-height: 48px !important;
      }
      .mobile-search-select {
        height: 48px;
        display: block;
        position: relative;
        background: #242628;
        border-right: 1px solid #383b3e;
      }
      .mobile-search-select::after {
        content: "";
        position: absolute;
        right: 12px;
        top: 50%;
        width: 7px;
        height: 7px;
        border-right: 1px solid #9fa6ae;
        border-bottom: 1px solid #9fa6ae;
        transform: translateY(-65%) rotate(45deg);
        pointer-events: none;
      }
      .mobile-search-select select {
        width: 100%;
        height: 48px;
        border: 0;
        outline: 0;
        padding: 0 26px 0 13px;
        appearance: none;
        -webkit-appearance: none;
        color: #d8dde3;
        background: transparent;
        font-size: 14px;
      }
      .mobile-search-tabs { display: none !important; }
      .mobile-search-line {
        min-height: 48px !important;
        grid-template-columns: minmax(0, 1fr) 50px !important;
      }
    }

    .mobile-search-select select,
    .mobile-search-select select option {
      color-scheme: dark;
      color: #d8dde3 !important;
      background: #242628 !important;
    }

    /* Keep the four submission steps on one horizontal row on small screens. */
    @media (max-width: 991.98px) {
      .flow {
        display: flex;
        grid-template-columns: none;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-width: thin;
      }
      .flow-card {
        flex: 0 0 142px;
        padding: 12px 9px;
      }
      .flow-card b { white-space: nowrap; }
    }