:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#2b2b2b;--panel-max:100vw;--top-height:86px;--white:#f8f8f8;--muted:#c9c9c9;--button:#121212d1;--button-hover:#fffffff0;--topbar-text:#2c2521;--topbar-border:#e1c3b5c7;--topbar-bg:linear-gradient(90deg, #ffaf96 0%, #ffc8b8 21%, #f6eee9 48%, #e7f7ef 66%, #bdf6e2 82%, #92efcd 100%)}*{box-sizing:border-box}html,body{background:var(--bg);width:100%;min-height:100%;color:var(--topbar-text);margin:0;font-family:Arial,Noto Sans KR,Apple SD Gothic Neo,sans-serif;overflow:hidden}button{font:inherit}.worldcup-app{background:var(--bg);width:100vw;height:100vh;min-height:520px;position:relative;overflow:hidden}.top-title{z-index:20;width:100%;height:var(--top-height);border-bottom:1px solid var(--topbar-border);background:var(--topbar-bg);color:var(--topbar-text);letter-spacing:0;text-align:center;text-shadow:0 1px #ffffffb3;white-space:nowrap;pointer-events:none;place-items:center;margin:0;font-size:34px;font-weight:800;line-height:1;display:grid;position:absolute;top:0;left:0}.screen{display:none;position:absolute;inset:0}.screen.is-active{display:block}.arena{left:50%;top:var(--top-height);width:min(var(--panel-max), 100vw);height:calc(100vh - var(--top-height));background:#0c0c0c;grid-template-columns:1fr 1fr;min-height:0;display:grid;position:absolute;transform:translate(-50%)}.choice,.choice-shell{min-width:0;height:100%;color:inherit;isolation:isolate;background:#050505;border:0;border-radius:0;outline:0;justify-content:center;align-items:center;padding:0;display:flex;position:relative;overflow:hidden;container-type:size}.choice{cursor:pointer}.choice-shell{cursor:default}.choice+.choice,.choice-shell+.choice-shell{border-left:1px solid #ffffff14}.choice:focus-visible{box-shadow:inset 0 0 0 4px #ffffffdb}.choice:hover .portrait,.choice:focus-visible .portrait{filter:brightness(1.08)saturate(1.06)}.portrait-frame{z-index:1;flex:none;width:100%;max-width:100%;height:100%;max-height:100%;line-height:0;display:block;position:relative;overflow:hidden}@supports (width:1cqw){.portrait-frame{width:min(100cqw, var(--frame-width));height:min(100cqh, var(--frame-height))}}.portrait{z-index:1;object-fit:contain;object-position:center center;filter:brightness(.98)saturate(1.02);-webkit-user-select:none;user-select:none;pointer-events:none;width:100%;height:100%;transition:filter .16s;display:block;position:absolute;inset:0}.arena>.choice:first-child,.arena>.choice-shell:first-child,.transition-choice.left{justify-content:flex-end}.arena>.choice:nth-child(2),.arena>.choice-shell:nth-child(2),.transition-choice.right{justify-content:flex-start}.portrait-frame:after{content:"";z-index:2;pointer-events:none;background:linear-gradient(#0000,#00000094 78%,#000000b8);height:42%;position:absolute;inset:auto 0 0}.name{z-index:4;color:#fff;letter-spacing:0;text-align:center;text-shadow:-1px -1px #000000e6,1px -1px #000000e6,-1px 1px #000000e6,1px 1px #000000e6,0 2px 4px #000000bd;word-break:keep-all;overflow-wrap:anywhere;pointer-events:none;width:min(90%,360px);font-size:clamp(18px,2vw,26px);font-weight:400;line-height:1.28;display:block;position:absolute;top:70%;bottom:auto;left:50%;transform:translate(-50%,-50%)}.single-arena{left:50%;top:var(--top-height);width:100vw;height:calc(100vh - var(--top-height));background:#050505;min-height:0;position:absolute;overflow:hidden;transform:translate(-50%)}.winner-arena{left:50%;top:var(--top-height);background:#050505;justify-content:center;align-items:center;width:100vw;min-height:0;display:flex;position:absolute;bottom:132px;overflow:hidden;transform:translate(-50%);container-type:size}.transition-arena{background:#050505;grid-template-columns:1fr 1fr;display:grid;position:absolute;inset:0;overflow:hidden}.transition-choice{isolation:isolate;background:#050505;justify-content:center;align-items:center;min-width:0;height:100%;display:flex;position:relative;overflow:hidden;container-type:size}.transition-choice+.transition-choice{border-left:1px solid #ffffff14}.transition-choice.left{--move-to-center:50%}.transition-choice.right{--move-to-center:-50%}.transition-choice.is-picked{z-index:4;animation:.42s ease-out both selected-to-center}.transition-choice.left.is-picked .portrait-frame{animation:.42s ease-out both left-frame-to-center}.transition-choice.right.is-picked .portrait-frame{animation:.42s ease-out both right-frame-to-center}.transition-choice.is-dropped{z-index:1;animation:.2s ease-out both dropped-choice}@keyframes selected-to-center{0%{transform:translate(0)}to{transform:translateX(var(--move-to-center))}}@keyframes left-frame-to-center{0%{transform:translate(0)}to{transform:translate(calc(50% - 50cqw))}}@keyframes right-frame-to-center{0%{transform:translate(0)}to{transform:translate(calc(50cqw - 50%))}}@keyframes dropped-choice{0%{opacity:1}to{opacity:0}}.vs{z-index:12;object-fit:contain;filter:drop-shadow(0 7px 10px #00000075);pointer-events:none;-webkit-user-select:none;user-select:none;width:clamp(94px,13.5vw,158px);height:auto;position:absolute;top:53.5%;left:50%;transform:translate(-50%,-50%)}.is-dimmed{filter:brightness(.54)}.home-overlay,.result-overlay,.ranking-panel{z-index:30;text-align:center;position:absolute;left:50%;transform:translate(-50%)}.home-overlay{flex-wrap:wrap;justify-content:center;gap:12px;width:min(92vw,520px);display:flex;top:52%}.action-row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.action-button{background:var(--button);color:#fff;letter-spacing:0;text-shadow:0 1px 1px #0000006b;cursor:pointer;border:1px solid #ffffff8f;border-radius:0;justify-content:center;align-items:center;min-width:150px;min-height:48px;padding:10px 22px;font-size:20px;font-weight:700;text-decoration:none;transition:background .14s,color .14s,transform .14s;display:inline-flex;box-shadow:0 4px 14px #00000073}.action-button:hover,.action-button:focus-visible{background:var(--button-hover);color:#101010;text-shadow:none;outline:0;transform:translateY(-1px)}.action-button:disabled{cursor:wait;opacity:.72;transform:none}.choice:disabled{cursor:default}.result-overlay{justify-items:center;gap:12px;width:min(92vw,560px);display:grid;top:auto;bottom:24px}.winner-label{color:#fff;text-shadow:0 3px 8px #000000b8;font-size:clamp(27px,4vw,44px);font-weight:800;line-height:1;display:block}.record-status{color:#fff;text-shadow:0 1px 3px #000000b3;background:#000000a3;max-width:min(92vw,520px);padding:7px 12px;font-size:15px;font-weight:700;line-height:1.25;display:block}.winner-name{color:#fff;text-shadow:-1px -1px #000000f0,1px -1px #000000f0,-1px 1px #000000f0,1px 1px #000000f0;word-break:keep-all;overflow-wrap:anywhere;max-width:min(92vw,560px);font-size:clamp(14px,1.8vw,22px);font-weight:700;line-height:1.3;display:block}.ranking{background:#f3f3f3;overflow:hidden}.ranking-panel{top:var(--top-height);color:#686d73;text-align:left;background:#f3f3f3;grid-template-rows:auto 1fr auto;gap:0;width:100vw;padding:0;display:grid;bottom:0}.ranking-head{background:#f8f8f8;border-bottom:1px solid #dedede;justify-content:space-between;align-items:center;gap:14px;min-width:0;padding:12px 16px;display:flex}.ranking-title{color:#33383f;text-shadow:none;margin:0;font-size:clamp(22px,2.8vw,34px);font-weight:800;line-height:1}.ranking-total{color:#73777d;white-space:nowrap;font-size:15px;font-weight:700}.ranking-table-wrap{background:#f3f3f3;min-height:0;position:relative;overflow:auto}.ranking-table{border-collapse:collapse;table-layout:fixed;color:#676b70;background:#f4f4f4;width:100%;min-width:1120px;font-size:14px}.ranking-table th,.ranking-table td{vertical-align:top;text-align:left;border:1px solid #dedede}.ranking-table th{color:#686d73;background:#fafafa;height:54px;padding:7px 9px;font-weight:800}.ranking-table th small{font-size:13px;font-weight:800;line-height:1.35}.ranking-table td{background:#f5f5f5;height:102px;padding:10px 9px;font-weight:700}.ranking-table .rank-col{width:70px}.ranking-table .rank-col span{float:right;color:#7d81ff}.ranking-table .image-col{width:190px}.ranking-table th:nth-child(4),.ranking-table th:nth-child(5){width:285px}.rank-no{color:#6b7076;font-size:14px;font-weight:500}.rank-thumb{object-fit:cover;background:#ddd;width:190px;height:100px;margin:-10px -9px;display:block}.rank-name{color:#62676d;word-break:keep-all;overflow-wrap:anywhere;font-size:14px;line-height:1.35}.rate-cell{gap:5px;padding-top:1px;display:grid}.rate-cell strong{color:#646970;font-size:14px;font-weight:800;line-height:1}.rate-track{background:#f0f0f0;border-radius:4px;width:100%;height:20px;display:block;overflow:hidden}.rate-fill{width:0;min-width:0;height:100%;display:block}.rate-cell.champion .rate-fill{background:repeating-linear-gradient(45deg,#ffffff2e 0 13px,#fff0 13px 26px),#ef5a70}.rate-cell.duel .rate-fill{background:repeating-linear-gradient(45deg,#ffffff29 0 13px,#fff0 13px 26px),#ffaf57}.ranking-empty{color:#686d73;text-align:center;background:#f8f8f8;border:1px solid #dedede;border-top:0;padding:24px 16px;font-size:16px;font-weight:800}.ranking-panel .action-row{background:#f8f8f8;border-top:1px solid #dedede;padding:12px 16px 14px}@media (max-width:720px){:root{--panel-max:100vw;--top-height:70px}.worldcup-app{min-height:520px}.top-title{padding:0 8px;font-size:24px;top:0}.arena,.single-arena,.winner-arena{min-height:0}.winner-arena{bottom:116px}.name{width:91%;font-size:clamp(15px,4.2vw,20px)}.vs{width:clamp(83px,23.4vw,135px)}.home-overlay{top:55%}.result-overlay{gap:10px;bottom:16px}.action-button{min-width:138px;min-height:46px;font-size:18px}.ranking-head{flex-direction:column;align-items:flex-start;padding:10px 12px}.ranking-table{min-width:920px;font-size:13px}.rank-thumb,.ranking-table .image-col{width:160px}.ranking-table th:nth-child(4),.ranking-table th:nth-child(5){width:235px}}