:root{--ps-cream: #ecdca6;--ps-cream-shadow: #cdb87c;--ps-accent-light: #cb966a;--ps-accent: #c1604a;--ps-accent-dark: #8a3327;--ps-peach: #dfae8c;--ps-text: #5c3a2e;--ps-nav: #a2a495}body,#root{margin:0;min-height:100vh}.main{font-family:sans-serif;background:var(--ps-cream);width:100%;height:100%;color:var(--ps-text);box-sizing:border-box;display:flex;flex-direction:column;min-height:100vh}.main-nav{width:calc(100% - 8px);background:var(--ps-nav);display:flex;flex-direction:row;justify-content:flex-end;align-items:center;padding:4px;border-bottom:4px solid #cbc4a7;position:relative;margin-bottom:12px;gap:8px}.main-nav:before{content:"";position:absolute;width:100%;top:calc(100% + 4px);height:8px;background:#786f64;border-bottom:4px solid #65514d;left:0}.main-inner{border:3px solid var(--ps-accent);background:var(--ps-cream);flex:1;width:calc(100% - 38px);margin:16px;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}.main-inner:after{content:"";width:100%;height:32px;margin-bottom:24px;background:var(--ps-accent-light);margin-top:auto;display:flex}.main-content{padding:16px;width:calc(100% - 32px)}.main-title-row{display:flex;justify-content:center;margin-top:-3px;width:100%}.main-title{font-family:sans-serif;font-weight:700;font-size:32px;line-height:1;padding:24px 16px;color:var(--ps-accent-dark);text-align:center;margin:0;border-bottom:3px solid var(--ps-accent);background:var(--ps-cream)}.main-title-diagonal{width:28px;background:var(--ps-cream)}.main-title-diagonal-right{transform:scaleX(-1)}.main-tabs{display:flex;flex-direction:row;gap:8px;padding:12px 16px 0}.main-tab-button{font-family:sans-serif;font-weight:600;font-size:16px;border:2px solid var(--ps-accent);border-radius:6px;background:var(--ps-cream);color:var(--ps-accent-dark);padding:8px 16px;cursor:pointer}.main-tab-button[data-active=true]{background:var(--ps-accent);color:var(--ps-cream)}.main-header{width:100%;min-height:10px;border-bottom:3px solid var(--ps-accent);margin-bottom:83px;position:relative}.main-header-separator{width:80%;height:83px;position:absolute;top:100%;left:10%;display:flex;background:var(--ps-cream)}.main-header-separator-body{border-bottom:3px solid var(--ps-accent);flex-grow:100}.add-card{width:max-content;min-width:300px}.icon-button{height:32px;width:32px;position:relative;margin:0;padding:0;border:0;background:none;cursor:pointer}.icon-button img{position:absolute;left:0;top:0}.info-card{background:#ab6747;border:2px solid transparent;font-family:sans-serif;border-image-slice:2;border-image-width:2;border-image-repeat:stretch;border-image-source:url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="UTF-8" ?><svg version="1.1" width="5" height="5" xmlns="http://www.w3.org/2000/svg"><path d="M2 1 h1 v1 h-1 z M1 2 h1 v1 h-1 z M3 2 h1 v1 h-1 z M2 3 h1 v1 h-1 z" fill="rgb(150 73 55)" /></svg>');border-image-outset:2}.info-card-header{width:calc(100% - 8px);min-height:20px;display:flex;flex-direction:row;position:relative;padding:4px;justify-content:space-between}.info-card-name{color:#cbc4a7}.info-card-close{margin-top:-3px}.info-card-inner{padding:8px;background:#292234;border:1px solid transparent;border-image-slice:2;border-image-width:2;border-image-repeat:stretch;border-image-source:url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="UTF-8" ?><svg version="1.1" width="5" height="5" xmlns="http://www.w3.org/2000/svg"><path d="M2 1 h1 v1 h-1 z M1 2 h1 v1 h-1 z M3 2 h1 v1 h-1 z M2 3 h1 v1 h-1 z" fill="rgb(150 73 55)" /></svg>');border-image-outset:2}.info-card-empty .info-card-inner{display:none}.rat-card-list{display:grid;flex-direction:row;grid-template-columns:calc((100% - 50px)/4) calc((100% - 50px)/4) calc((100% - 50px)/4) calc((100% - 50px)/4);gap:16px;width:100%;flex-wrap:wrap;padding:16px 0}@media (max-width: 1200px){.rat-card-list{display:grid;flex-direction:row;grid-template-columns:calc((100% - 32px) / 3) calc((100% - 32px) / 3) calc((100% - 32px) / 3)}}@media (max-width: 768px){.rat-card-list{display:grid;flex-direction:row;grid-template-columns:calc((100% - 20px)/2) calc((100% - 20px)/2)}}@media (max-width: 550px){.rat-card-list{display:grid;flex-direction:row;grid-template-columns:100%}}.rat-card-bracket{color:#126980}.rat-card-spacer{color:#126980;padding:0 4px}.rat-card-gene{display:flex;flex-direction:row;gap:4px;color:#42a2aa}.rat-card-allele{display:flex;flex-direction:row}.rat-card-gene-value--above-average{color:#538000}.rat-card-gene-value--below-average{color:#c07d7d}.rat-card-gene-value--minimum{color:#964937}.rat-card-gene-value--maximum{color:#417c39;text-decoration:underline}.add-form-title{color:#008990}.add-form-question{color:#42a2aa}.add-form-bracket{color:#126980}.add-form-spacer{color:#126980;padding:0 4px}.add-form-input{width:50px}.add-form-input-name{width:auto}.key-card{max-width:300px;margin:16px;justify-self:flex-end}
