html,body{margin:0;padding:0;font-family:Verdana,sans-serif;color:#4f1515;min-height:100vh;background:repeating-linear-gradient(45deg,#0000 -50%,#0000 calc(50%/13),#39394e 0,#39394e calc(100%/13),#0000 0,#0000 calc(150%/13),#39394e 0,#39394e calc(200%/13),#0000 0,#0000 calc(250%/13),#39394e 0,#39394e calc(300%/13)),repeating-linear-gradient(45deg,#0000 -50%,#0000 calc(50%/13),#39394e 0,#39394e calc(100%/13),#0000 0,#0000 calc(150%/13),#39394e 0,#39394e calc(200%/13),#0000 0,#0000 calc(250%/13),#39394e 0,#39394e calc(300%/13)) 12px 12px,repeating-linear-gradient(-45deg,#0000 -50%,#0000 calc(50%/13),#39394e 0,#39394e calc(100%/13),#0000 0,#0000 calc(150%/13),#39394e 0,#39394e calc(200%/13),#0000 0,#0000 calc(250%/13),#39394e 0,#39394e calc(300%/13)),repeating-linear-gradient(-45deg,#0000 -50%,#0000 calc(50%/13),#39394e 0,#39394e calc(100%/13),#0000 0,#0000 calc(150%/13),#39394e 0,#39394e calc(200%/13),#0000 0,#0000 calc(250%/13),#39394e 0,#39394e calc(300%/13)) 12px 12px #c1f0bd;background-size:24px 24px}body{padding:40px 0}main{background:silver;border:3px solid #fff;border-radius:6px;box-shadow:2px 2px gray,4px 4px 12px #0008;max-width:800px;margin:0 auto;position:relative;overflow:hidden}.main-titlebar{display:flex;align-items:center;justify-content:space-between;background:repeating-linear-gradient(to bottom,#0a246a 0,#0a246a 2px,#3a6ea5 2px,#3a6ea5 4px);color:#fff;padding:.4em 1em .4em .8em;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.1em;font-weight:700;letter-spacing:1px;border-bottom:2px solid #808080;-webkit-user-select:none;user-select:none}.titlebar-deco{display:flex;align-items:center;margin-left:1em;margin-right:.2em}.main-content{padding:4px}nav ul{list-style:none;padding:.1em .3em;margin:0;display:flex;gap:0;justify-content:flex-start}nav li{display:inline-block;margin:0}nav a{display:inline-block;padding:.5em 1.5em;background:silver;color:#222;font-family:Courier New,Courier,monospace;font-size:1.2em;font-weight:700;letter-spacing:.5px;text-shadow:1px 1px 0 #fff,-1px -1px 0 #888;text-decoration:none;border:2px solid #fff;border-bottom-color:gray;border-right-color:gray;border-radius:2px;box-shadow:1px 1px gray,inset 1px 1px #fff;margin:.2em;transition:background .15s,color .15s,box-shadow .15s;position:relative}nav a:active{background:#a0a0a0;border-top-color:gray;border-left-color:gray;border-bottom-color:#fff;border-right-color:#fff;box-shadow:inset 1px 1px gray;top:1px;left:1px}nav a:hover,nav a:focus{background:#e0e0e0;color:#000;outline:none}article{background:none;color:inherit;font-family:inherit;font-size:inherit;border:none;border-radius:0;box-shadow:none;padding:.6em;margin:0;min-height:0;width:auto;box-sizing:content-box}article>h1{background:repeating-linear-gradient(to bottom,#ffe066 0,#ffe066 2px,#ffe98a 2px,#ffe98a 4px);color:#7a5c00;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.3em;font-weight:700;letter-spacing:1px;padding:.4em 1em .4em .8em;margin:.3em 0 .1em;border-bottom:2px solid #bfa800;border-top-left-radius:2px;border-top-right-radius:2px;box-shadow:0 2px #fffbe6,inset 0 1px #fffbe6;text-shadow:1px 1px 0 #fffbe6;-webkit-user-select:none;user-select:none}article>section{background:#fff;color:#222;font-family:Courier New,Courier,monospace;font-size:1em;border:2px solid #fff;border-bottom-color:gray;border-right-color:gray;border-radius:2px;box-shadow:1px 1px gray,inset 1px 1px #fff;padding:1.2em 1.5em;margin:0;width:100%;box-sizing:border-box}article>h1:not(:first-of-type){margin:2em 0 0}article>summary{margin:0 0 2em;color:#555;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.05em;padding:1em 0 0;text-shadow:1px 1px 0 #fff,-1px -1px 0 #aaa,1px -1px 0 #e0e0e0,-1px 1px 0 #e0e0e0}article a{color:#1a1a1a;font-weight:700;font-family:Courier New,Courier,monospace;background:linear-gradient(90deg,#fffbe6 60%,#ffe066);border-bottom:2px solid #ffe066;border-radius:3px;padding:.1em .4em;text-decoration:none;box-shadow:1px 1px #ffe066,2px 2px #bfa800;transition:background .15s,color .15s,box-shadow .15s;margin:0 .1em;position:relative}article a:hover,article a:focus{background:linear-gradient(90deg,#ffe066 60%,#fffbe6);color:#7a5c00;box-shadow:2px 2px #ffe066,3px 3px #bfa800;outline:none;text-decoration:underline}