*{box-sizing:border-box}
#details{width:min(570px,calc(100% - 28px));overflow-y:auto;overscroll-behavior:contain}
#details .detail-visual{aspect-ratio:3.4;max-height:175px;overflow:hidden}
#details .detail-text{padding:clamp(16px,4vw,26px);overflow-wrap:anywhere}
.detail-guide{padding:15px 17px;background:#f2efe7;border-inline-start:3px solid var(--accent);border-radius:0 7px 7px 0}
.guide-citation,.detail-facts,.detail-facts>div{display:flex;flex-wrap:wrap;align-items:baseline}
.detail-guide h3{margin:0;font-size:16px;line-height:1.4}
.guide-citation,.detail-facts{color:var(--muted);font-size:12px}
#details .guide-summary{color:var(--ink);margin:8px 0;font-size:14px}
.guide-original{font-size:12px;margin:5px 0 10px}
.guide-original summary{cursor:pointer;color:var(--muted)}
.detail-guide ul{margin:10px 0 12px;padding-inline-start:18px;font-size:14px;line-height:1.6}
.detail-guide li+li{margin-top:5px}
.detail-guide li::marker{color:var(--accent)}
.guide-citation{justify-content:space-between;gap:3px 12px;padding-top:9px;border-top:1px solid #dcd6c8}
.guide-citation a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.guide-citation .icon{width:11px;height:11px;margin-inline-start:2px;vertical-align:baseline}
.detail-facts{gap:3px 16px;margin:14px 0 9px}
.detail-facts>div{gap:5px}
.detail-facts dd{margin:0;color:var(--ink)}
.detail-guide+.tags{margin-top:12px}
:root{color-scheme:light;--paper:#faf9f6;--ink:#24241f;--line:#dedcd4;--muted:#66665e;--accent:#ae4429;--display:Arial,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;--body:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",Arial,sans-serif;--mono:"Cascadia Mono",Consolas,monospace}
#change-dialog {
  width: min(528px, calc(100% - 24px));
  max-height: calc(100dvh - 24px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: clamp(18px, 4vw, 25px);
  border-radius: 18px;
  background: #fff;
}
#change-dialog h2 { margin: 0 42px 22px 0; font-size: clamp(21px, 4vw, 24px); }
#change-dialog .dialog-close { width: 36px; height: 36px; background: #f0ece4; border: 0; }
#change-fields, .change-types { min-width: 0; margin: 0; padding: 0; border: 0; }
#change-fields > label, .change-types legend { display: block; margin: 0 0 8px; font-weight: 700; font-size: 15px; }
#change-fields > input, #change-fields > select, #change-fields > textarea {
  display: block; width: 100%; min-width: 0; padding: 11px 14px; border: 1px solid #ddd6ca;
  border-radius: 11px; background: #f7f4ee; font-size: 16px; line-height: 1.5;
}
#change-fields > select { min-height: 48px; text-overflow: ellipsis; }
#change-fields > textarea { min-height: 104px; margin-bottom: 18px; resize: vertical; }
#change-contact-note { display: block; margin-top: 6px; color: var(--muted); font-size: 13px; }
.change-types { margin: 18px 0; }
.change-types label { display: inline-flex; position: relative; margin-inline-end: 5px; cursor: pointer; }
.change-types label input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.change-types span { padding: 7px 18px; border: 1px solid #dcd5cb; border-radius: 30px; color: var(--muted); }
.change-types input:checked + span { background: var(--ink); color: white; border-color: var(--ink); }
.change-types input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.change-notice, #change-confirmation { margin: 18px 0; padding: 12px 14px; background: #f7ede7; color: #894226; border-radius: 10px; font-size: 14px; }
#change-status { margin: 7px 0; color: #893b29; font-size: 14px; }
#change-email { display: inline-block; margin-bottom: 12px; text-decoration: underline; }
#change-confirmation { overflow-wrap: anywhere; }
#change-dialog .primary { width: 100%; min-height: 48px; border: 0; border-radius: 30px; color: white; background: var(--accent); font-size: 16px; font-weight: 700; }
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.55 var(--body);word-break:keep-all}
a{color:inherit;text-decoration:none}button,select,input,textarea{font:inherit;color:inherit}button,select{cursor:pointer}button{background:none;border:0}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid #bd522e;outline-offset:3px}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}.symbols{display:none}.icon{display:inline-block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.wrap{width:min(1280px,calc(100% - clamp(48px,10vw,160px)));margin-inline:auto}.skip,.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip:focus{width:auto;height:auto;clip-path:none;z-index:10;background:white;padding:8px}
.masthead{border-bottom:1px solid var(--line);background:var(--paper)}.header-inner{display:flex;align-items:center;gap:48px;min-height:72px}.brand{display:inline-flex;align-items:center;gap:9px;line-height:1;white-space:nowrap;font-family:var(--display);font-size:25px;font-weight:800;letter-spacing:-1.55px}
nav{display:flex;align-self:stretch;align-items:stretch;gap:29px}.nav-link{position:relative;display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#65665e}.nav-link .icon{width:16px;height:16px}.nav-link[aria-current=page]{color:var(--accent)}.nav-link[aria-current=page]:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:#d85c38}.nav-link:hover{color:var(--accent)}#saved-count{font:10px var(--mono);padding:2px 5px;background:#eae6de;border-radius:4px}
.register,.primary{display:inline-flex;justify-content:center;align-items:center;gap:6px;background:#b7492b;color:white;border:1px solid #a54128;border-radius:7px;font-weight:700}.register{margin-left:auto;padding:8px 14px;font-size:13px}.register .icon{width:16px;height:16px}.register:hover,.primary:hover{background:#9d3920}
.hero{isolation:isolate;position:relative;display:flex;align-items:center;overflow:hidden;min-height:268px;margin-top:27px;border-radius:13px;background:#171e33;color:#fff9e9}
.hero:after{content:"";pointer-events:none;position:absolute;inset:0;border:1px solid rgba(0,0,0,.13);border-radius:inherit}.hero-copy{position:relative;z-index:1;padding:30px 4.15%;width:55%;pointer-events:none}.hero-kicker,.section-code,.hero-caption{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.115em}.hero-kicker{display:flex;align-items:center;gap:9px;color:#ffb185;white-space:nowrap}.hero-kicker .icon{width:13px;height:13px}.hero h1{font-size:clamp(38px,3.65vw,55px);font-weight:780;letter-spacing:-.071em;line-height:1.2;margin:12px 0 11px}.hero h1 span{color:#ff9567}.hero p{margin:0;color:#d2d5dc;font-size:14px;letter-spacing:-.035em}
.hero-art{position:absolute;right:0;top:0;width:57%;height:100%;object-fit:contain;object-position:center;image-rendering:pixelated;z-index:-1}.hero-stars{position:absolute;z-index:-2;inset:0;background-image:radial-gradient(1px 1px at 9% 11%,#7a8193 98%,transparent),radial-gradient(1px 1px at 37% 80%,#a8b2c2 98%,transparent),radial-gradient(1px 1px at 20% 65%,#6d788b 98%,transparent),radial-gradient(1px 1px at 28% 48%,#9d8d86 98%,transparent);background-size:259px 143px,319px 157px,233px 211px,411px 209px}.hero-caption{position:absolute;bottom:14px;right:18px;display:flex;align-items:center;gap:5px;font-size:9px;font-weight:400;letter-spacing:.08em;color:#b6bdcd}.hero-caption i{width:5px;height:5px;background:#ec9671}
.directory{padding-top:34px;scroll-margin-top:18px;min-height:44vh}.section-code{color:var(--accent);display:flex;align-items:center;gap:2px;line-height:1.25}.section-code span{background:#cf6241;display:inline-block;width:4px;height:7px}.section-code span:nth-child(2){opacity:.6}.section-code span:nth-child(3){opacity:.33}.section-code b{margin-left:5px;font-size:10px;letter-spacing:.12em}.title-line{display:flex;align-items:center;gap:10px;margin-top:5px}.title-line h2{font-size:clamp(26px,2.3vw,34px);letter-spacing:-.065em;margin:0;line-height:1.3}.total{font:600 12px var(--mono);color:#a74028;background:#f5e7dc;border:1px solid #eacdbd;line-height:20px;padding:0 7px;border-radius:5px;font-variant-numeric:tabular-nums}.section-titles p{margin:6px 0 0;font-size:14px;color:var(--muted)}.search-control{display:flex;gap:8px;align-items:center;width:min(270px,40%);height:40px;padding:0 12px;border:1px solid var(--line);background:#fffefc;border-radius:7px;color:#72726a}.search-control:focus-within{border-color:#b45e42}.search-control input{padding:0;width:100%;min-width:0;border:0;outline:none;background:transparent;height:100%;font-size:13px;color:var(--ink)}input::placeholder,textarea::placeholder{color:#75766e}kbd{font:11px var(--mono);border:1px solid #dddcd5;background:#f6f5f1;border-radius:3px;padding:0 5px;color:#77776c}
.filters{display:flex;flex-wrap:wrap;gap:6px}.filter{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);border-radius:7px;background:#fffefc;color:#52534b;padding:6px 11px;font-size:12px;font-weight:700;line-height:20px;white-space:nowrap}.filter .icon{width:15px;height:15px}.filter:hover{border-color:#b2b2a7}.filter[aria-pressed=true]{background:#30332e;border-color:#30332e;color:white}
.sort{display:flex;align-items:center;gap:4px;position:relative;white-space:nowrap;font-size:12px;color:#55584f}.sort>.icon{width:16px}.sort select{width:88px;appearance:none;background:none;border:0;padding:8px 15px 8px 3px;font-weight:700}.sort .chevron{pointer-events:none;position:absolute;right:1px;width:13px}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 17px}
.world-card{cursor:pointer;min-width:0;overflow:hidden;display:flex;flex-direction:column;background:#fffefa;border:1px solid #dbdad1;border-radius:10px;transition:border-color .18s,box-shadow .18s}
.world-card:focus-within{border-color:#af826b}
@media (hover:hover) and (pointer:fine){
  .world-card:hover{border-color:#b59481;box-shadow:0 9px 22px -6px #49352138,0 2px 5px #49352112}
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .world-card{transition:transform .2s cubic-bezier(.2,.75,.3,1),border-color .18s,box-shadow .18s}
  .world-card:hover{transform:translateY(-1px) scale(1.018)}
  .cover-trigger > :is(img,.fallback){transition:transform .34s cubic-bezier(.2,.75,.3,1)}
  .world-card:hover .cover-trigger > :is(img,.fallback){transform:scale(1.07)}
}
.cover{position:relative;aspect-ratio:1.88;isolation:isolate;overflow:hidden;background:#e8e9dc;border-bottom:1px solid #0000000a}.cover-trigger{padding:0;display:block;width:100%;height:100%;cursor:pointer;text-align:left}.cover img,.detail-visual img{width:100%;height:100%;object-fit:cover;display:block}
.pick-badge,.rank-badge{position:absolute;top:10px;left:10px;display:flex;align-items:center;gap:4px;padding:2px 6px;background:#fff0c9;color:#4d391a;border:1px solid #efe0bd;border-radius:4px;font:700 9px/1.6 var(--mono);letter-spacing:.03em;pointer-events:none}.pick-badge .icon{width:10px;height:10px;color:#995921}.rank-badge{background:#23251f;color:white;border-color:#23251f}.save{display:grid;place-items:center;position:absolute;top:9px;right:9px;width:30px;height:30px;background:#fffefaed;color:#3e423a;border:1px solid #ffffffa1;border-radius:50%;box-shadow:0 1px 4px #16191812}.save .icon{width:15px;height:15px}.save:hover{background:white}.save[aria-pressed=true]{color:var(--accent);background:#fff1e5}.save[aria-pressed=true] .icon{fill:#f4b097}
.card-body{padding:13px 14px 12px;flex:1;display:flex;flex-direction:column}.meta{display:flex;align-items:center;gap:6px;font:700 10px/1.5 var(--body);color:#64685a}.dot{width:6px;height:6px;display:inline-block;background:var(--category,#71815b);border-radius:2px}.world-card h3{margin:4px 0 3px;font-size:clamp(16px,1.22vw,19px);letter-spacing:-.055em;line-height:1.4}.title-btn{display:block;max-width:100%;padding:0;text-align:left;font:inherit;letter-spacing:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.title-btn:hover{text-decoration:underline;text-underline-offset:3px}.summary{margin:0;color:var(--muted);font-size:12px;letter-spacing:-.025em;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3.2em}.card-foot{display:flex;align-items:center;gap:9px;justify-content:space-between;margin-top:10px;padding-top:9px;border-top:1px solid #eeede7}.creator{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:11px/1.5 var(--mono);color:#67695e}.enter{display:inline-flex;align-items:center;gap:3px;white-space:nowrap;font-size:11px;font-weight:700;line-height:1.7;color:#45463e}.enter .icon{width:13px;height:13px}.enter:hover{color:var(--accent)}
#notice{background:#f6eee4;padding:10px 14px;border-radius:6px;font-size:13px;margin:0 0 16px}.more{display:flex;align-items:center;justify-content:center;gap:6px;margin:24px auto 0;border:1px solid var(--line);border-radius:6px;padding:8px 20px;font-size:13px;background:#fffefa}.more:hover{border-color:#bcb9ac}.empty{padding:60px 14px;text-align:center;border:1px dashed #d9d7cb;border-radius:9px}.empty>.icon{width:28px;height:28px;color:var(--accent)}.empty h3{margin:10px 0 4px;font-size:19px}.empty p{margin:0;font-size:14px;color:var(--muted)}.empty button{display:inline-block;color:var(--accent);text-decoration:underline;text-underline-offset:4px;margin-top:13px}.fallback{height:100%;width:100%;display:grid;place-items:center;color:#ffedc1;background-color:var(--category,#66765f);background-image:linear-gradient(45deg,#ffffff12 25%,transparent 25%,transparent 75%,#ffffff12 75%),linear-gradient(45deg,#ffffff12 25%,transparent 25%,transparent 75%,#ffffff12 75%);background-size:22px 22px;background-position:0 0,11px 11px}.fallback .icon{width:44px;height:44px;filter:drop-shadow(2px 3px #0004)}
.site-footer{margin-top:clamp(40px,5vw,72px);border-top:1px solid var(--line);background:#fffefa;color:var(--ink)}
.footer-inner{padding-bottom:max(28px,env(safe-area-inset-bottom));overflow-wrap:anywhere}
.footer-feedback{padding-top:clamp(22px,3vw,36px)}
.footer-feedback summary{display:flex;align-items:center;gap:9px;width:fit-content;max-width:100%;min-height:42px;padding:9px 16px;list-style:none;border:1px solid var(--line);border-radius:24px;background:white;color:#514b43;font-weight:650;font-size:14px;cursor:pointer}
.footer-feedback summary::-webkit-details-marker{display:none}
.footer-feedback summary:hover,.footer-feedback[open] summary{border-color:#bd967e}
.footer-feedback summary .icon{width:16px;height:16px;flex:none}
.footer-feedback summary .disclosure-arrow{width:13px}
.footer-feedback[open] .disclosure-arrow{transform:rotate(180deg)}
#feedback-form{display:grid;gap:7px;max-width:600px;margin-top:12px;padding:18px;background:#f5f2ec;border-radius:12px}
#feedback-form label{font-size:13px;font-weight:700}
#feedback-form select,#feedback-form textarea{min-width:0;width:100%;padding:9px 10px;border:1px solid #ccc7ba;border-radius:6px;background:#fffefa;color:var(--ink);font:inherit;font-size:14px}
#feedback-form textarea{resize:vertical}
#feedback-form p{margin:0 0 4px;color:var(--muted);font-size:13px}
#feedback-form .primary{display:inline-flex;align-items:center;gap:8px;justify-self:start}
.footer-intro{margin:22px 0 14px;padding:clamp(18px,2.3vw,30px);border:1px solid var(--line);border-radius:14px;background:white}
.footer-intro h2{margin:0 0 7px;font-size:clamp(19px,2vw,24px);line-height:1.4;letter-spacing:-.035em}
.footer-intro p{margin:0;color:var(--muted);font-size:15px;line-height:1.75}
.footer-actions{display:grid;grid-template-columns:1.2fr repeat(3,minmax(0,1fr));gap:10px;margin-bottom:10px}
.footer-action{display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;padding:18px;text-align:start;background:white;border:1px solid var(--line);border-radius:13px;color:var(--ink);line-height:1.45}
.footer-action .icon{width:19px;height:19px;color:var(--accent)}
.footer-action strong{font-size:16px}
.footer-action span{color:var(--muted);font-size:13px;font-weight:400}
.footer-action.featured-action{color:white;background:#282e34;border-color:#282e34}
.featured-action span{color:#e6e2dc}
.featured-action b{margin-top:3px;padding:5px 12px;border-radius:6px;background:#f4d1ab;color:#312419;font-size:13px}
.footer-actions .footer-action:hover{border-color:var(--accent);color:var(--ink);text-decoration:none;background:#fcf8ef}
.footer-actions .featured-action:hover{background:#353a3f;color:white}
#new{scroll-margin-block-start:80px}
@media(max-width:960px){.footer-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.footer-actions{grid-template-columns:1fr}.footer-action{padding:14px 16px}}
.footer-week{margin:0;padding:clamp(23px,3vw,36px) 8px;border-bottom:1px solid var(--line);text-align:center;font-size:clamp(20px,2.3vw,27px);font-weight:750;line-height:1.35;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.footer-traffic { padding: clamp(18px,3vw,30px) 0; border-bottom: 1px solid var(--line); }
.traffic-header { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.traffic-header h2 { margin: 0; font-size: 19px; line-height: 1.4; }
#traffic-preview { padding: 2px 8px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); font-size: 11px; }
.footer-traffic dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 16px 0 0; padding: 16px 0; border-radius: 10px; background: #f4f1ea; }
.footer-traffic dl div { min-width: 0; padding-inline: clamp(9px,2.5vw,32px); }
.footer-traffic dl div + div { border-inline-start: 1px solid #d8d2c5; }
.footer-traffic dt { color: var(--muted); font-size: 13px; }
.footer-traffic dd { margin: 5px 0 0; font: 700 clamp(21px,3vw,30px)/1.2 var(--display); font-variant-numeric: tabular-nums; }
.footer-traffic dd.unmeasured { color: var(--muted); font: 600 14px/1.5 var(--body); }
#traffic-note { margin: 10px 0 0; font-size: 12px; color: var(--muted); }
.footer-imprint {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28%;
  column-gap: clamp(24px, 4vw, 56px);
}
.footer-thumbnail {
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  display: block;
  width: 100%;
  height: auto;
  margin-block: 8px 18px;
  border-radius: 8px;
}
@media (max-width: 850px) {
  .footer-imprint { display: block; }
  .footer-thumbnail { max-width: 420px; margin: 0 0 20px; }
}
.footer-about { align-self: center; padding: clamp(24px, 3vw, 38px) 0 16px; }
.footer-about h2,.footer-guide h2{margin:0;font-size:17px;line-height:1.4}
.footer-about>p{margin:5px 0 0;color:var(--muted);font-size:15px;line-height:1.65}
.footer-facts,.footer-facts>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 8px}
.footer-facts{margin:10px 0 0;gap:3px 24px;line-height:1.6;font-size:14px}
.footer-facts dt{color:var(--muted)}
.footer-facts dd{margin:0}
.footer-facts a{text-decoration:underline;text-underline-offset:3px}
.footer-policies{display:flex;flex-wrap:wrap;gap:0 22px;padding:0 0 16px}
.footer-policies>a,.footer-policies>button{display:inline-flex;align-items:center;min-height:40px;padding:4px 0;text-align:start;font-size:14px;font-weight:600}
.footer-policies [data-policy=privacy]{font-weight:700}
.footer-guide{padding:18px 22px;border-radius:12px;background:#f3f1ec}
.footer-guide ul{margin:7px 0 0;padding-inline-start:20px;color:#5d5a51;font-size:14px;line-height:1.65}
.footer-guide li+li{margin-top:3px}
.footer-bottom p{margin:18px 0 0;color:var(--muted);font-size:13px}
.footer-inner a:hover,.footer-inner button:hover{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
#policy-copy p{margin:12px 0 0;font-size:14px;line-height:1.65;overflow-wrap:anywhere}
#policy-dialog[open]{display:flex;flex-direction:column;width:min(640px,calc(100% - 26px))}
#policy-copy{overflow-y:auto;overscroll-behavior:contain;min-height:0;padding-inline-end:8px}
#policy-copy .policy-updated{margin:0;color:var(--muted);font-size:13px}
#policy-copy section{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
#policy-copy h3{margin:0;font-size:16px;line-height:1.45}
#policy-copy section p{margin-top:5px}
#policy-copy a{display:inline-block;margin-top:8px;text-decoration:underline;text-underline-offset:3px}
@media(max-width:680px){
  .footer-policies{gap:0 16px}
  .footer-guide{padding:15px 16px}
  .footer-inner{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
}
dialog{border:1px solid #d1ccbc;border-radius:14px;background:var(--paper);color:var(--ink);padding:0;width:min(450px,calc(100% - 28px));max-height:calc(100dvh - 32px);box-shadow:0 22px 64px #1a1b2044}dialog::backdrop{background:#1721319c}body:has(dialog[open]){overflow:hidden}.dialog-close{position:absolute;z-index:1;right:12px;top:12px;background:#fffdf7f5;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;width:32px;height:32px}.dialog-close .icon{width:16px}.detail-visual{width:100%;aspect-ratio:1.9}.detail-text,.entry-form{padding:25px}.detail-text h2,.entry-form h2{margin:5px 0 6px;font-size:26px;line-height:1.3;letter-spacing:-.06em}.detail-text p,.entry-form>p{font-size:14px;color:var(--muted);margin:6px 0 16px}.tags{display:flex;flex-wrap:wrap;gap:4px}.tag{font-size:11px;background:#eeeae0;border-radius:4px;padding:2px 6px}.detail-creator{margin-top:12px}.detail-actions{display:flex;gap:8px;align-items:stretch;margin-top:20px}.primary{font-size:14px;padding:9px 16px;min-height:40px}.detail-actions .primary{flex:1}.detail-save{position:static;border:1px solid #d2cec2;width:42px;height:auto;border-radius:6px}.entry-form{display:grid;gap:12px}.entry-form h2{margin:0}.entry-form>p{margin:-6px 0 0}.entry-form label{display:block;font-size:12px;font-weight:700}.entry-form label small{font-weight:400;color:var(--muted);margin-left:4px}.entry-form input,.entry-form textarea,.entry-form select{display:block;width:100%;margin-top:4px;background:#fffefa;border:1px solid #d5d2c7;border-radius:5px;padding:9px 10px;font-size:14px;font-weight:400}.entry-form textarea{resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1.45fr;gap:10px}.entry-form #form-error{color:#9b3321;margin:0}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,9px);z-index:8;color:white;background:#272d27;padding:9px 15px;border-radius:8px;box-shadow:0 4px 18px #0002;font-size:13px;max-width:90vw;text-align:center;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1550px){.hero{min-height:285px}}
@media(max-width:1090px){.wrap{width:calc(100% - 56px)}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.header-inner{gap:38px}.hero{min-height:240px}.hero-copy{width:53%;padding-left:4%}.hero h1{font-size:40px}}
@media(max-width:760px){.wrap{width:calc(100% - 32px)}.header-inner{gap:21px;min-height:61px}.brand{font-size:22px}.brand img{width:29px;height:29px}nav{gap:15px}.nav-link{font-size:12px}.nav-link .icon{display:none}.register{padding:7px 10px}.hero{margin-top:18px;min-height:222px}.hero-copy{width:54%;padding-left:23px}.hero h1{font-size:35px}.hero p{font-size:12px;max-width:28ch}.hero-art{width:54%}.directory{padding-top:26px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}.filters{gap:5px}.filter{padding:4px 8px}.title-line h2{font-size:27px}}
@media(max-width:565px){.header-inner{display:grid;grid-template-columns:1fr auto;gap:0 8px;padding-top:12px}.brand{font-size:23px}.register{grid-column:2;grid-row:1;font-size:12px}.header-inner nav{grid-column:1/-1;grid-row:2;gap:24px;height:40px;align-items:stretch}.nav-link .icon{display:inline-block;width:14px;height:14px}.hero{min-height:205px}.hero-copy{width:62%;padding:20px 0 27px 17px}.hero h1{font-size:clamp(27px,6.7vw,36px);margin:8px 0}.hero-kicker{font-size:8px;gap:5px;letter-spacing:.045em}.hero-kicker .icon{width:10px;height:10px}.hero p{max-width:19ch;font-size:11px}.hero-art{width:59%;height:80%;right:-8%;top:17%;object-fit:contain}.hero-caption{font-size:7px;right:10px;bottom:9px}.search-control{width:100%;height:38px}.filter{flex-shrink:0}.sort{font-size:11px}.sort select{width:73px;padding-left:0}.sort>.icon:first-child{display:none}.cards{gap:12px 9px}.card-body{padding:9px}.world-card h3{font-size:15px}.summary{font-size:11px}.card-foot{margin-top:7px;padding-top:7px;gap:3px}.creator,.enter{font-size:9.5px}.pick-badge,.rank-badge{top:6px;left:6px;font-size:7.5px}.save{top:5px;right:5px;width:26px;height:26px}.save .icon{width:13px;height:13px}.detail-save{width:42px;height:auto}}
@media(max-width:350px){.wrap{width:calc(100% - 20px)}.cards{grid-template-columns:1fr}.summary{min-height:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.directory-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(350px,440px) auto;grid-template-areas:"title search chat" "views views views" "filters filters filters";align-items:center;column-gap:clamp(20px,2.5vw,40px);margin-bottom:17px}
.directory-controls .section-titles{grid-area:title}.directory-search{grid-area:search;display:flex;align-items:stretch;gap:6px;min-width:0;margin:0}.directory-search .search-control{width:auto;flex:1}
@media(max-width:1024px){.directory-controls{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title title" "search chat" "views views" "filters filters"}.directory-search{width:min(100%,470px)}.directory-controls .section-titles{margin-bottom:14px}}
@media(max-width:640px){.directory-controls{grid-template-columns:minmax(0,1fr);grid-template-areas:"title" "search" "chat" "views" "filters"}.directory-search{width:100%}.directory-controls .kakao-invite{justify-self:center;margin-block:14px 6px}}
.directory-views{grid-area:views;display:flex;align-items:stretch;justify-content:space-between;gap:12px;margin-top:10px;border-bottom:1px solid #d6d4c9}
.directory-views nav{display:flex;align-items:stretch;gap:24px;min-width:0}.directory-views .nav-link{display:inline-flex;gap:6px;align-items:center;padding:7px 2px 11px;white-space:nowrap;font-size:14px}.directory-views .nav-link .icon{display:block;width:16px;height:16px}.directory-views .sort{align-self:center}
.directory-controls .filters{grid-area:filters;display:flex;flex-wrap:wrap;gap:6px;min-width:0;padding:12px 0;border-bottom:1px solid var(--line)}
.directory-controls .filters>button{flex:0 0 auto;max-width:100%}
.directory-controls .filter{justify-content:flex-start;min-width:0;padding-inline:6px;gap:4px}.filter-name{min-width:0;overflow:hidden;text-overflow:ellipsis}.directory-controls .filter small{margin-left:auto}.directory-controls .more-categories{justify-content:center;background:#f3f0e9}.more-categories .icon{width:13px;height:13px}
.filter{flex-shrink:0}.filter small{font:10px var(--mono);color:#797a70}.filter[aria-pressed=true] small{color:#dddacf}.all-filters{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;color:#524e43;font-weight:700;font-size:12px;padding:8px 9px;border:1px solid var(--line);border-radius:6px;background:#f4f2eb}.all-filters .icon{width:15px;height:15px}.all-filters:hover{border-color:#aaa592}
#view-note{color:var(--muted);font-size:13px;margin:-3px 0 12px}
.card-meta{display:flex;align-items:center;justify-content:space-between;gap:5px}.card-meta .meta{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.card-meta .dot{margin-right:5px;vertical-align:1px}
.server-status{position:relative;flex:none;display:inline-flex;align-items:center;gap:4px;color:#68685f;font-size:10px;line-height:1.6;white-space:nowrap;cursor:help}
.server-status:before{content:"";width:6px;height:6px;background:currentColor;border-radius:50%}
.server-status[data-state=fast]{color:#287344}.server-status[data-state=normal]{color:#326288}.server-status[data-state=slow]{color:#925a09}.server-status[data-state=offline]{color:#ad3d35}
.server-status:focus-visible:after{content:attr(title);position:absolute;z-index:2;top:calc(100% + 4px);right:0;width:min(170px,36vw);padding:6px 8px;border-radius:5px;background:#34392e;color:#fff;font-size:11px;line-height:1.5;white-space:normal}
.card-credit{display:block;margin-top:auto;padding-top:8px}.card-foot{margin-top:6px;padding-top:4px}.social-actions{display:flex;gap:6px;align-items:center}.social{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:34px;min-height:29px;padding:2px 3px;font:600 12px var(--mono);color:#585b51;line-height:1}.social .icon{width:16px;height:16px}.social:hover{color:var(--accent);background:#f7efe6;border-radius:4px}.like[aria-pressed=true]{color:#a83d33}.like[aria-pressed=true] .icon{fill:#e88875}.social:disabled{cursor:default}
.social b{font:600 11px var(--body)}@media(max-width:620px){.social b{display:none}}
.directory-dialog{padding:24px;width:min(510px,calc(100% - 26px))}.directory-dialog h2{font-size:25px;line-height:1.35;letter-spacing:-.05em;margin:7px 35px 15px 0}#category-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}#category-list .filter{justify-content:space-between;min-width:0;padding:7px 10px}.directory-dialog .dialog-close{top:14px;right:14px}
#comment-world{margin:-8px 0 16px;color:var(--accent);font-size:14px;font-weight:700;overflow-wrap:anywhere}
#comment-form{display:grid;gap:10px}#comment-form label{display:block;font-size:12px;font-weight:700}#comment-form small{font-weight:400;color:var(--muted)}#comment-form input,#comment-form textarea{display:block;width:100%;margin-top:4px;border:1px solid var(--line);border-radius:6px;padding:9px;background:#fffefa;font-size:14px;font-weight:400}#comment-form textarea{resize:vertical}.comment-submit{display:flex;justify-content:space-between;align-items:center;gap:8px}.comment-submit .primary{font-size:13px;min-height:36px;padding:6px 14px}#comment-error{color:#a33d30;font-size:13px}#comment-thread{margin-top:16px;border-top:1px solid var(--line);padding-top:10px;overflow-wrap:anywhere}#comment-thread h3{font-size:14px;margin:0 0 5px}#comment-thread>p{font-size:13px;color:var(--muted)}#comment-thread article{padding:9px 0;border-bottom:1px solid #e9e5da}#comment-thread strong{font-size:12px}#comment-thread time{margin-left:8px;font:10px var(--mono);color:var(--muted)}#comment-thread article p{white-space:pre-wrap;font-size:14px;margin:4px 0}
@media(max-width:565px){.header-inner{padding-top:0}.directory-views{gap:5px;margin-top:12px}.directory-views nav{flex:1;gap:12px}.directory-views .nav-link{gap:3px;font-size:12px;padding:8px 0 9px}.directory-views .nav-link .icon{width:12px;height:12px}.directory-views .sort select{width:70px}.all-filters{padding:6px;gap:4px;font-size:11px}.card-meta{gap:3px}.server-status{font-size:9px}.card-credit{padding-top:5px}.social-actions{gap:1px}.social{min-width:28px;min-height:28px;font-size:11px}.social .icon{width:14px;height:14px}.directory-dialog{padding:18px}#category-list{gap:5px}#category-list .filter{padding:6px;font-size:11px}}
@media(max-width:385px){.directory-views nav{gap:11px}.directory-views .nav-link .icon{display:none}.directory-views .nav-link{font-size:11px}.directory-views .sort select{width:66px}#saved-count{padding:1px 2px}}
@media(max-width:760px){.directory-controls .filters{gap:5px}.directory-controls .filter .icon{width:13px;height:13px}}
@media(max-width:565px){.directory-controls{margin-bottom:14px}.directory-controls .directory-views{margin-top:5px}.directory-controls .filters{padding:9px 0;border-bottom:0}.directory-controls .filter .filter-name{font-size:12px}.directory-controls .filter[data-filter] .icon{display:none}.directory-controls .all-filters{padding:4px;gap:3px}}
/* Floating directory guide */
.chat-widget{position:fixed;z-index:6;right:max(18px,env(safe-area-inset-right));bottom:calc(max(18px,env(safe-area-inset-bottom)) + var(--chat-keyboard,0px));display:flex;align-items:flex-end;flex-direction:column;gap:8px;--chat-room:100dvh}
#chat-launcher{display:inline-flex;align-items:center;gap:8px;padding:0 15px 0 12px;min-height:46px;border:1px solid #303749;border-radius:25px;background:#20283c;color:#fff5e6;box-shadow:0 4px 15px #1c24392b;font-size:14px;font-weight:700}
#chat-launcher .icon{color:#ffb387;width:23px;height:23px}#chat-launcher:hover{background:#303b54}
#guide-chat{width:min(360px,calc(100vw - 36px));height:min(490px,calc(var(--chat-room) - 90px));min-height:0;display:flex;flex-direction:column;overflow:hidden;background:#fffdf8;border:1px solid #ccc7bb;border-radius:14px;box-shadow:0 12px 42px #1b22363b}
.chat-head{background:#20283c;color:#fff6e8;display:flex;flex:none;align-items:center;gap:10px;padding:12px 14px}
.chat-avatar{display:grid;place-items:center;width:35px;height:35px;background:#353d4d;border:1px solid #61616a;border-radius:9px;color:#ffb387}.chat-avatar .icon{width:24px;height:24px}
.chat-head small{display:block;font:700 9px/1.3 var(--mono);letter-spacing:.13em;color:#f3ae8b}.chat-head h2{margin:1px 0 0;font-size:17px;line-height:1.3;letter-spacing:-.04em}
#chat-close{display:grid;place-items:center;margin-left:auto;width:34px;height:34px;color:#ebe5dc;border-radius:6px}#chat-close:hover{background:#364057}
#chat-log{flex:1;min-height:0;display:flex;flex-direction:column;align-items:flex-start;gap:12px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:15px 13px;background:#faf8f2;color:var(--ink);font-size:13px;line-height:1.55}
#chat-log>*{flex:none;max-width:100%}.guide-answer{display:grid;gap:5px}.chat-bubble,.chat-question{margin:0;padding:9px 11px;border-radius:11px;overflow-wrap:anywhere}
.chat-bubble{background:#fffefb;border:1px solid #e1ddd3;border-top-left-radius:3px}.chat-question{align-self:flex-end;background:#f7e5d5;color:#633922;border-bottom-right-radius:3px}
.chat-prompts{display:flex;flex-wrap:wrap;gap:5px;margin-top:3px}.chat-prompts button,.chat-next{justify-self:start;padding:5px 9px;border:1px solid #dbcdba;background:#fffcf6;color:#864529;border-radius:15px;font-size:12px;font-weight:700}.chat-prompts button:hover,.chat-next:hover{background:#f8eadc}
.chat-world{min-width:0;display:flex;align-items:center;gap:8px;overflow:hidden;border:1px solid #ddd9cd;border-radius:8px;background:#fffefa;padding:6px}.chat-world:hover{border-color:#b47959}.chat-thumb{display:block;width:51px;height:43px;flex:none;overflow:hidden;border-radius:5px;background:#d6dbc6}.chat-thumb img{display:block;width:100%;height:100%;object-fit:cover}.chat-thumb .fallback .icon{width:20px;height:20px}
.chat-result-copy{min-width:0;flex:1;display:grid}.chat-category{font-size:9px;color:#986246;line-height:1.2}.chat-result-title,.chat-blurb{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.chat-result-title{font-size:13px}.chat-blurb{font-size:11px;color:var(--muted)}.chat-enter{align-self:center;margin-right:3px;color:var(--accent);font-size:17px}
#chat-form{display:flex;align-items:center;flex:none;gap:7px;border-top:1px solid var(--line);padding:9px;background:#fffefa}#chat-input{flex:1;width:0;min-height:36px;padding:7px 9px;border:1px solid #d9d4c7;border-radius:7px;background:#faf9f4;font-size:14px}
#chat-send{display:grid;place-items:center;width:37px;height:37px;background:#ae4429;border-radius:8px;color:white}#chat-send:disabled{background:#ede9df;color:#838074;opacity:1;cursor:default}
@media(max-width:565px),(max-height:470px){.chat-widget{right:max(12px,env(safe-area-inset-right));bottom:calc(max(12px,env(safe-area-inset-bottom)) + var(--chat-keyboard,0px))}#chat-launcher{font-size:12px;min-height:43px;padding:0 12px 0 10px}#chat-launcher[aria-expanded=true]{display:none}#guide-chat{width:min(360px,calc(100vw - 24px));height:min(478px,calc(var(--chat-room) - 24px))}#chat-input{font-size:16px}}
#guide-chat{width:min(410px,calc(100vw - 36px));height:min(530px,calc(var(--chat-room) - 94px))}
.chat-heading{min-width:0}.chat-head{gap:8px}.chat-head .chat-heading small{font-size:8px}
#chat-online,#chat-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:20px;font-size:12px;font-weight:700;line-height:1.5}
#chat-online{gap:5px;max-width:45%;padding:3px 8px;background:#2c3c42;color:#bce5cc;overflow-wrap:anywhere}
#chat-online::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:#76cc93}
#chat-badge{padding:1px 7px;background:#daebda;color:#244a31;font-variant-numeric:tabular-nums}
.chat-tabs{display:grid;grid-template-columns:1fr 1fr;flex:none;background:#fffdf8;border-bottom:1px solid var(--line)}
.chat-tabs button{min-height:42px;padding:7px;border-bottom:2px solid transparent;color:var(--muted);font-size:13px;font-weight:700}
.chat-tabs button[aria-selected=true]{color:var(--accent);border-bottom-color:var(--accent)}
#chat-activity-pane,#chat-guide-pane{display:flex;flex-direction:column;flex:1;min-height:0}
.activity-summary{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:3px 10px;padding:10px 14px;background:#f4f1e9;color:#504b41;font-size:12px}
.activity-summary:has(> [hidden]:first-child){display:none}
.activity-feed-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 14px 3px}
.activity-feed-head h3{margin:0;font-size:13px}.activity-feed-head button{min-height:30px;padding:3px 6px;font-size:12px;color:var(--accent)}
.activity-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 14px 14px}
#chat-feed{display:grid;gap:7px;list-style:none;margin:0;padding:0}
.activity-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;padding:10px 12px;background:#f1ece2;border-radius:10px}
.activity-event,.activity-time{font-size:12px;color:#5c5549;overflow-wrap:anywhere}.activity-time{font-variant-numeric:tabular-nums}
.activity-follow{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:28px}
.activity-world{font-size:14px;overflow-wrap:anywhere}.activity-follow:hover .activity-world{text-decoration:underline}
.activity-cta{flex:none;max-width:48%;padding:3px 8px;border-radius:12px;background:#a84225;color:#fff;font-size:11px;font-weight:700;text-align:center}
#chat-activity-state{margin:3px 0;padding:13px;border:1px dashed #d9d2c4;border-radius:9px;color:#625b51;font-size:13px;line-height:1.6}
@media(max-width:565px),(max-height:470px){#guide-chat{width:min(410px,calc(100vw - 24px));height:min(530px,calc(var(--chat-room) - 24px))}}
.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.header-inner .brand{min-width:0}
.brand img,.header-actions{flex-shrink:0}
.brand span{min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.1}
.header-actions .register{margin:0;white-space:nowrap}
.language-control{position:relative;display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 10px;border:1px solid #d8d5c9;border-radius:7px;background:#fffefa;color:#44483f;font-size:13px;font-weight:650;white-space:nowrap}
.language-control:hover{border-color:#bcb9ad}.language-control:focus-within{outline:3px solid #bd522e;outline-offset:3px}
.language-control .icon{width:16px;height:16px}.language-control .language-chevron{width:12px;height:12px}
.language-control select{position:absolute;inset:0;width:100%;height:100%;opacity:0}
html:not(:lang(ko)) body{word-break:normal}
html:not(:lang(ko)) .hero h1{letter-spacing:-.045em}
html:not(:lang(ko)) .directory-views .sort select{width:auto;max-width:14em}
html:not(:lang(ko)) .filter-name{min-width:0}
@media(max-width:565px){
  .header-actions{gap:6px}.language-control{min-height:36px;gap:4px;padding:0 7px;font-size:12px}
  html:not(:lang(ko)) .directory-views{flex-wrap:wrap;align-items:center}
  html:not(:lang(ko)) .directory-views nav{flex:1 1 auto;justify-content:space-between;gap:6px}
  html:not(:lang(ko)) .directory-views .nav-link .icon{display:none}
  html:not(:lang(ko)) .directory-views .sort{margin-left:auto}
  html:not(:lang(ko)) .hero h1{font-size:clamp(24px,6.4vw,34px)}
  html:not(:lang(ko)) .hero-copy{width:66%}
  .header-actions .register{padding-inline:8px}
}
@media(max-width:480px){
  .brand{font-size:20px;gap:5px}.brand img{width:25px;height:25px}
  .language-control{justify-content:center;min-height:40px}
  .header-actions .register{height:40px;width:40px;padding:0}.header-actions .register .icon{width:19px;height:19px}
  .header-actions .register span{display:none}
  html:not(:lang(ko)) .directory-views{column-gap:10px}
}
@media(max-width:355px){
  .brand{font-size:18px}.language-control .language-chevron{display:none}
}

/* The slide copy and its controls stay in place while the featured world changes. */
.hero[data-kind]{--hero-gutter:clamp(23px,4.2%,54px);display:grid;grid-template-rows:minmax(0,1fr) auto;align-items:center;min-height:0;height:clamp(305px,24vw,335px);padding:21px var(--hero-gutter) 14px}
.hero[data-kind] .hero-copy{pointer-events:auto;width:54%;padding:0}
.hero[data-kind] h1{margin:9px 0 8px;font-size:clamp(34px,3.5vw,51px);line-height:1.12;white-space:pre-line;overflow-wrap:anywhere}
.hero[data-kind] .hero-copy p{max-width:48ch;line-height:1.55;text-wrap:pretty}
.hero[data-kind] .hero-art{width:61%;right:0;top:0;height:100%;object-position:50% 50%}
.hero[data-kind=game] .hero-art{object-fit:cover;image-rendering:auto;mask-image:linear-gradient(90deg,transparent 0%,#000 35%)}
.hero[data-kind=game]:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,#12192b88,transparent 28%)}
.hero-action{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:7px 12px;border-radius:5px;background:#fff2dd;color:#292c34;font-size:13px;font-weight:700;line-height:1.4;pointer-events:auto}
.hero-action .icon{height:15px;width:15px}.hero-action:hover{background:white}
.hero-controls{position:relative;z-index:1;display:flex;align-items:center;gap:12px;align-self:end;color:#fff9ee}
.hero-count{font:600 11px/1.2 var(--mono);letter-spacing:.06em;white-space:nowrap;color:#e4e6ed}
.hero-dots{display:flex;align-items:center}
.hero-dot{display:grid;place-items:center;width:24px;height:34px;padding:0;border-radius:4px;color:#c1c5cf}
.hero-dot:after{content:"";display:block;width:6px;height:6px;border-radius:4px;background:currentColor}
.hero-dot:hover{color:white}.hero-dot[aria-current=true]:after{width:17px;background:#ffac83}
.hero-transport{display:flex;align-items:center;gap:1px;margin-left:auto;padding:2px;border:1px solid #e6edff55;border-radius:8px;background:#161d30df}
.hero-transport button{display:grid;place-items:center;width:35px;height:31px;padding:0;border-radius:5px;color:#fff5e4}
.hero-transport button:hover{background:#ffffff26}.hero-transport .icon{width:17px;height:17px;stroke-width:2}
.hero-transport .play-icon,.hero-transport [data-paused=true] .pause-icon{display:none}
.hero-transport [data-paused=true] .play-icon{display:block}
.hero :focus-visible{outline:2px solid #ffc093;outline-offset:2px}
@media(max-width:900px){
  .hero[data-kind]{height:300px}
  .hero[data-kind] .hero-copy{width:61%}
  .hero[data-kind=game] .hero-art{mask-image:linear-gradient(90deg,transparent,#0008 32%,#000 55%)}
}
@media(max-width:565px){
  .hero[data-kind]{--hero-gutter:16px;height:315px;padding-top:16px;padding-bottom:10px}
  .hero[data-kind] .hero-copy{width:90%}
  .hero[data-kind] h1{font-size:clamp(27px,6vw,34px);max-width:17ch}
  .hero[data-kind] .hero-copy p{max-width:34ch;font-size:12px;line-height:1.5}
  .hero[data-kind] .hero-art{width:75%;opacity:.85}
  .hero[data-kind=game] .hero-art{mask-image:linear-gradient(90deg,transparent,#0005 40%,#000c 75%,#000)}
  .hero[data-kind=site] .hero-art{mask-image:linear-gradient(90deg,transparent,#0006 35%,#000)}
  .hero[data-kind=game]:before{z-index:0;background:linear-gradient(0deg,#11182bf0,transparent 42%)}
  .hero-action{margin-top:12px;font-size:12px}
  .hero-controls{gap:6px}.hero-transport button{width:31px;height:31px}
  .hero-dots{flex:1}.hero-dot{width:auto;flex:1}
}
@media(max-width:460px){
  .hero[data-kind]{height:322px}
  .hero-controls{display:grid;grid-template-columns:1fr auto;gap:0 6px}
  .hero-count{grid-column:1;grid-row:1}.hero-transport{grid-column:2;grid-row:1}
  .hero-dots{grid-column:1/-1;grid-row:2}.hero-dot{height:26px}
}