:where(.clean-root) .hero{--ink: #f6f0e8;--ink-2: #ddd5ca;--muted: #a9a198;--line: rgba(255, 255, 255, .1);--line-2: rgba(255, 255, 255, .16);--shadow: rgba(0, 0, 0, .7);display:grid;justify-items:center;text-align:center;gap:clamp(28px,4vh,44px);margin:0 clamp(8px,1.2vw,16px);padding:clamp(44px,8vh,88px) var(--pad) clamp(56px,9vh,96px);color:var(--ink);border-radius:clamp(22px,3vw,36px);background:radial-gradient(55% 40% at 50% 0%,rgba(255,154,77,.22),transparent 70%),radial-gradient(38% 32% at 50% 74%,rgba(244,85,30,.2),transparent 70%),radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.2px) 0 0 / 22px 22px,#131110;border:1px solid #2a2622;overflow:hidden}:where(.clean-root) .hero .bm__card,:where(.clean-root) .hero .bm__app,:where(.clean-root) .hero .namebox__row{--ink: #17181c;--ink-2: #3c3f48;--muted: #6d707a;--line-2: #ddd8d0;--surface: #fff}:where(.clean-root) .hero .bm__card,:where(.clean-root) .hero .bm__app{border-color:transparent;box-shadow:0 10px 30px -14px #000c}:where(.clean-root) .hero .bm__app.is-built,:where(.clean-root) .hero .bm__app.is-pinged,:where(.clean-root) .hero .bm__card.is-sending{border-color:var(--o2)}:where(.clean-root) .hero .bm.will-play .bm__app:not(.is-built){opacity:.6;color:#f6f0e8;background:#ffffff08;border:1px dashed rgba(255,255,255,.28);box-shadow:none}:where(.clean-root) .hero .namebox__row{border-color:#fff;box-shadow:5px 5px 0 var(--o2)}:where(.clean-root) .hero__words{display:grid;justify-items:center;gap:18px;min-width:0;max-width:900px}:where(.clean-root) .hero__sketch{width:100%;min-width:0}:where(.clean-root) .hero__eyebrow{font-weight:600;font-size:15px;color:var(--o2)}:where(.clean-root) .hero__title{font-weight:800;font-size:clamp(38px,5.4vw,74px);line-height:1.04;letter-spacing:-.035em;text-wrap:balance}:where(.clean-root):lang(th) .hero__title{line-height:1.3;letter-spacing:0}:where(.clean-root) .hero__sub{max-width:34em;font-size:clamp(18px,1.6vw,21px);color:var(--muted)}:where(.clean-root) .namebox{width:min(640px,100%);margin-top:10px;text-align:left}:where(.clean-root) .namebox label{display:block;font-weight:600;margin:0 0 8px 4px}:where(.clean-root) .namebox__row{display:flex;gap:8px;padding:6px;background:var(--surface);border:2px solid var(--ink);border-radius:14px;box-shadow:4px 4px 0 var(--ink)}:where(.clean-root) .namebox input{flex:1;min-width:0;font:400 18px/1.4 var(--sans);border:0;outline:0;padding:10px 12px;background:transparent;color:var(--ink)}@media(max-width:520px){:where(.clean-root) .namebox__row{flex-direction:column}:where(.clean-root) .namebox .btn{padding:14px}}:where(.clean-root) .final{display:grid;justify-items:center;text-align:center;gap:18px;padding:clamp(80px,14vh,140px) var(--pad) 140px;border-top:1px solid var(--line)}:where(.clean-root) .final__title{font-weight:800;font-size:clamp(36px,5.5vw,68px);line-height:1.05;letter-spacing:-.035em}:where(.clean-root) .dock{position:fixed;left:50%;bottom:16px;z-index:60;display:flex;align-items:center;gap:4px;max-width:calc(100% - 20px);padding:6px;background:var(--veil-2);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line-2);border-radius:16px;box-shadow:0 20px 44px -18px var(--shadow, rgba(23, 24, 28, .4));transform:translate(-50%,150%);opacity:0;transition:transform .5s var(--ease),opacity .3s ease}:where(.clean-root) .dock.is-up{transform:translate(-50%);opacity:1}@media(max-width:900px){:where(.clean-root):has(.bundle.is-picking) .dock{transform:translate(-50%,150%);opacity:0;pointer-events:none}}:where(.clean-root) .dock__items{display:flex;gap:2px}:where(.clean-root) .dock__item{position:relative;display:flex;align-items:center;gap:8px;padding:6px 10px 6px 6px;border-radius:11px;font:600 13px/1 var(--sans);color:var(--muted)}:where(.clean-root) .dock__item:hover,:where(.clean-root) .dock__item.is-active{background:var(--paper);color:var(--ink)}:where(.clean-root) .dock__item .tile{filter:grayscale(1);opacity:.55;transition:filter .3s,opacity .3s}:where(.clean-root) .dock__item.is-seen .tile{filter:none;opacity:1}:where(.clean-root) .dock__check{position:absolute;left:24px;top:2px;width:14px;height:14px;border-radius:50%;display:grid;place-items:center;font:800 9px/1 var(--sans);color:#fff;background:#1d9a50;transform:scale(0);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}:where(.clean-root) .dock__item.is-seen .dock__check{transform:scale(1)}:where(.clean-root) .dock__progress{font:600 12px/1 var(--sans);color:var(--muted);white-space:nowrap;padding:0 10px 0 6px}:where(.clean-root) .dock__done{padding:10px 14px;font-size:13px}@media(max-width:1000px){:where(.clean-root) .dock__label{display:none}:where(.clean-root) .dock__item{padding:6px}}@media(max-width:520px){:where(.clean-root) .dock{bottom:10px}:where(.clean-root) .dock__progress{display:none}:where(.clean-root) .dock.is-done .dock__items{display:none}}
