@font-face{font-family:Paper;src:url('fonts/Paperlogy-4Regular.ttf')}@font-face{font-family:Paper;src:url('fonts/Paperlogy-6SemiBold.ttf');font-weight:600}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f7fa;color:#172534;font-family:Paper,sans-serif}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{text-decoration:none}header{max-width:1280px;margin:auto;min-height:120px;display:flex;align-items:center;justify-content:space-between;padding:18px 32px;gap:24px}.brand{display:flex;flex-direction:column;align-items:center;color:#203d5c;gap:5px}.brand img{width:152px;height:83px;object-fit:contain}.brand span{font-size:11px;font-weight:600}.header-note{font-size:13px;color:#687d91;margin-right:auto;margin-left:24px}.nav-link{font-size:13px;color:#0960bb}main{max-width:1280px;margin:auto;padding:0 32px}.hero{background:radial-gradient(ellipse at 90% 0,#247abd 0,transparent 62%),#102c46;border-radius:24px;color:white;padding:52px;min-height:400px;display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center}.hero small{font-size:11px;letter-spacing:2px;color:#b8d4e8}.hero h1{font-size:46px;line-height:1.35;letter-spacing:-2px;margin:22px 0}.hero em{color:#83c5ff;font-style:normal}.hero p{font-size:14px;line-height:1.9;color:#d7e5f0}.primary{display:inline-flex;gap:28px;padding:16px 20px;background:white;border-radius:10px;color:#173c5d;margin-top:20px;font-size:13px;font-weight:600}.hero-note{border:1px solid #ffffff30;border-radius:20px;padding:28px;background:#ffffff08}.hero-note>span{font-size:10px;letter-spacing:2px;color:#9fcced}.hero-note div{padding:21px 0;border-bottom:1px solid #ffffff20;font-size:15px}.hero-note b{margin-right:18px;color:#88c8ff;font-size:12px}.hero-note small{display:block;font-size:10px;letter-spacing:0;margin-top:23px}.intro{display:flex;align-items:center;justify-content:space-between;padding:46px 0 24px}.intro small{color:#0960bb;font-size:12px}.intro h2{font-size:28px;letter-spacing:-1px;margin:12px 0}.intro p{font-size:13px;line-height:1.8;color:#718295}.section-title{display:flex;justify-content:space-between;gap:20px;align-items:center}.categories{display:flex;gap:8px;flex-wrap:wrap}.categories button{padding:12px 20px;border-radius:24px;border:1px solid #d7e0e8;background:white;color:#42566c;font-size:13px}.categories .active{background:#0960bb;color:white;border-color:#0960bb}#search{background:white;border:1px solid #d6dfe8;border-radius:12px;padding:14px 16px;width:290px;font-size:12px}#result-count{font-size:12px;color:#788898;margin:25px 0 18px}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.card{border:1px solid #e0e6ed;border-radius:20px;overflow:hidden;background:white}.cover{padding:26px 30px;min-height:220px;background:linear-gradient(125deg,#193f66,#267db5);color:white;position:relative;overflow:hidden}.cover.nonlife{background:linear-gradient(125deg,#164955,#2b8796)}.cover:after{content:'';position:absolute;width:210px;height:210px;border:35px solid #ffffff08;border-radius:50%;right:-60px;bottom:-95px;pointer-events:none}.cover-top{display:flex;justify-content:space-between;font-size:10px;color:#d5e5f2}.cover h3{font-size:25px;line-height:1.5;max-width:280px;margin:28px 0 20px;letter-spacing:-.7px}.status{display:inline-block;padding:6px 10px;border-radius:5px;background:#ffffff18;font-size:10px}.card-body{padding:25px 30px}.card-body small{font-size:10px;color:#0960bb}.card-body h3{font-size:18px;line-height:1.5;margin:12px 0}.card-body p{font-size:12px;line-height:1.8;color:#728497}.outline{display:flex;justify-content:space-between;width:100%;padding:13px 0 0;margin-top:22px;border:0;border-top:1px solid #e6edf3;background:white;color:#305572;font-size:12px}.notice{display:flex;gap:18px;align-items:center;padding:25px 28px;background:#eaf0f6;border-radius:16px;margin:35px 0 55px}.notice-icon{border:1px solid #7893ac;border-radius:50%;padding:2px 8px;color:#587691}.notice h3{font-size:14px;margin:0 0 8px}.notice p{font-size:12px;color:#718295;line-height:1.8;margin:0}footer{display:flex;justify-content:space-between;padding:27px max(32px,calc((100% - 1216px)/2));border-top:1px solid #dce4eb;font-size:11px;color:#687c8f;gap:20px}dialog{border:0;border-radius:20px;padding:36px;width:min(540px,92vw);color:#172534}dialog::backdrop{background:#061322b0}dialog small{color:#0960bb}dialog h2{font-size:23px;line-height:1.5}dialog p{font-size:13px;line-height:1.8;color:#718295}.close{float:right;border:0;background:none;font-size:27px}.dialog-note{padding:18px;background:#edf3f8;border-radius:10px;font-size:13px;line-height:1.8}[hidden]{display:none!important}:focus-visible{outline:3px solid #52aaff;outline-offset:4px}@media(max-width:750px){header{padding:16px 20px;min-height:100px}.header-note{display:none}.brand img{width:122px;height:auto}main{padding:0 16px}.hero{padding:30px;grid-template-columns:1fr;gap:28px}.hero h1{font-size:35px}.hero-note{display:none}.intro{display:block;padding-top:32px}.intro h2{font-size:25px}.intro p{font-size:12px}.section-title{align-items:stretch;flex-direction:column;gap:16px}#search{width:100%}.categories button{padding:11px 15px;font-size:12px}.cards{grid-template-columns:1fr;gap:18px}.cover{min-height:205px}.notice{align-items:flex-start;padding:22px}.notice-icon{display:none}footer{padding:25px 20px;flex-direction:column;gap:10px}}
.card.playable{position:relative;cursor:pointer;transition:box-shadow .18s,transform .18s}.card.playable:hover{box-shadow:0 10px 28px #173c5d20;transform:translateY(-2px)}.card-play-link::after{content:"";position:absolute;inset:0;z-index:2;border-radius:20px}.card.playable:focus-within{outline:3px solid #52aaff;outline-offset:4px}

/* White corporate identity */
header{max-width:none;background:#102d47;padding:18px max(32px,calc((100% - 1216px)/2));margin-bottom:28px}.brand{color:#fff;gap:0}.brand img{width:152px;height:57px;object-fit:contain}.brand span{font-size:15px;font-weight:600;color:#fff}.header-note,header .nav-link{color:#dbe9f5}@media(max-width:750px){header{padding:16px 20px}.brand img{width:122px;height:46px}.brand span{font-size:12px}}

/* Aligned shared lockup */
.brand img{width:152px;height:auto;display:block}@media(max-width:750px){.brand img{width:122px;height:auto}}