:root{--light-blue: #8ec7f6;--dark-blue: #015eb7;--red: #c01002;--light-red: #ef3f2f;--dark-red: #840a00;--orange: #ff9e15;--dark-orange: #ef8e05;--white: #ffffff;--transparent-white: rgba(255, 255, 255, .9);--more-transparent-white: rgba(255, 255, 255, .5);--body-colour: #36435a;--light-grey: #efefef;--dark-grey: #cdcdcd;--card-font-size: 16px;--action-button-background: #cacad3;--action-button-background-hover: var(--red);--action-button-color: black;--action-button-color-hover: white}html{background:#fff;&:has(bst-solo-view){height:100%;body,main,bst-cards{height:100%}}}body{margin:0;padding:0;background:#fff;font-family:Helvetica,sans-serif}body:has(bst-solo-view)>.header-nav,body:has(bst-solo-view)>footer{display:none}main{min-height:100vh}[hidden]{display:none}select{padding:4px 8px;border-radius:8px}bst-cards{background:#fff;display:block;&.fullscreen{overflow:scroll}}header.header-nav{position:relative;display:flex;justify-content:flex-start;align-items:center;gap:1rem;background-color:var(--body-colour);border-top:8px solid var(--dark-blue);border-bottom:8px solid var(--dark-blue);padding:1rem;box-shadow:0 5px 10px #0000004d;font-size:120%;@media(max-width:700px){padding:1rem 1rem .5rem}&[hidden]{display:none}}.staging header.header-nav{border-top:8px solid var(--dark-orange)}.local header.header-nav{border-top:8px solid rebeccapurple}.header-nav>span{flex-grow:0;height:100px;width:180px;background:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;transform:rotate(-4deg) translateY(20px);& img{transform:rotate(4deg) translate(6px,-23px)}@media(max-width:700px){display:none}}.header-nav .site-name{flex-grow:0;font-size:160%;font-weight:700;letter-spacing:2px;color:var(--white);margin:0}.header-nav p{flex-grow:0;font-size:100%;color:#8ec7f6;margin:0;letter-spacing:.8px;& a{color:inherit;font-size:100%;text-decoration:none;&:hover{color:var(--white);text-decoration:underline}}}.header-nav>div{position:relative;display:flex;flex-direction:column;box-sizing:border-box;.mini-stampie{display:none;height:50px;width:90px;background:#fff;border-radius:50%;justify-content:center;align-items:center;transform:rotate(-4deg) translateY(-6px);& img{transform:rotate(4deg) translate(4px,-10px)}}@media(max-width:700px){margin:0 auto;.mini-stampie{display:flex;position:absolute;top:.8rem;right:4px}}}.header-nav nav>ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr 1fr;justify-content:center;align-items:start;gap:.5rem;>li{position:relative;min-width:9.5rem;box-sizing:border-box;@media(max-width:700px){&:not(:first-child){min-width:6rem}}}}.header-nav nav>ul>li a,.header-nav .languages-list button{width:100%;box-sizing:border-box;font-size:inherit;display:block;text-decoration:none;padding:.6rem 1rem;margin:.75rem 0;background:#4b566b;color:#ffffffe6;border:2px solid transparent;border-radius:8px;text-align:center;transition:background-color .3s ease-in-out;&:hover{background:#222;border:2px solid var(--dark-blue);cursor:pointer}&.active,&[aria-current]{border:2px solid var(--dark-blue)}@media(max-width:700px){min-width:4.5rem;padding:.3rem .9rem}}.header-nav .languages-list{position:absolute;top:.75rem;z-index:1;margin:0;padding:2px;list-style:none;border-radius:8px;min-width:9rem;background:#4b566b;&.active{background:var(--dark-blue)}li{display:none;margin:0;padding:0;a{margin:0;border:2px solid var(--dark-blue)}button{margin:0;border:none;svg{width:1em;height:1em;fill:currentColor;margin-left:4px}&:hover{border:none}}&:first-child{display:block}}&:has(:hover),&:is(.open){background:var(--dark-blue);li{display:block}}}.card-display-controls{display:grid;grid-template-columns:2fr 1fr;align-items:stretch;gap:1rem;background:var(--light-grey);margin:0;padding:1rem 1.7rem;.card-display-controls-top{display:grid;grid-template-columns:1fr 1fr;gap:1rem;>span:nth-child(1){justify-content:flex-start;@media(max-width:1000px){justify-content:right}@media(max-width:660px){justify-content:center}}>span:nth-child(2){justify-content:center;@media(max-width:1000px){justify-content:left}@media(max-width:660px){justify-content:center}}@media(max-width:660px){grid-template-columns:1fr}}>span{justify-content:flex-end}@media(max-width:1000px){grid-template-columns:1fr;grid-template-rows:1fr 1fr;>span{justify-content:center}}@media(max-width:660px){grid-template-rows:2.5fr 1fr;>span{justify-content:center}}button{min-width:max-content;margin:0;padding:.4rem .8rem;background:var(--red);border:none;border-radius:8px;color:#fff;font-size:100%;display:flex;align-items:center;justify-content:center;gap:8px;transition:background-color .15s ease-in-out;position:relative;svg{fill:#fff;height:1.25em}span{flex-grow:1}&:hover{cursor:pointer;background:var(--dark-red)}}button.font-smaller{margin-right:-6px;border-radius:8px 0 0 8px;svg{height:.8rem;width:1rem}}button.font-larger{border-radius:0 8px 8px 0;svg{height:1.4rem;width:1rem}}}.card-display-controls>span,.card-display-controls-top>span{display:flex;gap:8px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading .refresh-all svg,bst-card.loading .icon-button.refresh svg{animation:spin .9s linear infinite}.card-display{--min-card-width: 400px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--min-card-width),100%),1fr));gap:8px;margin:1rem 1.5rem 2rem;@media(max-width:660px){margin:8px 8px 80px}}bst-solo-view{--base-font-size: 2rem;font-size:var(--base-font-size);grid-template-rows:4rem 1fr 8rem;grid-template-columns:8rem 1fr 8rem;grid-template-areas:"header header header" "prev main next" "footer footer footer";min-height:100%;margin:0;display:grid;background:#112131;place-items:center;@media(max-width:1200px){grid-template-areas:"header header header" "main main main" "footer footer footer";padding:1rem}@media(max-width:660px){padding:.5rem}.card-main-controls{font-size:2rem;button.card-font-larger svg{height:2.8rem;width:2rem}button.card-font-smaller svg{height:1.6rem;width:2rem}}.card-main{font-size:calc(var(--card-font-size) + 2vw);padding:16px 6rem 1rem}@media(max-width:660px){font-size:1.2rem;.card-main-controls{font-size:1.2rem;button.card-font-larger svg{height:1.4rem;width:1rem}button.card-font-smaller svg{height:.8rem;width:1rem}}.card-main{padding:8px 3rem 1rem 4rem}}.card-header h2 span{display:none}}.solo-controls{grid-area:header;color:#fff}.card-nav button{font-size:2rem;background:transparent;border:none;opacity:.7;&:hover{cursor:pointer;opacity:1}}.card-nav svg{width:1em;height:1em;fill:#fff;border:2px solid white;border-radius:50%;padding:1rem}.prev-card{grid-area:prev;@media(max-width:1200px){display:none}}.card-cell{grid-area:main;width:100%;height:100%}.next-card{grid-area:next;@media(max-width:1200px){display:none}}.solo-footer{grid-area:footer;height:8rem;display:grid;place-content:center;button{font-size:2rem;background:transparent;border:none;opacity:.7;&:hover{cursor:pointer;opacity:1}svg{width:1em;height:1em;fill:#fff;border:2px solid white;border-radius:50%;padding:1rem}}}.card{width:100%;max-width:1200px;height:100%;min-height:400px;border-radius:1rem;display:grid;grid-template-rows:min-content 1fr min-content;margin:0 auto;font-family:Helvetica Neue,sans-serif;button{opacity:.7;&:hover{opacity:1;cursor:pointer}}}.card-header{background:#015fb7;border-radius:1rem 1rem 0 0;display:grid;grid-template-columns:3em 1fr 3em;place-items:center;font-size:1em;color:#fff;padding:.5rem;h2{margin:.2em;text-align:center;line-height:1.2;font-weight:400;font-size:1.2em;button{opacity:.9;font:inherit;background:none;border:none;color:inherit;display:flex;align-items:center}}svg{fill:#fff;height:1em;width:1em}}.card-main{--backdrop: linear-gradient(transparent);--bg-image: linear-gradient(transparent);--bg-pattern: linear-gradient(transparent);&:has(.card-text-2:not(.invisible)){--backdrop: linear-gradient(rgb(0 0 0 / 40%))}&:has(.card-text-3:not(.invisible)){--backdrop: linear-gradient(rgb(0 0 0 / 40%))}background-image:var(--backdrop),var(--bg-image),var(--bg-pattern),var(--bg-pattern),linear-gradient(200deg,#36435a,#7bacd5 0%,#015eb7);background-position:50% 50%,50% 50%,0 0,30px 31px,50% 50%;background-repeat:no-repeat,no-repeat,repeat,repeat,no-repeat;background-size:cover,cover,60px 62px,60px 62px,cover;width:100%;font-size:var(--card-font-size, 2rem);line-height:1.2;display:grid;position:relative;padding:8px 2rem 1rem 3rem;box-sizing:border-box;gap:.5rem;&.preserve-aspect-ratio{background-size:cover,contain,60px 62px,60px 62px,cover;--bg-pattern: url("./stampy5-RVYMU3DR.png")}}.stampie-army .card-main{--bg-pattern: url("./stampy5-RVYMU3DR.png")}.card-main-image{grid-column:1/-1;grid-row:1/-1}.card-main-text{box-sizing:border-box;grid-column:1/-1;grid-row:1/-1;display:grid;height:100%;width:100%;z-index:2;justify-content:center;align-content:center}.card-text-1,.card-text-2,.card-text-3{padding:0;margin:0;place-self:center}.card-main[style^=--bg-image]{.card-main-controls{display:none}&:has(div[lang]:not(.invisible):not([hidden])) .card-main-controls{display:flex;.card-font-smaller,.card-font-larger{background:#fff;svg{fill:var(--body-colour)}}}}.card-main-controls{display:flex;position:absolute;top:6px;left:8px;flex-direction:column;gap:4px;font-size:1rem;button.card-font-smaller{background:transparent;border-color:#fff;opacity:.7;&:hover{opacity:1}svg{height:.8rem;width:1rem;fill:var(--white)}}button.card-font-larger{background:transparent;border-color:#fff;opacity:.7;&:hover{opacity:1}svg{height:1.4rem;width:1rem;fill:var(--white)}}}.card-footer{background:#eee;border-radius:0 0 1rem 1rem;display:grid;grid-template-columns:3em 1fr 3em;place-items:center;font-size:1em;padding:.5rem;.icon-button{color:#112131;border-color:#112131;svg{fill:#112131}}}.card-error{.card-header{background:var(--red)}.card-main{grid-template-rows:1fr 1fr 1fr;background:var(--light-red);color:#fff;padding:0 1.5rem;place-content:start;font-size:2rem}}.icon-button{height:2em;width:2em;font:inherit;font-size:1em;background:none;color:#fff;border:1px solid white;border-radius:1em;display:grid;place-items:center}.icon-button:first-child{justify-self:start}.icon-button:last-child{justify-self:end}.card-control-buttons{display:flex;width:100%;justify-content:space-around;gap:.4em}.card-control-buttons button{width:1rem;flex-grow:1;font-size:1em;padding:.4rem;background:none;color:#112131;border:1px dotted #112131;border-radius:6px;&:hover{background:var(--dark-blue);color:#fff;border:1px solid var(--dark-blue)}}.invisible{visibility:hidden}.visually-hidden{border:0;clip-path:inset(50%);height:1px;margin:0;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.login{margin:2rem;padding:2rem}.login label{color:#fff;display:block;margin-top:1rem}.speech-bubble{transition:opacity .3s ease-in-out;margin:0;pre{position:relative;border-radius:1rem;padding:.7rem 1.4rem;margin:0;font-family:inherit;text-align:left;background:var(--white);width:fit-content;text-wrap:wrap;border:1px dotted silver}&.hidden{opacity:0}}.speech-bubble-right pre{margin-left:auto}bst-card-editor .card-main{padding-top:1rem;color:#fff;font-size:1rem;display:flex;flex-direction:column;justify-content:flex-start;p:empty{display:none}.page-filters ul{margin-top:.2rem;margin-bottom:0}}bst-card-editor{display:flex;flex-direction:column}bst-tag-picker{margin-bottom:1rem;display:flex;flex-direction:column;gap:2px;max-width:40ch}.page-editor{padding:4rem;min-height:100%;bst-tag-picker{margin:2rem 0}}.page-editor-controls{margin-top:2rem;display:flex;gap:16px}.btn-main{margin:0;padding:.4rem .8rem;background:var(--red);border:none;border-radius:8px;color:#fff;font-size:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:background-color .15s ease-in-out;position:relative;&:hover{cursor:pointer;background:var(--dark-red)}&:after{content:"";position:absolute;inset:-4px;background:var(--red);border-radius:12px;z-index:-1}&:hover:after{background:var(--dark-red)}}.info-page{max-width:40rem;margin:0 auto 8rem;padding:0 1rem;line-height:1.6;h1{margin-top:2rem}h2{margin-top:3rem}.image-wrapper{background:#f8f8f8;text-align:center;border-radius:8px;padding:1rem;box-sizing:border-box;img{max-width:100%;height:auto}}.social-links{color:var(--body-colour);font-size:200%;display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem;a{display:flex;flex-direction:column;align-items:center;font-size:1rem;color:var(--body-colour);text-decoration:none;border:1px dotted transparent;border-radius:8px;&:hover{color:#ff8c00;border-color:silver;background:var(--light-grey);svg{fill:#ff8c00}}&:visited:not(:hover){color:#639;svg{fill:#639}}&:active{color:var(--dark-red);svg{fill:var(--dark-red)}}}svg{width:6em;height:6em;fill:var(--dark-blue)}}}.sign-up{display:block;margin:1rem auto;width:max-content;padding:1rem 2rem;background:var(--dark-blue);color:#fff;border-radius:8px;text-decoration:none;&:hover{background:#ff8c00;cursor:pointer}&:visited:not(:hover){background:#639}&:active{background:var(--dark-red)}}footer{text-align:center;background:var(--body-colour);color:#8ec7f6;padding:4rem 2rem;border-top:8px solid var(--dark-blue);border-bottom:8px solid var(--dark-blue);p{margin:.25rem 0}}.staging footer{border-bottom:8px solid var(--dark-orange)}.local footer{border-bottom:8px solid rebeccapurple}