5 src: url
('Checkbook.woff') format
('woff');
12 src: url
('FiraSans-Regular.woff') format
('woff');
19 src: url
('DejaVuSansMono.woff') format
('woff');
26 text-decoration: none
;
27 list-style-type: none
;
34 font-family: Sans
, sans-serif
;
37 background-color: white
;
40 header
, nav
, main
, section
{
46 -moz-user-select: none
;
47 -webkit-touch-callout: none
;
48 -webkit-user-select: none
;
52 font-family: Digital
, Sans
, sans-serif
;
57 body
[href
], body
[onclick
], .ticks
, input
, label
{
63 text-decoration: underline
;
72 background-color: black
;
73 font-family: Digital
, Sans
, sans-serif
;
89 body
{ padding-top: 2.5em; }
90 .standalone header { padding-top: 20px; }
91 .standalone { margin-top: 20px; }
94 body
[onclick
]:hover
, body
[onclick
]:active
,
95 body
[data-tray
]:hover
, body
[data-tray
]:active
,
96 label:hover
, label:active
,
103 border: solid black
1px;
110 font-family: Mono
, monospace
;
120 .close:after { content: "✕"; }
124 font-family: Digital
, Sans
, sans-serif
;
133 font-family: Sans
, sans-serif
;
137 .weapons > li:before {
138 content: attr
(data-remaining
) " " attr
(data-name
);
143 font-family: Mono
, monospace
;
146 .weapons > li[data-count="1"]:before {
147 content: attr
(data-name
);
151 font-family: Mono
, monospace
;
152 font-variant: small-caps
;
155 .stats { font-variant: small-caps
; }
157 display: inline-block
;
159 font-family: Mono
, monospace
;
161 .stats > li:before { font-size: 0.75em; font-family: Sans
, sans-serif
; }
162 .stats > .attack:before { content: "Atk "; }
163 .stats > .defense:before { content: "Def "; }
164 .stats > .range:before { content: "Rng "; }
167 font-variant: normal
;
168 text-transform: none
;
170 font-family: Sans
, sans-serif
;
174 display: -webkit-flex
;
177 -webkit-flex-wrap: wrap
;
179 -webkit-flex-direction: row
;
180 justify-content: space-around
;
181 -webkit-justify-content: space-around
;
182 align-items: flex-end
;
183 -webkit-align-items: flex-end
;
184 align-content: center
;
185 -webkit-align-content: center
;
189 display: inline-block
;
194 -webkit-flex-grow: 1;
198 display: inline-block
;
200 font-family: Mono
, monospace
;
204 [data-remaining
="0"] .ticks
{
211 padding-right: 1.5em;
212 list-style-type: none
;
213 display: inline-block
;
216 [data-remaining
="0"]:before
{
217 text-decoration: line-through
;
222 content: attr
(data-remaining
) " Tread Units";
223 font-family: Mono
, monospace
;
227 margin-right: -1.25em;
230 .treads.propulsion:before {
231 content: attr
(data-remaining
) " Prop. Units";
244 display: inline-block
;
245 font-family: Mono
, monospace
;
246 vertical-align: 0.125em;
250 display: inline-block
;
257 .treads > li:first-child:before {
258 content: "Move starts at";
259 font-family: Sans
, sans-serif
;
261 display: inline-block
;
262 font-variant: small-caps
;
263 vertical-align: 0.25em;
264 margin-right: -0.125em;
266 .treads.propulsion > li:first-child:before {
267 content: "Must move";
269 .treads > li:first-child:after { font-size: 1em; }
271 .treads > li:first-child:nth-last-child(n+1) { counter-reset: i
1; }
272 .treads > li:first-child:nth-last-child(n+2) { counter-reset: i
2; }
273 .treads > li:first-child:nth-last-child(n+3) { counter-reset: i
3; }
274 .treads > li:first-child:nth-last-child(n+4) { counter-reset: i
4; }
275 .treads > li:first-child:nth-last-child(n+5) { counter-reset: i
5; }
276 .treads > li:first-child:nth-last-child(n+6) { counter-reset: i
6; }
277 .treads > li:after { content: counter
(i
); counter-increment: i
-1; }
279 #unit-template { display: none
; }
283 border: solid black
1px;
286 transition: transform
0.3s;
287 -webkit-transition: -webkit-transform
0.3s;
288 background-color: rgba
(255, 255, 255, 0.9412);
291 -webkit-overflow-scrolling: touch
;
295 transform: translate
(0, 0) !important
;
296 -webkit-transform: translate
(0, 0) !important
;
297 transition: transform
0.3s;
298 -webkit-transition: -webkit-transform
0.3s;
302 transform: translateX
(-100%);
303 -webkit-transform: translateX
(-100%);
312 font-family: Digital
, Sans
, sans-serif
;
321 transform: translateX
(100%);
322 -webkit-transform: translateX
(100%);
330 text-align-last: center
;
331 -moz-text-align-last: center
;
332 -webkit-text-align-last: center
;
335 .stats { margin-top: -0.3333em; }
339 font-family: Digital
, Sans
, sans-serif
;
345 transform: translateX
(100%);
346 -webkit-transform: translateX
(100%);
353 font-family: Mono
, monospace
;
362 transform: translateY
(-100%);
363 -webkit-transform: translateY
(-100%);
369 @media (max-width: 1023px) {
370 html
{ font-size: 16px; }
373 @media (max-width: 768px) {
374 html
{ font-size: 13px; }
377 @media (max-width: 640px) {
378 section
{ margin: 1em; padding: 0.333em; }
379 .weapons > li:before { content: attr
(data-name
); }
380 .weapons > li { margin: 0.5em 0.5em; margin-bottom: 0; }
381 .stats > .attack:before { content: ""; }
382 .stats > .defense { padding: 0 0.5em; }
383 .stats > .defense:before {
385 font-family: Mono
, monospace
;
389 margin-top: -0.125em;
391 .stats > .range:before {
393 font-family: Mono
, monospace
;
396 .stats > .aside { display: none
; }
397 .stats > li { padding: 0; }
398 .treads { margin: 0 1.5em; min-width: 12em; }
399 .treads:before { margin-bottom: -0.75em; }
400 .treads > li:first-child:before {
402 font-family: Mono
, monospace
;
404 vertical-align: 0.125em;
408 @media (max-width: 480px) {
409 html
{ font-size: 11px; }
410 section
> .type
, section
> .aside
{ display: none
; }