:root{--navy:#091c2a;--navy2:#102f43;--cream:#f2eee0;--gold:#d4a94d;--muted:#9eb0bb;--panel:#102737;--line:#29485a}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--navy);font-family:Arial,Helvetica,sans-serif;color:var(--cream)}button,input{font:inherit}.app{width:100vw;height:100vh;max-width:3800px;max-height:2140px;margin:auto;padding:2.2vh 2.4vw 1.7vh;display:grid;grid-template-rows:auto auto 1fr;gap:1.7vh;background:radial-gradient(circle at 85% 0,#173b50 0,transparent 35%),linear-gradient(145deg,#071824,#102b3d)}.topbar{display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:1vw}.brand-mark{width:3.8vw;min-width:76px;aspect-ratio:1;border:3px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold);font-weight:900;font-size:1.45vw}.brand p{margin:0 0 .2vh;color:var(--gold);font-weight:800;letter-spacing:.18em;font-size:.72vw}.brand h1{margin:0;font-size:1.7vw;letter-spacing:-.02em}.summary{text-align:right;border-left:2px solid var(--gold);padding-left:1vw}.summary strong{display:block;font-size:1.3vw;color:var(--gold)}.summary span{font-size:.72vw;color:var(--muted)}.search-panel{background:rgba(16,39,55,.92);border:1px solid var(--line);border-radius:1vw;padding:1.1vh 1.2vw;box-shadow:0 16px 50px #0005}.mode-tabs{display:flex;gap:.5vw;margin-bottom:.9vh}.mode,.keyboard-button,.pager button{border:1px solid var(--line);background:#17364a;color:var(--cream);border-radius:.55vw;padding:.65vh .85vw;font-size:.74vw;font-weight:700;cursor:pointer}.mode.active{background:var(--gold);border-color:var(--gold);color:#10202a}.search-row{display:grid;grid-template-columns:1fr auto;gap:.8vw}.search-box{height:4.4vh;min-height:60px;background:#f8f5eb;border-radius:.62vw;display:flex;align-items:center;color:#10202a;padding:0 .8vw}.search-icon{font-size:1.4vw;margin-right:.55vw}.search-box input{border:0;outline:0;background:transparent;flex:1;font-size:1vw;color:#10202a}.clear{border:0;background:transparent;font-size:1.5vw;color:#567;cursor:pointer}.keyboard-button{font-size:.82vw;padding-inline:1.15vw;background:#244b60}.hint{font-size:.67vw;color:var(--muted);margin-top:.75vh}.results-panel{min-height:0;display:grid;grid-template-rows:auto 1fr auto;gap:1vh}.results-head{display:flex;align-items:baseline;justify-content:space-between}.results-head h2{font-size:1.15vw;margin:0}.results-head p{font-size:.7vw;color:var(--muted);margin:0}.results-grid{min-height:0;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:.8vw}.card{min-height:0;background:var(--panel);border:1px solid var(--line);border-radius:.7vw;overflow:hidden;display:grid;grid-template-rows:minmax(0,1fr) auto;cursor:pointer;transition:.18s transform,.18s border-color;box-shadow:0 12px 30px #0004}.card:hover,.card:focus{transform:translateY(-4px);border-color:var(--gold);outline:none}.thumb{width:100%;height:100%;object-fit:cover;background:#06131d}.card-copy{padding:.7vh .72vw;display:flex;align-items:center;justify-content:space-between;gap:.5vw}.card-copy h3{margin:0;font-size:.82vw}.card-meta{text-align:right}.card-meta strong{display:block;color:var(--gold);font-size:.66vw}.card-meta span{font-size:.58vw;color:var(--muted)}.pager{display:flex;justify-content:center;align-items:center;gap:1.2vw}.pager span{min-width:6vw;text-align:center;font-size:.67vw;color:var(--muted)}.pager button:disabled{opacity:.35;cursor:default}.keyboard{position:fixed;z-index:20;left:3vw;right:3vw;bottom:2vh;padding:1.2vh 1.1vw;background:#0b2130f7;border:2px solid var(--gold);border-radius:1vw;box-shadow:0 0 0 100vmax #0008,0 20px 70px #000}.keyboard.hidden,.detail.hidden{display:none}.keyboard-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1vh;font-size:.85vw}.keyboard-top button{border:0;background:transparent;color:var(--cream);font-weight:700;font-size:.72vw}.keys{display:flex;flex-wrap:wrap;justify-content:center;gap:.45vw}.key{height:5.4vh;min-height:66px;min-width:5.1vw;border:1px solid #517085;border-radius:.55vw;background:#183b50;color:white;font-size:1.05vw;font-weight:800;box-shadow:0 4px 0 #06131d}.key:active{transform:translateY(3px);box-shadow:0 1px 0 #06131d}.key.wide{min-width:10vw;background:#28566e}.key.gold{background:var(--gold);color:#10202a;border-color:var(--gold)}.detail{position:fixed;inset:0;z-index:30;background:#02090edb;display:grid;place-items:center;padding:3vh 3vw}.detail-card{position:relative;width:94vw;height:92vh;background:linear-gradient(140deg,#0c2637,#122f41);border:2px solid var(--gold);border-radius:1vw;padding:1.5vh 1.2vw;display:grid;grid-template-columns:58% 1fr;gap:1.2vw;box-shadow:0 30px 100px #000}.detail-card img{width:100%;height:100%;object-fit:contain;background:#06131d}.detail-copy{min-height:0;padding:1vh .8vw;overflow:hidden}.detail-date{color:var(--gold);font-size:.72vw;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.detail-copy h2{font-size:1.6vw;margin:.5vh 0 1.3vh}.name-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.55vh .8vw;font-size:.67vw}.name-grid span{padding:.35vh 0;border-bottom:1px solid #ffffff18}.detail-close{position:absolute;right:.7vw;top:.7vh;width:2.4vw;aspect-ratio:1;border:0;border-radius:50%;background:var(--gold);color:#10202a;font-size:1.4vw;font-weight:900;z-index:2}@media(max-aspect-ratio:16/10){.results-grid{grid-template-columns:repeat(3,1fr)}.card:nth-child(n+7){display:none}}