:root{}
*{box-sizing:border-box;/*-webkit-user-select:none;user-select:none*/}
html,body{padding:0;width:100%}
body,main{margin:0;font-family:"Calibri",sans-serif;color:#333;background:#eee6ca}
body:has(dialog[open]){overflow:hidden}
header,footer,main{padding:0 var(--vpd)}
header,footer{position:fixed;width:100%;display:flex;flex-wrap:wrap;background-color:#ffe4c4}
header{top:0;justify-content:space-around;border-bottom:6px double #9f2a06;z-index:10;align-items:center}
footer{bottom:0;justify-content:space-around;margin:2rem auto 0;padding-bottom:1rem;align-items:flex-start;border-top:6px double #9f2a06;z-index:0;max-height:calc(100% - var(--hh));overflow-y:auto}
main{position:relative;width:fit-content;min-width:100%;margin-bottom:var(--fh);padding-top:var(--hh);border-bottom:1rem solid #9f2a06;z-index:1}
dialog.pop,dialog.pop0{bottom:-100vh;transform:translateY(100%);padding:0;outline:none}
dialog::backdrop{background:rgba(0,0,0,0.4)}
dialog.pop{max-width:calc(88% - var(--vpd));max-height:95%;border:3px solid #9f2a06;background-color:#ffe4c4;border-radius:.8em}
dialog .poptitle{width:100%;padding:0 3rem;min-height:calc(2rem + 4px);font-size:1.5rem;line-height:1.4;font-weight:600;white-space:pre-line;text-align:center;color:#fff;background-color:#9f2a06}dialog.pop>.poptitle *{vertical-align:middle}
dialog.pop>.popmsg{max-height:80vh;padding:1rem;font-size:1.2rem;overflow-y:auto}dialog.pop>.popmsg *{white-space:pre-line}
dialog.pop [btn].close{position:absolute;margin:2px;top:0;right:0}
dialog.pop0,#CURTAIN{max-width:100%;max-height:100%;width:100%;height:100%;border:none}
dialog.pop0{padding:0 var(--vpd);background-color:rgb(255,228,196)}
#CURTAIN{opacity:.4}
dialog.pop0 [btn].close{position:sticky;float:right;transform:translateX(calc(var(--vpd) - 2px));top:2px}
.marked{border:2px solid red!important;outline:2px solid red!important}
pre{font-family:"Calibri",sans-serif;text-align:justify;hyphens:auto;white-space:pre-wrap!important}
cite{display:block;width:100%;margin-top:.2rem;padding:.2rem;border:1px solid #51bae0;background-color:#fff;border-radius:4px}
a{outline:none}
.clr{clear:both}.hidden{display:none!important}
.rd{color:red}.gr{color:green}.cm{margin-left:1em;font-size:.8em;font-weight:normal}
.noscroll{overflow-y:hidden!important}
.disabled{pointer-events:none;text-decoration:none!important;background-color:dimgrey!important;color:linen!important;opacity:.5}


.btn3d{margin-left:.8em;padding:0 .5em;cursor:pointer;font-weight:600;height:fit-content;
	border:2px solid #9f2a06;border-radius:.3em;box-shadow:inset -.5rem -.5rem 1rem -.4rem #555;text-decoration:none!important;
	color:#0000EE!important;background-color:#eeffff;
}
.btn3d:hover,.prev:hover,.next:hover{color:#9f2a06!important}
.btn3d:active{box-shadow:inset .2rem .5rem 1rem -.4rem #000}



[btn],select,[type="radio"]{cursor:pointer}[btn] *{pointer-events:none}
[btn].close{width:2rem;height:2rem;border-radius:1rem;stroke:#000;background-color:#ccc;z-index:200}
[btn].close:hover{stroke:#fff;background-color:red}
[btn]:not(.close){width:fit-content;margin-right:.4rem;color:#0766FF;white-space:pre-wrap;text-decoration:underline;text-underline-offset:.2rem;text-decoration-thickness:2px;color:#0766FF}
[btn]:not(.close):hover,select:hover,input:not(:focus,[readonly]):hover,a:hover{background-color:#aaffff!important}
span[btn^='inf'],[btn^='pop'],a[data-i]{display:inline-block;margin-left:.25rem;width:1.6rem!important;height:1.6rem;line-height:calc(1.8rem - 4px);font-size:1.25rem;font-weight:600;text-align:center;text-decoration:none!important;text-underline-offset:0!important;border:1px solid#888;border-radius:.8rem;color:#0000ee;background-color:#fff}
[data-tit]:hover::after{position:absolute;top:0;right:2px;display:inline-block;padding:.2rem .4rem;width:fit-content;transform:translateY(-102%);text-align:left;white-space:pre;font-size:1rem;font-weight:normal;border-radius:4px;border:1px solid #5ab9dd;color:#6a6a6a;background-color:rgb(255,228,196);z-index:10;content:" ";
}

@keyframes show{from{bottom:-100vh;transform:translateY(100%)}to{bottom:0;transform:translateY(0%);}}
@keyframes grow{from{max-height:0vh}to{max-height:50vh}}
@keyframes shrink{from{max-height:50vh}to{max-height:0vh}}

.show{animation-duration:1s;animation-fill-mode:forwards}
.pop.show,.pop0.show{animation-name:show}
.accr{overflow-y:hidden}
.grow{animation:grow 1s linear forwards}
.shrink{animation:shrink 1s linear forwards}