.htp-hero{text-align:center;padding:34px 18px 8px}.htp-hero h1{font-size:clamp(28px,7vw,40px);font-weight:900;letter-spacing:-.5px;margin:6px 0 4px;background:linear-gradient(120deg,#ff8a2a,#ff5a3d);-webkit-background-clip:text;background-clip:text;color:transparent}.htp-hero .sub{margin:4px 0 0;color:var(--ink2);font-size:15px}.htp-wrap{max-width:620px;margin:0 auto;padding:0 18px 70px}.htp h2{font-size:19px;margin:36px 0 14px;display:flex;align-items:center;gap:9px;font-weight:900;color:var(--ink)}.htp h2 .n{flex:none;width:30px;height:30px;border-radius:9px;color:#3a1f00;font-size:15px;font-weight:900;display:grid;place-items:center;background:linear-gradient(120deg,var(--cta1),var(--cta2));box-shadow:0 4px 10px #ff8c284d}.htp .card{background:#fff;border:1px solid rgba(200,140,40,.18);border-radius:16px;padding:16px;margin:10px 0;box-shadow:var(--shadow)}.htp .card.lead{background:linear-gradient(135deg,#fff3cf,#fff8ec);border-color:#ffb22066}.htp p{margin:8px 0;font-size:15.5px;color:var(--ink)}.htp .muted{color:var(--ink2);font-size:14px}.htp b{color:var(--sun2)}.htp .big{font-size:17px}.htp .tag{display:inline-block;font-size:12.5px;padding:1px 8px;border-radius:20px;background:#ffb2201f;color:var(--ink2);margin-left:4px}.htp .elhead{display:flex;align-items:center;gap:10px;margin:0 0 8px}.htp .elhead .dot{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:17px;flex:none}.htp .elhead .nm{font-size:17px;font-weight:900}.htp .elhead .ps{font-size:13px;color:var(--ink2);margin-left:auto;text-align:right;line-height:1.35}.htp .shapes{display:flex;gap:9px;flex-wrap:wrap;align-items:flex-end;margin-top:4px}.htp .sh{display:flex;flex-direction:column;align-items:center;gap:4px}.htp .sh .lv{font-size:11px;color:var(--ink2)}.htp .grid{display:grid;gap:2px}.htp .cell{width:11px;height:11px;border-radius:2px}.htp .cell.on{box-shadow:inset 0 0 0 1px #00000026}.htp .cell.off{background:transparent}.htp .skill{display:flex;gap:11px;align-items:flex-start;padding:9px 0;border-top:1px solid rgba(200,140,40,.16)}.htp .skill:first-child{border-top:0}.htp .skill .ic{width:34px;height:34px;border-radius:50%;background:#fff3cf;border:2px solid rgba(255,178,32,.4);display:grid;place-items:center;font-size:17px;flex:none}.htp .skill .tx b{color:var(--ink)}.htp .skill .tx .d{font-size:13.5px;color:var(--ink2)}.htp .ring{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;font-size:14px;align-items:center}.htp .ring .e{padding:3px 10px;border-radius:8px;font-weight:900;color:#fff}.htp .ring .ar{color:var(--ink2)}.htp .pill{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.htp .pill span{font-size:13px;background:#ffb2201a;border:1px solid rgba(200,140,40,.25);border-radius:8px;padding:3px 9px;color:var(--ink)}.htp .footer{text-align:center;margin-top:40px;padding-top:22px;border-top:1px solid rgba(200,140,40,.18)}.htp .btn{display:inline-block;margin-top:14px;font-weight:900;color:#3a1f00;font-size:16px;background:linear-gradient(120deg,var(--cta1),var(--cta2));padding:14px 34px;border-radius:999px;box-shadow:0 8px #d96a00,0 14px 22px #b45a004d;transition:transform .12s,box-shadow .12s}.htp .btn:active{transform:translateY(4px);box-shadow:0 4px #d96a00,0 8px 14px #b45a004d}.htp .flow{display:flex;gap:8px;align-items:stretch;margin-top:6px}.htp .flow .step{flex:1;background:#fff;border:1px solid rgba(200,140,40,.18);border-radius:12px;padding:12px;text-align:center;box-shadow:var(--shadow)}.htp .flow .step .e{font-size:22px}.htp .flow .step b{display:block;margin-top:3px}.htp .flow .step .d{font-size:12.5px;color:var(--ink2)}.htp .arrow{align-self:center;color:var(--sun2);font-size:20px;font-weight:900}.htp .demo{max-width:230px;margin:16px auto 2px;text-align:center}.htp .demo-top{display:flex;align-items:center;gap:8px;justify-content:center;margin-bottom:10px}.htp .denemy{font-size:26px;line-height:1}.htp .denemy.hit{animation:dshake .3s}@keyframes dshake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.htp .dhp{flex:0 0 96px;height:8px;background:#0000001f;border-radius:99px;overflow:hidden}.htp .dhp-fill{height:100%;width:100%;background:linear-gradient(90deg,#ff5a3d,#ff8a2a);border-radius:99px;transition:width .45s}.htp .dboard{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;width:126px;margin:0 auto;padding:6px;background:#c88c281a;border-radius:12px}.htp .dboard .dc{aspect-ratio:1;border-radius:5px;background:#c88c2824;transition:background .15s}.htp .dboard .dc.on{background:var(--fire)}.htp .dboard.flash .dc.on{background:#fff;box-shadow:0 0 10px #ffffffe6}.htp .dcard{display:inline-flex;align-items:center;gap:6px;margin-top:11px;font-size:12px;color:var(--ink2)}.htp .dslot{width:16px;height:16px;border-radius:4px;border:1.5px dashed rgba(200,140,40,.55);display:inline-block;transition:.2s}.htp .dslot.filled{background:var(--fire);border-style:solid;border-color:var(--fire);transform:scale(1.15)}.htp .dcap{margin-top:11px;font-size:13px;font-weight:800;color:var(--sun2);min-height:18px}[data-theme=dark] .htp .dhp{background:#ffffff1a}[data-theme=dark] .htp .dboard{background:#ffffff0d}[data-theme=dark] .htp .dboard .dc{background:#ffffff12}[data-theme=dark] .htp .dslot{border-color:#ffb22080}[data-theme=dark] .htp .card{background:#231d14;border-color:#ffb22029}[data-theme=dark] .htp .card.lead{background:linear-gradient(135deg,#2c2413,#231d14);border-color:#ffb2204d}[data-theme=dark] .htp .tag{background:#ffffff14;color:#e8d4a8}[data-theme=dark] .htp .skill{border-top-color:#ffb22024}[data-theme=dark] .htp .skill .ic{background:#2b2014;border-color:#ffb22059}[data-theme=dark] .htp .pill span{background:#ffffff0f;border-color:#ffb22033}[data-theme=dark] .htp .footer{border-top-color:#ffb22029}[data-theme=dark] .htp .flow .step{background:#231d14;border-color:#ffb22029}[data-theme=dark] .htp .cell.on{box-shadow:inset 0 0 0 1px #ffffff40}
