@charset "utf-8";
body { min-height: 100vh; min-height: -webkit-fill-available; }
@media screen and (min-height: 800px) {
  body { padding-top: 46px; }
}
html { height:100vh; max-width:834px; }
.w3-modal, .w3-modal-content {max-width:834px; }
.mca2-logo { font-family:Papyrus, fantasy; position:relative; font-size:112%; top:0.125em; padding-left:0.5ch!important; padding-right:0.5ch!important; }
.mca2-close { background-color:transparent; z-index:2; }
.mca2-flex-block { display:flex; height:100%; flex-direction: column; justify-content: flex-start; }
.mca2-shell { display: contents; }
.mca2-topmatter { flex-grow:0; flex-shrink:0; }
.mca2-bodymatter { flex-grow:1; flex-shrink:1; overflow-y:scroll; -webkit-overflow-scrolling:touch; }
.mca2-bodymatter>div { -webkit-transform: translate3d(0,0,0); }
.mca2-long { overflow:hidden; text-overflow:ellipsis; }
.mca2-long:hover { overflow:visible; text-overflow:inherit; z-index:1; }
#cardview { flex-grow:0; flex-shrink:0; }
#cardview h4 { width:90%; }
.mca2-menubuttons { padding:8px 0; }
.mca2-menubuttons .w3-button { width:90%; margin:4px auto; }
button:disabled { background: repeating-linear-gradient(-45deg, rgba(180,180,180,0.7), rgba(180,180,180,0.7) 6px, rgba(0,0,0,0) 6px, rgba(0,0,0,0) 12px); }
.bonus-text p { -webkit-margin-before:0.25em; -webkit-margin-after:0.25em; line-height:1.25}
.w3-bar-item.padded, .w3-cell.padded { padding-left:1ch; padding-right:1ch; }
.w3-table.mca2-thinpadding th, .w3-table.mca2-thinpadding td { padding: 4px 8px; }
.w3-bar-item.mca2-thinpadding { padding-left:4px; padding-right:4px; }
.mca2-thinpadding { padding:2px; line-height:1; }
.mca2-control span { cursor: pointer; }
.mca2-inline-input input { display: inline; padding-left: 4px; }
.mca2-inline-input span { white-space: nowrap; }
.advantage { color:green!important; background-color:inherit!important; }
.hindrance { color:red!important; background-color:inherit!important; }
.unowned { color:gray!important; background-color:inherit!important; }
.has-tip, .is-tip { cursor:pointer; }
.is-tip { color:#000; display:none; position:relative; font-style:italic; min-width:160px; margin:0; padding:0; z-index:1}
.is-tip.shown-tip { display:initial; }
span.has-tip:not(:first-child)::before { content:", "; }
span.shown-tip + span.has-tip::before { content:none!important; }
div.mca2-progress-guide { position: relative; }
div.mca2-progress-guide span { position: absolute; z-index +1; }
div.mca2-progress-guide div { display: inline-block; float: left; height: 100%; }
.mca2-curr-age { left: 0; white-space: nowrap; overflow-x: visible; }
.mca2-next-age { right: 0; white-space: nowrap; overflow-x: visible; }
.blue { background: rgb(200,230,255); }
.green { background: rgb(220,255,220); }
.orange { background: rgb(255,230,200); }
.red { background: rgb(255,220,220); }
.yellow { background: rgb(255,255,180); }
.blue_green { background: repeating-linear-gradient(-45deg, rgb(200,230,255), rgb(200,230,255) 10px, rgb(220,255,220) 10px, rgb(220,255,220) 20px); }
.blue_orange { background: repeating-linear-gradient(-45deg, rgb(200,230,255), rgb(200,230,255) 10px, rgb(255,230,200) 10px, rgb(255,230,200) 20px); }
.blue_red { background: repeating-linear-gradient(-45deg, rgb(200,230,255), rgb(200,230,255) 10px, rgb(255,220,220) 10px, rgb(255,220,220) 20px); }
.blue_yellow { background: repeating-linear-gradient(-45deg, rgb(200,230,255), rgb(200,230,255) 10px, rgb(255,255,180) 10px, rgb(255,255,180) 20px); }
.green_orange { background: repeating-linear-gradient(-45deg, rgb(220,255,220), rgb(220,255,220) 10px, rgb(255,230,200) 10px, rgb(255,230,200) 20px); }
.green_red { background: repeating-linear-gradient(-45deg, rgb(220,255,220), rgb(220,255,220) 10px, rgb(255,220,220) 10px, rgb(255,220,220) 20px); }
.green_yellow { background: repeating-linear-gradient(-45deg, rgb(220,255,220), rgb(220,255,220) 10px, rgb(255,255,180) 10px, rgb(255,255,180) 20px); }
.orange_yellow { background: repeating-linear-gradient(-45deg, rgb(255,230,200), rgb(255,230,200) 10px, rgb(255,255,180) 10px, rgb(255,255,180) 20px); }
.red_yellow { background: repeating-linear-gradient(-45deg, rgb(255,220,220), rgb(255,220,220) 10px, rgb(255,255,180) 10px, rgb(255,255,180) 20px); }
.minor { background: rgb(255,255,180); }
.tradeable { background: rgb(255,230,200); }
.nontradeable { background: rgb(255,200,200); }
