*{

margin:0;

padding:0;

box-sizing:border-box;

}

:root{

--bg:#f6f5f1;

--text:#1d1d1d;

--soft:#777;

--line:#cfcfcf;

--mono:"IBM Plex Mono", monospace;

--sans:"IBM Plex Sans", sans-serif;

}

body{

background:var(--bg);

color:var(--text);

font-family:var(--sans);

font-size:15px;

line-height:1.7;

}

.container{

width:min(1300px,92%);

margin:60px auto;

}

header{

padding-bottom:35px;

border-bottom:1px solid var(--line);

margin-bottom:35px;

}

h1{

font-family:var(--mono);

font-size:34px;

font-weight:500;

margin-bottom:6px;

}

.subtitle{

font-size:14px;

color:var(--soft);

}

.location{

font-size:13px;

margin-top:2px;

color:var(--soft);

}

.status{

display:flex;

gap:70px;

margin-top:28px;

}

.status div{

display:flex;

flex-direction:column;

}

.status span{

font-size:11px;

letter-spacing:.1em;

color:var(--soft);

margin-bottom:4px;

}

.status strong{

font-size:18px;

font-family:var(--mono);

font-weight:400;

}

main{

display:grid;

grid-template-columns:280px 1fr;

gap:60px;

}

aside{

font-size:14px;

}

aside h2{

font-family:var(--mono);

font-size:13px;

letter-spacing:.08em;

margin-bottom:15px;

}

details{

margin-bottom:15px;

}

summary{

cursor:pointer;

font-family:var(--mono);

margin-bottom:10px;

}

details a{

display:block;

padding:3px 0 3px 18px;

color:var(--text);

text-decoration:none;

}

details a:hover{

text-decoration:underline;

}

.coming{

padding-left:18px;

font-size:13px;

color:var(--soft);

}

hr{

border:none;

border-top:1px solid var(--line);

margin:30px 0;

}

aside>a{

display:block;

margin:8px 0;

color:var(--text);

text-decoration:none;

}

aside>a:hover{

text-decoration:underline;

}

.viewer{

border-left:1px solid var(--line);

padding-left:45px;

min-height:550px;

}

.viewer h2{

font-family:var(--mono);

font-size:22px;

font-weight:400;

margin-bottom:18px;

}

.viewer p{

max-width:520px;

color:var(--soft);

}

@media(max-width:900px){

main{

grid-template-columns:1fr;

}

.viewer{

border-left:none;

border-top:1px solid var(--line);

padding-left:0;

padding-top:30px;

margin-top:30px;

}

.status{

flex-wrap:wrap;

gap:25px;

}

}