{% extends "base.html" %}
{% block extra_css %}
	<style>
		:root {
			--section-gap: 1px;
			--header-font-size: 80%;
			--padding-standard: 0px 4px;
			--padding-header: 1px 8px;
			--standard-border: 1px solid rgb(var(--color-header));

			--font-page-primary-fields: 500 var(--font-size-14) 'Roboto', sans-serif;
			--font-page-secondary-fields: 400 var(--font-size-12) 'Roboto', sans-serif;
			--font-page-primary-labels: 400 var(--font-size-14) 'Roboto', sans-serif;
			--font-page-secondary-lables: 400 var(--font-size-12) 'Roboto', sans-serif;
			--font-page-primary-footer: 500 var(--font-size-12) 'Roboto', sans-serif;
			--font-page-secondary-footer: 400 var(--font-size-11) 'Roboto', sans-serif;

			--font-size-14: 0.875rem;
			--font-size-12: 0.75rem;
			--font-size-11: 0.6875rem;

			--color-background: 238, 238, 238;
			--color-on-background: 0, 0, 0;
			--color-content: 255, 255, 255;
			--color-on-content: 0, 0, 0;
			--color-banding: 235, 235, 220;
			--color-on-banding: 0, 0, 0;
			--color-header: 43, 43, 43;
			--color-on-header: 255, 255, 255;
			--color-focused-tab: 224, 212, 175;
			--color-on-focused-tab: 0, 0, 0;
			--color-current-tab: 211, 207, 197;
			--color-on-current-tab: 0, 0, 0;
			--color-editable: 255, 255, 255;
			--color-on-editable: 0, 0, 160;
			--color-editable-border: 192, 192, 192;
			--color-focused-editable-border: 0, 0, 192;
			--color-selection: 0, 96, 160;
			--color-on-selection: 255, 255, 255;
			--color-inactive-selection: 0, 64, 128;
			--color-on-inactive-selection: 228, 228, 228;
			--color-inactive-selection: 0, 64, 128;
			--color-on-inactive-selection: 0, 0, 0;
			--color-scroll: 192, 192, 192, 0.5;
			--color-scroll-rollover: 192, 192, 192;
			--color-scroll-edge: 128, 128, 128;
			--color-accent: 0, 102, 102;
			--color-control: 248, 248, 255;
			--color-on-control: 0, 0, 0;
			--color-pressed-control: 0, 96, 160;
			--color-on-pressed-control: 255, 255, 255;
			--color-control-edge: 96, 96, 96;
			--color-divider: 192, 192, 192;
			--color-icon-button: 96, 96, 96;
			--color-icon-button-rollover: 0, 0, 0;
			--color-pressed-icon-button: 0, 96, 160;
			--color-drop-area: 204, 0, 51;
			--color-toolip: 252, 252, 196;
			--color-on-tooltip: 0, 0, 0;
			--color-search-list: 224, 255, 255;
			--color-on-search-list: 0, 0, 0;
			--color-marker: 252, 242, 196;
			--color-on-marker: 0, 0, 0;
			--color-error: 192, 64, 64;
			--color-on-error: 255, 255, 255;
			--color-warning: 224, 128, 0;
			--color-on-warning: 255, 255, 255;
			--color-overloaded: 192, 64, 64;
			--color-on-overloaded: 255, 255, 255;
			--color-page: 255, 255, 255;
			--color-on-page: 0, 0, 0;
			--color-page-void: 128, 128, 128;
			--color-hint: 128, 128, 128;
			--color-link: 0, 255, 127;
			--color-on-link: 0, 0, 0;
			--color-pdf-link-highlight: 0, 255, 127;
			--color-pdf-marker-highlight: 255, 255, 0;
		}


		svg {
			width: 1em;
			height: 1em;
			background-color: transparent;
		}

		body {
			background-color: rgb(var(--color-page));
			color: rgb(var(--color-on-page));
			margin: 0.25in;
			margin-bottom: calc(0.25in - 1em);
		}

		#sheet {
			background-color: rgb(var(--color-page));
			padding: var(--padding-header);

			display: flex;
			flex-flow: column nowrap;
			justify-content: start;
			gap: var(--section-gap);
			min-width: 840px;
			max-width: 900px;
		}

		.header {
			grid-area: header;
			background-color: rgb(var(--color-header));
			color: rgb(var(--color-on-header));
			justify-content: center;
			text-align: center;
			padding-bottom: 2px;
			font: var(--font-page-primary-labels);
		}

		.header:not(.entry-parent) {
			padding: var(--padding-header);
		}

		.fieldblock {
			display: grid;
			grid-template-columns: 0fr 1fr;
			align-items: end;
			text-align: left;
			white-space: nowrap;
			align-self: stretch;
			background-color: rgb(var(--color-content));
			color: rgb(var(--color-on-content));
		}

		.fieldblock3 {
			display: grid;
			grid-template-columns: 0fr 0fr 1fr;
			white-space: nowrap;
			background-color: rgb(var(--color-content));
			color: rgb(var(--color-on-content));
		}

		.fieldblock3>* {
			padding: var(--padding-standard);
		}

		.fieldblock5 {
			display: grid;
			grid-template-columns: repeat(5, 0fr);
			white-space: nowrap;
			background-color: rgb(var(--color-content));
			color: rgb(var(--color-on-content));
		}

		.fieldblock5>* {
			padding: var(--padding-standard);
		}

		.label {
			font: var(--font-page-primary-labels);
			padding: var(--padding-standard);
		}

		.field {
			font: var(--font-page-primary-fields);
			padding: 0;
			border: none;
			border-bottom: 1px solid rgb(var(--color-control-edge));
			border-radius: 0;
			color: rgb(var(--color-on-editable));
		}

		.field.noedit {
			background-color: rgb(var(--color-content));
			border-bottom: none;
		}

		#sheet {
			background-color: rgb(var(--color-page));
			padding: var(--padding-header);
			display: flex;
			flex-flow: column nowrap;
			justify-content: start;
			gap: var(--section-gap);
		}

		#personal {
			grid-area: personal;
			display: grid;
			grid-template: "portrait identity miscellaneous points""portrait description description points";
			grid-template-rows: 0fr;
			grid-template-columns: min-content auto auto 0fr;
			gap: var(--section-gap);
		}

		#portrait {
			grid-area: portrait;
			display: grid;
			grid-template: "header""portrait";
			grid-template-rows: 0fr auto;
			border: var(--standard-border);
		}

		.portrait {
			background-image: url();
			background-position: center;
			background-repeat: no-repeat;
			background-size: cover;
			width: 6.75rem;
		}

		#identity {
			grid-area: identity;
			display: grid;
			grid-template: "header""block";
			grid-template-rows: 0fr 1fr;
			border: var(--standard-border);
		}

		#identity .label {
			text-align: right;
		}

		#miscellaneous {
			grid-area: miscellaneous;
			display: grid;
			grid-template: "header""block";
			grid-template-rows: 0fr 1fr;
			border: var(--standard-border);
		}

		#miscellaneous .label {
			text-align: right;
		}

		#description {
			grid-area: description;
			display: grid;
			grid-template: "header header header""block block block";
			grid-template-columns: 1fr 1fr 1fr;
			border: var(--standard-border);
		}

		#description .label {
			text-align: right;
		}

		#points {
			grid-area: points;
			display: grid;
			grid-template: "header""block";
			grid-template-rows: 0fr 1fr;
			border: var(--standard-border);
		}

		#points .field {
			text-align: right;
			padding: var(--padding-standard);
		}

		#points .fieldblock .field:nth-child(4n-1),
		#points .fieldblock .label:nth-child(4n) {
			background-color: rgb(var(--color-banding));
		}

		#stats {
			grid-area: stats;
			display: grid;
			grid-template: "attributes hit-locations encumbrance-lifting";
			gap: var(--section-gap);
		}

		#attributes {
			grid-area: attributes;
			display: grid;
			grid-template: "primary-attributes secondary-attributes""basic-damage secondary-attributes""pool-attributes pool-attributes";
			grid-template-columns: 1fr 1fr;
			gap: var(--section-gap);
		}

		#primary-attributes {
			grid-area: primary-attributes;
		}

		#secondary-attributes {
			grid-area: secondary-attributes;
		}

		#pool-attributes {
			grid-area: pool-attributes;
		}

		#basic-damage {
			grid-area: basic-damage;
		}

		#basic-damage .fieldblock3 .points {
			color: transparent;
		}

		#basic-damage .fieldblock3 .label:nth-child(6n),
		#basic-damage .fieldblock3 .field:nth-child(6n-1),
		#basic-damage .fieldblock3 .points:nth-child(6n-2) {
			background-color: rgb(var(--color-banding));
		}

		#attributes .points {
			font: var(--font-page-secondary-fields);
			color: rgba(var(--color-on-editable), 0.6);
		}

		#attributes .label {
			font: var(--font-page-primary-labels);
			color: rgb(var(--color-on-content));
		}

		#attributes .field {
			text-align: right;
		}

		#hit-locations {
			grid-area: hit-locations;
			display: grid;
			grid-template: "title title title title title""entry-parent roll location penalty dr";
			grid-template-columns: min-content min-content 1fr min-content min-content;
			grid-template-rows: 0fr;
			white-space: nowrap;
		}

		#hit-locations .header {
			grid-area: auto;
		}

		#hit-locations .header.body-plan {
			grid-area: title;
		}

		#hit-locations .header.location {
			grid-column: span 2;
		}

		#hit-locations .penalty:not(.header),
		#hit-locations .dr:not(.header) {
			color: rgba(var(--color-on-editable), 0.6);
			font: var(--font-page-primary-fields);
		}

		#hit-locations .penalty:not(.header) {
			text-align: right;
		}

		#hit-locations .roll:not(.header),
		#hit-locations .location:not(.header) {
			color: rgb(var(--color-on-content));
			font: var(--font-page-primary-labels);
		}

		#hit-locations .dr,
		#hit-locations .roll {
			text-align: center;
		}

		#hit-locations .roll,
		#hit-locations .penalty {
			border-right: 1px solid rgb(var(--color-header));
		}

		#hit-locations :not(.header):not(.entry-parent) {
			padding: var(--padding-standard);
		}

		#hit-locations .entry-parent:nth-child(10n+1):not(.header),
		#hit-locations .roll:nth-child(10n+2):not(.header),
		#hit-locations .location:nth-child(10n+3):not(.header),
		#hit-locations .penalty:nth-child(10n+4):not(.header),
		#hit-locations .dr:nth-child(10n+5):not(.header) {
			background-color: rgb(var(--color-banding));
		}

		#encumbrance-lifting {
			grid-area: encumbrance-lifting;
			display: grid;
			grid-template: "encumbrance""lifting";
			gap: var(--section-gap);
		}

		#encumbrance {
			grid-area: encumbrance;
			display: grid;
			grid-template: "title title title title title title""header1 header1 header1 header2 header3 header4""encumbrance-marker level-number level max-load move dodge";
			grid-template-columns: min-content min-content 1fr min-content min-content min-content;
			grid-template-rows: 0fr 0fr;
			align-content: baseline;
			white-space: nowrap;
			font: var(--font-page-primary-fields);
			background-color: rgb(var(--color-content));
			color: rgba(var(--color-on-editable), 0.6);
			text-align: right;
		}

		#encumbrance .encumbrance-marker {
			color: rgb(var(--color-on-content));
		}

		#encumbrance .encumbrance-marker path {
			display: none;
		}

		#encumbrance .encumbrance-marker.current path.current {
			display: inline;
		}

		#encumbrance .level:not(.header) {
			color: rgb(var(--color-on-content));
			font: var(--font-page-primary-labels);
			text-align: left;
		}

		.level-number.enc0:after {
			content: "0";
		}

		.level-number.enc1:after {
			content: "1";
		}

		.level-number.enc2:after {
			content: "2";
		}

		.level-number.enc3:after {
			content: "3";
		}

		.level-number.enc4:after {
			content: "4";
		}

		.level.enc0:after {
			content: "None";
		}

		.level.enc1:after {
			content: "Light";
		}

		.level.enc2:after {
			content: "Medium";
		}

		.level.enc3:after {
			content: "Heavy";
		}

		.level.enc4:after {
			content: "X-Heavy";
		}

		#encumbrance .current {
			background-color: rgb(var(--color-marker)) !important;
		}

		#encumbrance .current.level {
			color: rgb(var(--color-on-marker)) !important;
		}

		svg path.shape-equipped-0 {
			display: none;
		}

		#encumbrance .header {
			grid-area: auto;
			text-align: center;
		}

		#encumbrance .title {
			grid-area: title;
		}

		#encumbrance .level.header {
			grid-column: 1/span 3;
		}

		#encumbrance .level,
		#encumbrance .max-load,
		#encumbrance .move {
			border-right: 1px solid rgb(var(--color-header));
		}

		#encumbrance> :not(.header) {
			padding: var(--padding-standard);
		}

		#encumbrance .encumbrance-marker:nth-child(12n):not(.header),
		#encumbrance .level-number:nth-child(12n+1):not(.header),
		#encumbrance .level:nth-child(12n+2):not(.header),
		#encumbrance .max-load:nth-child(12n+3):not(.header),
		#encumbrance .move:nth-child(12n+4):not(.header),
		#encumbrance .dodge:nth-child(12n+5):not(.header) {
			background-color: rgb(var(--color-banding));
		}


		#lifting {
			grid-area: lifting;
			display: grid;
			grid-template: "header header""lift label";
			grid-template-rows: 0fr;
		}

		#lifting .lift {
			font: var(--font-page-primary-fields);
			color: rgba(var(--color-on-editable), 0.6);
			text-align: right;
		}

		#lifting .label {
			font: var(--font-page-primary-labels);
			color: rgb(var(--color-on-content));
		}

		#lifting .lift:nth-child(4n),
		#lifting .label:nth-child(4n+1) {
			background-color: rgb(var(--color-banding));
		}

		#embeds {
			display: grid;
			grid-auto-columns: 1fr 1fr;
			gap: var(--section-gap);
			grid-template:
				"reactions conditional_modifiers"
"melee melee"
"ranged ranged"
"traits skills"
"spells spells"
"equipment equipment"
"other_equipment other_equipment"
"notes notes"
 ;
		}

		#melee {
			grid-area: melee;
			grid-template-columns: min-content 1fr repeat(7, auto);
		}

		#melee .entry-parent:nth-child(18n+1):not(.header),
		#melee .desc:nth-child(18n+2):not(.header),
		#melee .usage:nth-child(18n+3):not(.header),
		#melee .level:nth-child(18n+4):not(.header),
		#melee .parry:nth-child(18n+5):not(.header),
		#melee .block:nth-child(18n+6):not(.header),
		#melee .damage:nth-child(18n+7):not(.header),
		#melee .reach:nth-child(18n+8):not(.header),
		#melee .st:nth-child(18n+9):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#melee .desc:not(.header),
		#melee .usage:not(.header),
		#melee .level:not(.header),
		#melee .parry:not(.header),
		#melee .block:not(.header),
		#melee .damage:not(.header),
		#melee .reach:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#melee .st:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}

		#melee :nth-last-child(-n+9) {
			border-bottom: none !important;
		}

		#ranged {
			grid-area: ranged;
			grid-template-columns: min-content 1fr repeat(10, auto);
		}

		#ranged .entry-parent:nth-child(24n+1):not(.header),
		#ranged .desc:nth-child(24n+2):not(.header),
		#ranged .usage:nth-child(24n+3):not(.header),
		#ranged .level:nth-child(24n+4):not(.header),
		#ranged .acc:nth-child(24n+5):not(.header),
		#ranged .range:nth-child(24n+6):not(.header),
		#ranged .damage:nth-child(24n+7):not(.header),
		#ranged .rof:nth-child(24n+8):not(.header),
		#ranged .shots:nth-child(24n+9):not(.header),
		#ranged .bulk:nth-child(24n+10):not(.header),
		#ranged .recoil:nth-child(24n+11):not(.header),
		#ranged .st:nth-child(24n+12):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#ranged .desc:not(.header),
		#ranged .usage:not(.header),
		#ranged .level:not(.header),
		#ranged .acc:not(.header),
		#ranged .range:not(.header),
		#ranged .damage:not(.header),
		#ranged .rof:not(.header),
		#ranged .shots:not(.header),
		#ranged .bulk:not(.header),
		#ranged .recoil:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#ranged .st:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}

		#ranged :nth-last-child(-n+12) {
			border-bottom: none !important;
		}

		#reactions {
			grid-area: reactions;
			grid-template-columns: min-content min-content auto;
		}

		#reactions .entry-parent:nth-child(6n+1):not(.header),
		#reactions .modifier:nth-child(6n+2):not(.header),
		#reactions .situation:nth-child(6n+3):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#reactions .modifier:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#reactions .situation:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}

		#reactions :nth-last-child(-n+3) {
			border-bottom: none !important;
		}

		#conditional-modifiers {
			grid-area: conditional_modifiers;
			grid-template-columns: min-content min-content auto;
		}

		#conditional-modifiers .entry-parent:nth-child(6n+1):not(.header),
		#conditional-modifiers .modifier:nth-child(6n+2):not(.header),
		#conditional-modifiers .situation:nth-child(6n+3):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#conditional-modifiers .modifier:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#conditional-modifiers .situation:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}

		#conditional-modifiers :nth-last-child(-n+3) {
			border-bottom: none !important;
		}

		#traits {
			grid-area: traits;
			grid-template-columns: min-content 1fr repeat(2, auto);
		}

		#embeds>div>.header {
			grid-area: auto;
		}

		#traits .entry-parent:nth-child(8n+1):not(.header),
		#traits .desc:nth-child(8n+2):not(.header),
		#traits .points:nth-child(8n+3):not(.header),
		#traits .reference:nth-child(8n+4):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#traits .desc:not(.header),
		#traits .points:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#traits .reference:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}


		#traits :nth-last-child(-n+4) {
			border-bottom: none !important;
		}

		#skills {
			grid-area: skills;
			grid-template-columns: min-content 1fr repeat(4, auto);
		}

		#skills .header {
			grid-area: auto;
		}

		#skills .entry-parent:nth-child(12n+1):not(.header),
		#skills .desc:nth-child(12n+2):not(.header),
		#skills .level:nth-child(12n+3):not(.header),
		#skills .rsl:nth-child(12n+4):not(.header),
		#skills .points:nth-child(12n+5):not(.header),
		#skills .reference:nth-child(12n+6):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#skills .desc:not(.header),
		#skills .level:not(.header),
		#skills .rsl:not(.header),
		#skills .points:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#skills .reference:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}

		#skills :nth-last-child(-n+6) {
			border-bottom: none !important;
		}

		#spells {
			grid-area: spells;
			grid-template-columns: min-content 1fr repeat(5, auto);
		}

		#spells .header {
			grid-area: auto;
		}

		#spells span[class=""] {
			display: none;
		}

		#spells .entry-parent:nth-child(14n+1):not(.header),
		#spells .desc:nth-child(14n+2):not(.header),
		#spells .college:nth-child(14n+3):not(.header),
		#spells .level:nth-child(14n+4):not(.header),
		#spells .rsl:nth-child(14n+5):not(.header),
		#spells .points:nth-child(14n+6):not(.header),
		#spells .reference:nth-child(14n+7):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#spells .desc:not(.header),
		#spells .college:not(.header),
		#spells .level:not(.header),
		#spells .rsl:not(.header),
		#spells .points:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}


		#spells .reference:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}


		#spells :nth-last-child(-n+7) {
			border-bottom: none !important;
		}

		#equipment {
			grid-area: equipment;
			grid-template-columns: min-content auto auto 1fr repeat(8, auto);
		}

		#equipment .header {
			grid-area: auto;
		}

		#embeds #equipment>div>.equipped:not(.header) {
			padding: var(--padding-header);
		}

		.legality-class.Open::after {
			content: "4";
		}

		.legality-class.Licensed::after {
			content: "3";
		}

		.legality-class.Restricted::after {
			content: "2";
		}

		.legality-class.Military::after {
			content: "1";
		}

		.legality-class.Banned::after {
			content: "0";
		}

		#embeds .uses.max0 {
			text-indent: 200%;
			white-space: nowrap;
			overflow: hidden;
		}

		#equipment .entry-parent:nth-child(24n+1):not(.header),
		#equipment .equipped:nth-child(24n+2):not(.header),
		#equipment .quantity:nth-child(24n+3):not(.header),
		#equipment .desc:nth-child(24n+4):not(.header),
		#equipment .uses:nth-child(24n+5):not(.header),
		#equipment .tech-level:nth-child(24n+6):not(.header),
		#equipment .legality-class:nth-child(24n+7):not(.header),
		#equipment .value:nth-child(24n+8):not(.header),
		#equipment .weight:nth-child(24n+9):not(.header),
		#equipment .extended-value:nth-child(24n+10):not(.header),
		#equipment .extended-weight:nth-child(24n+11):not(.header),
		#equipment .reference:nth-child(24n+12):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#equipment .equipped:not(.header),
		#equipment .quantity:not(.header),
		#equipment .desc:not(.header),
		#equipment .uses:not(.header),
		#equipment .tech-level:not(.header),
		#equipment .legality-class:not(.header),
		#equipment .weight:not(.header),
		#equipment .value:not(.header),
		#equipment .extended-weight:not(.header),
		#equipment .extended-value:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#equipment .reference:not(.header) {
			border-bottom: 1px solid rbg(var(--color-header));
		}

		#equipment :nth-last-child(-n+11) {
			border-bottom: none !important;
		}

		#equipment .equipped {
			padding: var(--padding-header);
		}

		#other-equipment {
			grid-area: other_equipment;
			grid-template-columns: min-content auto 1fr repeat(8, auto);
		}

		#other-equipment .header {
			grid-area: auto;
		}

		#other-equipment .entry-parent:nth-child(22n+1):not(.header),
		#other-equipment .quantity:nth-child(22n+2):not(.header),
		#other-equipment .desc:nth-child(22n+3):not(.header),
		#other-equipment .uses:nth-child(22n+4):not(.header),
		#other-equipment .tech-level:nth-child(22n+5):not(.header),
		#other-equipment .legality-class:nth-child(22n+6):not(.header),
		#other-equipment .value:nth-child(22n+7):not(.header),
		#other-equipment .weight:nth-child(22n+8):not(.header),
		#other-equipment .extended-value:nth-child(22n+9):not(.header),
		#other-equipment .extended-weight:nth-child(22n+10):not(.header),
		#other-equipment .reference:nth-child(22n+11):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#other-equipment .quantity:not(.header),
		#other-equipment .desc:not(.header),
		#other-equipment .uses:not(.header),
		#other-equipment .tech-level:not(.header),
		#other-equipment .legality-class:not(.header),
		#other-equipment .weight:not(.header),
		#other-equipment .value:not(.header),
		#other-equipment .extended-weight:not(.header),
		#other-equipment .extended-value:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#other-equipment .reference:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
		}

		#other-equipment :nth-last-child(-n+10) {
			border-bottom: none !important;
		}

		#notes {
			grid-area: notes;
			grid-template-columns: min-content 1fr auto;
		}

		#notes .header {
			grid-area: auto;
		}

		#notes .entry-parent:nth-child(8n+1):not(.header),
		#notes .desc:nth-child(8n+2):not(.header),
		#notes .reference:nth-child(8n+3):not(.header) {
			background-color: rgb(var(--color-banding));
			color: rgb(var(--color-on-banding));
		}

		#notes .desc:not(.header),
		#notes .refrence:not(.header) {
			border-bottom: 1px solid rgb(var(--color-header));
			border-right: 1px solid rgb(var(--color-header));
		}

		#notes :nth-last-child(-n+3) {
			border-bottom: none !important;
		}

		#embeds>div {
			display: grid;
			grid-template-rows: repeat(1000, auto) 1fr;
		}

		#embeds>div>.desc .item-notes {
			grid-area: notes;
		}

		#embeds>div> :not(.header):not(.entry-parent).quantity {
			min-width: 1em;
		}

		#embeds>div> :not(.header):not(.entry-parent).drop-over {
			border-top: 2px dashed rgb(var(--color-drop-area));
		}

		#embeds .desc.header {
			white-space: nowrap;
		}

		#embeds .equipped,
		#embeds .header.reference,
		#embeds .header.weight,
		#embeds .header.value,
		#embeds .header.extended-weight,
		#embeds .header.extended-value {
			display: grid;
			align-items: center;
			grid-auto-flow: column;
			gap: 1px;
		}

		#embeds .points:not(.header),
		#embeds .level:not(.header),
		#embeds .quantity:not(.header),
		#embeds .uses:not(.header),
		#embeds .tech-level:not(.header),
		#embeds .legality-class:not(.header),
		#embeds .weight:not(.header),
		#embeds .value:not(.header),
		#embeds .extended-weight:not(.header),
		#embeds .extended-value:not(.header) {
			text-align: right;
		}

		#embeds>div>.header:not(.entry-parent) {
			padding: var(--padding-header);
		}

		#embeds>div> :not(.header):not(svg) {
			background-color: rgb(var(--color-content));
			color: rgb(var(--color-on-content));
			font: var(--font-page-primary-fields);
		}

		#embeds>div> :not(.header):not(.entry-parent):not(.equipped) {
			padding: var(--padding-standard);
		}

		#embeds .item-notes {
			font: var(--font-page-secondary-fields);
			background-color: transparent;
		}

		div {
			background-color: rgb(var(--color-content));
		}

		#sheet>div {
			background-color: rgb(var(--color-page));
		}

		#personal>div:not(#attributes),
		#attributes>div,
		#stats>div:not(#attributes),
		#attributes>div,
		#embeds>div:not(#attributes),
		#attributes>div {
			border: var(--standard-border);
		}

		#footer {
			font: var(--font-page-secondary-footer);
			background-color: rgb(var(--color-page));
			color: rgb(var(--color-on-page));
			text-align: left;
			display: grid;
			grid-template-columns: repeat(3, 1fr);
		}

		#footer div {
			background-color: inherit;
		}

		#footer .centre {
			font: var(--font-page-primary-footer);
			text-align: center;
		}

		#footer .right {
			text-align: right;
		}

		#footer .right a {
			color: inherit;
			text-decoration: inherit;
		}
	</style>
{% endblock %}
{% block content %}
	<div id="outer-container">
	<div id="sheet">
		<div id="personal">
			<div id="portrait">
				<div class="header">Portrait</div>
				<div class="portrait"></div>
			</div>
			<div id="identity">
				<div class="header">Identity</div>
				<div class="fieldblock">
					<div class="label">Name</div>
					<div class="field">{{ character.details.profile.name }}</div>
					<div class="label">Title</div>
					<div class="field"></div>
					<div class="label">Organization</div>
					<div class="field"></div>
				</div>
			</div>
			<div id="miscellaneous">
				<div class="header">Miscellaneous</div>
				<div class="fieldblock">
					<div class="label">Created</div>
					<div class="field">{{ character.details.created_date }}</div>
					<div class="label">Modified</div>
					<div class="field">{{ character.details.modified_date }}</div>
					<div class="label">Player</div>
					<div class="field">{{ character.details.profile.player_name }}</div>
				</div>
			</div>
			<div id="description">
				<div class="header">Description</div>
				<div class="fieldblock">
					<div class="label">Gender</div>
					<div class="field">{{ character.details.profile.gender }}</div>
					<div class="label">Age</div>
					<div class="field">{{ character.details.profile.age }}</div>
					<div class="label">Birthday</div>
					<div class="field">{{ character.details.profile.birthday }}</div>
					<div class="label">Religion</div>
					<div class="field"></div>
				</div>
				<div class="fieldblock">
					<div class="label">Height</div>
					<div class="field">{{ character.details.profile.height }}</div>
					<div class="label">Weight</div>
					<div class="field">{{ character.details.profile.weight }}</div>
					<div class="label">Size</div>
					<div class="field">??</div>
					<div class="label">TL</div>
					<div class="field">{{ character.details.profile.tech_level }}</div>
				</div>
				<div class="fieldblock">
					<div class="label">Hair</div>
					<div class="field">{{ character.details.profile.hair }}</div>
					<div class="label">Eyes</div>
					<div class="field">{{ character.details.profile.eyes }}</div>
					<div class="label">Skin</div>
					<div class="field">{{ character.details.profile.skin }}</div>
					<div class="label">Hand</div>
					<div class="field">{{ character.details.profile.handedness }}</div>
				</div>
			</div>
			<div id="points">
				<div class="header">{{ character.details.total_points }} Points</div>
				<div class="fieldblock">
					<div class="field noedit">{{ character.unspent_points }}</div>
					<div class="label">Unspent</div>
					<div class="field noedit">{{ character.race_points }}</div>
					<div class="label">Race</div>
					<div class="field noedit">{{ character.attr_points }}</div>
					<div class="label">Attributes</div>
					<div class="field noedit">{{ character.attr_points }}</div>
					<div class="label">Advantages</div>
					<div class="field noedit">{{ character.disadv_points }}</div>
					<div class="label">Disadvantages</div>
					<div class="field noedit">{{ character.quirks_points }}</div>
					<div class="label">Quirks</div>
					<div class="field noedit">{{ character.skills_points }}</div>
					<div class="label">Skills</div>
					<div class="field noedit">{{ character.spells_points }}</div>
					<div class="label">Spells</div>
				</div>
			</div>
		</div>
		<div id="stats">
			<div id="attributes">
				<div id="primary-attributes">
					<div class="header">Primary Attributes</div>
					<div class="fieldblock3">
						
						<div class="points">[{{ character.st.points }}]</div>
						<div class="field">{{ character.st.value }}</div>
						<div class="label">Strength (ST)</div>
						
						<div class="points">[{{ character.dx.points }}]</div>
						<div class="field">{{ character.dx.value }}</div>
						<div class="label">Dexterity (DX)</div>
						
						<div class="points">[{{ character.iq.points }}]</div>
						<div class="field">{{ character.iq.value }}</div>
						<div class="label">Intelligence (IQ)</div>
						
						<div class="points">[{{ character.ht.points }}]</div>
						<div class="field">{{ character.ht.value }}</div>
						<div class="label">Health (HT)</div>
						
					</div>
				</div>
				<div id="basic-damage">
					<div class="header">Basic Damage</div>
					<div class="fieldblock3">
						<div class="points">[20]</div>
						<div class="field noedit">{{ character.details.calc.thrust }}</div>
						<div class="label">Basic Thrust</div>
						<div class="points">[20]</div>
						<div class="field noedit">{{ character.details.calc.swing  }}</div>
						<div class="label">Basic Swing</div>
					</div>
				</div>
				<div id="secondary-attributes">
					<div class="header">Secondary Attributes</div>
					<div class="fieldblock3">
						
						<div class="points">[{{ character.will.points }}]</div>
						<div class="field">{{ character.will.value }}</div>
						<div class="label">Will</div>
						
						<div class="points">[{{ character.fright_check.points }}]</div>
						<div class="field">{{ character.fright_check.value }}</div>
						<div class="label">Fright Check</div>
						
						<div class="points">[{{ character.per.points }}]</div>
						<div class="field">{{ character.per.value }}</div>
						<div class="label">Perception (Per)</div>
						
						<div class="points">[{{ character.vision.points }}]</div>
						<div class="field">{{ character.vision.value }}</div>
						<div class="label">Vision</div>
						
						<div class="points">[{{ character.hearing.points }}]</div>
						<div class="field">{{ character.hearing.value }}</div>
						<div class="label">Hearing</div>
						
						<div class="points">[{{ character.taste_smell.points }}]</div>
						<div class="field">{{ character.taste_smell.value }}</div>
						<div class="label">Taste &amp; Smell</div>
						
						<div class="points">[{{ character.touch.points }}]</div>
						<div class="field">{{ character.touch.value }}</div>
						<div class="label">Touch</div>
						
						<div class="points">[{{ character.basic_speed.points }}]</div>
						<div class="field">{{ character.basic_speed.value }}</div>
						<div class="label">Basic Speed</div>
						
						<div class="points">[{{ character.basic_move.points }}]</div>
						<div class="field">{{ character.basic_move.value }}</div>
						<div class="label">Basic Move</div>
						
					</div>
				</div>
				<div id="pool-attributes">
					<div class="header">Point Pools</div>
					<div class="fieldblock5">
						
						<div class="points">[{{ character.fp.points }}]</div>
						<div class="field">{{ character.fp.current }}</div>
						<div class="label">of</div>
						<div class="field">{{ character.fp.value }}</div>
						<div class="label">Fatigue Points (FP)</div>
						
						<div class="points">[{{ character.hp.points }}]</div>
						<div class="field">{{ character.hp.current }}</div>
						<div class="label">of</div>
						<div class="field">{{ character.hp.value }}</div>
						<div class="label">Hit Points (HP)</div>
						
					</div>
				</div>
			</div>
			<div id="hit-locations">
				<div class="header body-plan">Hit Locations</div>
				<div class="header entry-parent" readonly></div>
				<div class="header roll">Roll</div>
				<div class="header location">Location</div>
				<div class="header dr">DR</div>
				
				<!-- for location in character.details.settings.hit_locations.locations -->
				{% for location in character.hit_locations %}
				<div class="entry-parent" readonly></div>
				<div class="roll">{{ location.calc.roll_range }}</div>
				<div class="location">{{ location.table_name }}</div>
				<div class="penalty">{{ location.hit_penalty }}</div>
				<div class="dr">{{ location.calc.dr.all }}</div>
				{% endfor %}
				
			</div>
			<div id="encumbrance-lifting">
				<div id="encumbrance">
					<div class="header title">Encumbrance, Move &amp; Dodge</div>
					<div class="header level">Level</div>
					<div class="header max-load">Max Load</div>
					<div class="header move">Move</div>
					<div class="header dodge">Dodge</div>

					{% for enc_level in character.enc_levels %}
					<div class="encumbrance-marker {{ enc_level.current }}">
						<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
							<path class="current"
								d="m510.3 445.9-73-292.1c-3.8-15.3-16.5-25.8-30.9-25.8h-60.3c3.625-9.1 5.875-20.75 5.875-32 0-53-42.1-96-96-96S159.1 43 159.1 96c0 11.25 2.25 22 5.875 32H105.6c-14.38 0-27.13 10.5-30.88 25.75L1.71 445.85C-6.641 479.1 16.36 512 47.99 512h416c31.61 0 54.61-32.9 46.31-66.1zM256 128c-17.6 0-32.9-14.4-32.9-32s15.3-32 32.9-32c17.63 0 32 14.38 32 32s-14.4 32-32 32z">
							</path>
						</svg>
					</div>
					<div class="level-number {{ enc_level.current }} enc{{ forloop.counter0 }}"></div>
					<div class="level {{ enc_level.current }} enc{{ forloop.counter0 }}"></div>
					<div class="max-load {{ enc_level.current }}">{{enc_level.max_load }} {{character.weight_unit }}</div>
					<div class="move {{ enc_level.current }}">{{ enc_level.move }}</div>
					<div class="dodge {{ enc_level.current }}">{{ enc_level.dodge }}</div>
					{% endfor %}
					
				</div>
				<div id="lifting">
					<div class="header">Lifting &amp; Moving Things</div>
					{% for lift in character.lift_table %}
					<div class="lift">{{ lift.value }} {{ character.weight_unit }}</div>
					<div class="label">{{ lift.label }}</div>
					{% endfor %}
				</div>
			</div>
		</div>
		<div id="embeds">
			<div id="reactions">
				<div class="entry-parent header" readonly></div>
				<div class="modifier header">&#177;</div>
				<div class="situation header">Reaction</div>
				
				{% for r in character.reaction_modifiers %}
				<div class="entry-parent" readonly></div>
				<div class="modifier">{{ r.amount }}</div>
				<div class="situation">{{ r.situation }}</div>
				{% endfor %}
				
			</div>
			<div id="conditional-modifiers">
				<div class="entry-parent header" readonly></div>
				<div class="modifier header">&#177;</div>
				<div class="situation header">Condition</div>

				{% for r in character.conditional_modifiers %}
				<div class="entry-parent" readonly></div>
				<div class="modifier">{{ r.amount }}</div>
				<div class="situation">{{ r.situation }}</div>
				{% endfor %}
				
			</div>
			<div id="melee">
				<div class="header entry-parent" readonly></div>
				<div class="header desc">Melee Weapon</div>
				<div class="header usage">Usage</div>
				<div class="header level">SL</div>
				<div class="header parry">Parry</div>
				<div class="header block">Block</div>
				<div class="header damage">Damage</div>
				<div class="header reach">Reach</div>
				<div class="header st">ST</div>

				{% for w in character.melee_weapons %}
				<div class="entry-parent" readonly></div>
				<div class="desc">
					{{ w.name }}
					<div class="item-notes">
						
					</div>
				</div>
				<div class="usage">{{ w.usage }}</div> 
				<div class="level">{{ w.skill_level }}</div>
				<div class="parry">{{ w.parry }}</div>
				<div class="block">{{ w.block }}</div>
				<div class="damage">{{ w.damage }} cut</div>
				<div class="reach">{{ w.reach }}*</div>
				<div class="st">{{ w.strength }}</div>
				
				{% endfor %}
			</div>
			<div id="ranged">
				<div class="header entry-parent" readonly></div>
				<div class="header desc">Ranged Weapon</div>
				<div class="header usage">Usage</div>
				<div class="header level">SL</div>
				<div class="header acc">Acc</div>
				<div class="header range">Range</div>
				<div class="header damage">Damage</div>
				<div class="header rof">RoF</div>
				<div class="header shots">Shots</div>
				<div class="header bulk">Bulk</div>
				<div class="header recoil">Recoil</div>
				<div class="header st">ST</div>
				
				{% for w in character.ranged_weapons %}
				<div class="entry-parent" readonly></div>
				<div class="desc">
					{{ w.name }}
					<div class="item-notes">
						
					</div>
				</div>
				<div class="usage">Thrown</div>
				<div class="level">{{ w.skill_level }}</div>
				<div class="acc">{{ w.acc }}</div>
				<div class="range">{{ w.range }}</div>
				<div class="damage">{{ w.damage }}</div>
				<div class="rof">{{ w.rof }}</div>
				<div class="shots">{{ w.shots }}</div>
				<div class="bulk">{{ w.bulk }}</div>
				<div class="recoil">{{ w.recoil }}</div>
				<div class="st">{{ w.strength }}</div>
				{% endfor %}
			</div>
			<div id="traits">
				<div class="header entry-parent" readonly></div>
				<div class="header desc">Trait</div>
				<div class="header points">Pts</div>
				<div class="header reference">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path d="M384 48v464L192 400 0 512V48C0 21.5 21.5 0 48 0h288c26.5 0 48 21.5 48 48z"></path>
					</svg>
				</div>
				
				{% for trait in character.traits %}
				<div class="entry-parent" readonly></div>
				<div class="desc" style="padding-left: calc(0 * 1px + 4px)">
					{{ trait.name }}
					<div class="item-notes">
						
						{{ trait.notes }}
					</div>
				</div>
				<div class="points">{{ trait.points }}</div>
				<div class="reference">{{ trait.reference }}</div>
				
				{% endfor %}
			</div>
			<div id="skills">
				<div class="header entry-parent" readonly></div>
				<div class="header desc">Skill / Technique</div>
				<div class="header level">SL</div>
				<div class="header rsl">RSL</div>
				<div class="header points">Pts</div>
				<div class="header reference">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path d="M384 48v464L192 400 0 512V48C0 21.5 21.5 0 48 0h288c26.5 0 48 21.5 48 48z"></path>
					</svg>
				</div>

				{% for skill in character.skills %}
				<div class="entry-parent" readonly></div>
				<div class="desc" style="padding-left: calc(0 * 1px + 4px)">
					{{ skill.name }}
					<div class="item-notes">
						
						
					</div>
				</div>
				<div class="level">{{ skill.level }}</div>
				<div class="rsl">{{ skill.rsl }}</div>
				<div class="points">{{ skill.points }}</div>
				<div class="reference">{{ skill.reference }}</div>
				
				{% endfor %}
				
			</div>
			<div id="spells">
				<div class="header entry-parent" readonly></div>
				<div class="header desc">Spell</div>
				<div class="header college">College</div>
				<div class="header level">SL</div>
				<div class="header rsl">RSL</div>
				<div class="header points">Pts</div>
				<div class="header reference">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path d="M384 48v464L192 400 0 512V48C0 21.5 21.5 0 48 0h288c26.5 0 48 21.5 48 48z"></path>
					</svg>
				</div>

			       {% for spell in character.spells %}
                               <div class="entry-parent" readonly></div>
                               <div class="desc" style="padding-left: calc(20px * 0 + 4px)">
				       {{ spell.name }}
                                        <div class="item-notes">
						{{ spell.notes | safe }}
                                        </div>
                                </div>
				<div class="college">{{ spell.college }}</div>
				<div class="level">{{ spell.level }}</div>
				<div class="rsl">{{ spell.rsl }}</div>
				<div class="points">{{ spell.points }}</div>
				<div class="reference">{{ spell.reference }}</div>
				{% endfor %}

				
			</div>
			<div id="equipment">
				<div class="header entry-parent" readonly></div>
				<div class="header equipped">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M 492.1883,51.561176 447.69973,21.315702 C 435.38472,12.98066 418.51958,16.176634 410.28207,28.39411 L 192.1793,350.02095 91.94873,249.79038 c -10.469445,-10.46569 -27.533399,-10.46569 -37.999091,0 L 15.849269,287.887 c -10.4656924,10.46569 -10.4656924,27.52965 0,38.09662 L 169.97628,480.10687 c 8.62763,8.62763 22.19551,15.22215 34.40924,15.22215 12.21748,0 24.52498,-7.65984 32.47365,-19.19461 L 499.36048,88.881308 c 8.33505,-12.213725 5.13907,-28.98509 -7.17594,-37.323883 z">
						</path>
					</svg>
				</div>
				<div class="header quantity">#</div>
				<div class="header desc">Carried Equipment (18.75 lb; $485)</div>
				<div class="header uses">Uses</div>
				<div class="header tech-level">TL</div>
				<div class="header legality-class">LC</div>
				<div class="header value">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M512 80c0 18.01-14.3 34.6-38.4 48-29.1 16.1-72.4 27.5-122.3 30.9-3.6-1.7-7.4-3.4-11.2-5C300.6 137.4 248.2 128 192 128c-8.3 0-16.4.2-24.5.6l-1.1-.6C142.3 114.6 128 98.01 128 80c0-44.18 85.1-80 192-80 106 0 192 35.82 192 80zm-351.3 81.1c10.2-.7 20.6-1.1 31.3-1.1 62.2 0 117.4 12.3 152.5 31.4 24.8 13.5 39.5 30.3 39.5 48.6 0 3.1-.7 7.9-2.1 11.7-4.6 13.2-17.8 25.3-35 35.6-.1 0-.3.1-.4.2-.3.2-.6.3-.9.5-35 19.4-90.8 32-153.6 32-59.6 0-112.94-11.3-148.16-29.1-1.87-1-3.69-2.8-5.45-2.9C14.28 274.6 0 258 0 240c0-34.8 53.43-64.5 128-75.4 10.5-1.6 21.4-2.8 32.7-3.5zm231.2 25.5c28.3-4.4 54.2-11.4 76.2-20.5 16.3-6.8 31.4-15.2 43.9-25.5V176c0 19.3-16.5 37.1-43.8 50.9-14.7 7.4-32.4 13.6-52.4 18.4.1-1.7.2-3.5.2-5.3 0-21.9-10.6-39.9-24.1-53.4zM384 336c0 18-14.3 34.6-38.4 48-1.8.1-3.6 1.9-5.4 2.9C304.9 404.7 251.6 416 192 416c-62.8 0-118.58-12.6-153.61-32C14.28 370.6 0 354 0 336v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 342.6 135.8 352 192 352c56.2 0 108.6-9.4 148.1-25.9 7.8-3.2 15.3-6.9 22.4-10.9 6.1-3.4 11.8-7.2 17.2-11.2 1.5-1.1 2.9-2.3 4.3-3.4V336zm32-57.9c18.1-5 36.5-9.5 52.1-16 16.3-6.8 31.4-15.2 43.9-25.5V272c0 10.5-5 21-14.9 30.9-16.3 16.3-45 29.7-81.3 38.4.1-1.7.2-3.5.2-5.3v-57.9zM192 448c56.2 0 108.6-9.4 148.1-25.9 16.3-6.8 31.4-15.2 43.9-25.5V432c0 44.2-86 80-192 80C85.96 512 0 476.2 0 432v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 438.6 135.8 448 192 448z">
						</path>
					</svg>
				</div>
				<div class="header weight">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="m510.3 445.9-73-292.1c-3.8-15.3-16.5-25.8-30.9-25.8h-60.3c3.625-9.1 5.875-20.75 5.875-32 0-53-42.1-96-96-96S159.1 43 159.1 96c0 11.25 2.25 22 5.875 32H105.6c-14.38 0-27.13 10.5-30.88 25.75L1.71 445.85C-6.641 479.1 16.36 512 47.99 512h416c31.61 0 54.61-32.9 46.31-66.1zM256 128c-17.6 0-32.9-14.4-32.9-32s15.3-32 32.9-32c17.63 0 32 14.38 32 32s-14.4 32-32 32z">
						</path>
					</svg>
				</div>
				<div class="header extended-value">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M232.5 5.171a56.026 56.026 0 0 1 47 0L498.1 106.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 145.8 0 137.3 0 127.1c0-8.5 5.437-17 13.93-20.9L232.5 5.171zM498.1 234.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 273.8 0 265.3 0 255.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0l152-70.2 53.2 24.6zM292.9 407.8l152-70.2 53.2 24.6c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 401.8 0 393.3 0 383.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0z">
						</path>
					</svg>
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M512 80c0 18.01-14.3 34.6-38.4 48-29.1 16.1-72.4 27.5-122.3 30.9-3.6-1.7-7.4-3.4-11.2-5C300.6 137.4 248.2 128 192 128c-8.3 0-16.4.2-24.5.6l-1.1-.6C142.3 114.6 128 98.01 128 80c0-44.18 85.1-80 192-80 106 0 192 35.82 192 80zm-351.3 81.1c10.2-.7 20.6-1.1 31.3-1.1 62.2 0 117.4 12.3 152.5 31.4 24.8 13.5 39.5 30.3 39.5 48.6 0 3.1-.7 7.9-2.1 11.7-4.6 13.2-17.8 25.3-35 35.6-.1 0-.3.1-.4.2-.3.2-.6.3-.9.5-35 19.4-90.8 32-153.6 32-59.6 0-112.94-11.3-148.16-29.1-1.87-1-3.69-2.8-5.45-2.9C14.28 274.6 0 258 0 240c0-34.8 53.43-64.5 128-75.4 10.5-1.6 21.4-2.8 32.7-3.5zm231.2 25.5c28.3-4.4 54.2-11.4 76.2-20.5 16.3-6.8 31.4-15.2 43.9-25.5V176c0 19.3-16.5 37.1-43.8 50.9-14.7 7.4-32.4 13.6-52.4 18.4.1-1.7.2-3.5.2-5.3 0-21.9-10.6-39.9-24.1-53.4zM384 336c0 18-14.3 34.6-38.4 48-1.8.1-3.6 1.9-5.4 2.9C304.9 404.7 251.6 416 192 416c-62.8 0-118.58-12.6-153.61-32C14.28 370.6 0 354 0 336v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 342.6 135.8 352 192 352c56.2 0 108.6-9.4 148.1-25.9 7.8-3.2 15.3-6.9 22.4-10.9 6.1-3.4 11.8-7.2 17.2-11.2 1.5-1.1 2.9-2.3 4.3-3.4V336zm32-57.9c18.1-5 36.5-9.5 52.1-16 16.3-6.8 31.4-15.2 43.9-25.5V272c0 10.5-5 21-14.9 30.9-16.3 16.3-45 29.7-81.3 38.4.1-1.7.2-3.5.2-5.3v-57.9zM192 448c56.2 0 108.6-9.4 148.1-25.9 16.3-6.8 31.4-15.2 43.9-25.5V432c0 44.2-86 80-192 80C85.96 512 0 476.2 0 432v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 438.6 135.8 448 192 448z">
						</path>
					</svg>
				</div>
				<div class="header extended-weight">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M232.5 5.171a56.026 56.026 0 0 1 47 0L498.1 106.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 145.8 0 137.3 0 127.1c0-8.5 5.437-17 13.93-20.9L232.5 5.171zM498.1 234.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 273.8 0 265.3 0 255.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0l152-70.2 53.2 24.6zM292.9 407.8l152-70.2 53.2 24.6c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 401.8 0 393.3 0 383.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0z">
						</path>
					</svg>
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="m510.3 445.9-73-292.1c-3.8-15.3-16.5-25.8-30.9-25.8h-60.3c3.625-9.1 5.875-20.75 5.875-32 0-53-42.1-96-96-96S159.1 43 159.1 96c0 11.25 2.25 22 5.875 32H105.6c-14.38 0-27.13 10.5-30.88 25.75L1.71 445.85C-6.641 479.1 16.36 512 47.99 512h416c31.61 0 54.61-32.9 46.31-66.1zM256 128c-17.6 0-32.9-14.4-32.9-32s15.3-32 32.9-32c17.63 0 32 14.38 32 32s-14.4 32-32 32z">
						</path>
					</svg>
				</div>
				<div class="header reference">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path d="M384 48v464L192 400 0 512V48C0 21.5 21.5 0 48 0h288c26.5 0 48 21.5 48 48z"></path>
					</svg>
				</div>
				
				{% for item in character.equipment %}
				<!-- {{ item }} -->
				<div class="entry-parent" readonly></div>
				<div class="equipped">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path class="shape-equipped-1"
							d="M 492.1883,51.561176 447.69973,21.315702 C 435.38472,12.98066 418.51958,16.176634 410.28207,28.39411 L 192.1793,350.02095 91.94873,249.79038 c -10.469445,-10.46569 -27.533399,-10.46569 -37.999091,0 L 15.849269,287.887 c -10.4656924,10.46569 -10.4656924,27.52965 0,38.09662 L 169.97628,480.10687 c 8.62763,8.62763 22.19551,15.22215 34.40924,15.22215 12.21748,0 24.52498,-7.65984 32.47365,-19.19461 L 499.36048,88.881308 c 8.33505,-12.213725 5.13907,-28.98509 -7.17594,-37.323883 z">
						</path>
					</svg>
				</div>
				<div class="quantity">{{ item.quantity }}</div>
				<div class="desc" style="padding-left: calc(20px * {{ item.level }} + 4px)">
					{{ item.name }}
					<div class="item-notes">
						
					{{ item.notes }}
					</div>
				</div>
				<div class="uses max0">0</div>
				<div class="tech-level"> {{ item.tech_level }}</div>
				<div class="legality-class "></div>
				<div class="value">{{ item.value }}</div>
				<div class="weight">{{ item.weight }}</div>
				<div class="extended-value">{{ item.ext_value }}</div>
				<div class="extended-weight">{{ item.ext_weight}}</div>
				<div class="reference">{{ item.ref }}</div>
				
				{% endfor %}

			</div>
			<div id="other-equipment">
				<div class="header entry-parent" readonly></div>
				<div class="header quantity">#</div>
				<div class="header desc">Other Equipment ($0)</div>
				<div class="header uses">Uses</div>
				<div class="header tech-level">TL</div>
				<div class="header legality-class">LC</div>
				<div class="header value">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M512 80c0 18.01-14.3 34.6-38.4 48-29.1 16.1-72.4 27.5-122.3 30.9-3.6-1.7-7.4-3.4-11.2-5C300.6 137.4 248.2 128 192 128c-8.3 0-16.4.2-24.5.6l-1.1-.6C142.3 114.6 128 98.01 128 80c0-44.18 85.1-80 192-80 106 0 192 35.82 192 80zm-351.3 81.1c10.2-.7 20.6-1.1 31.3-1.1 62.2 0 117.4 12.3 152.5 31.4 24.8 13.5 39.5 30.3 39.5 48.6 0 3.1-.7 7.9-2.1 11.7-4.6 13.2-17.8 25.3-35 35.6-.1 0-.3.1-.4.2-.3.2-.6.3-.9.5-35 19.4-90.8 32-153.6 32-59.6 0-112.94-11.3-148.16-29.1-1.87-1-3.69-2.8-5.45-2.9C14.28 274.6 0 258 0 240c0-34.8 53.43-64.5 128-75.4 10.5-1.6 21.4-2.8 32.7-3.5zm231.2 25.5c28.3-4.4 54.2-11.4 76.2-20.5 16.3-6.8 31.4-15.2 43.9-25.5V176c0 19.3-16.5 37.1-43.8 50.9-14.7 7.4-32.4 13.6-52.4 18.4.1-1.7.2-3.5.2-5.3 0-21.9-10.6-39.9-24.1-53.4zM384 336c0 18-14.3 34.6-38.4 48-1.8.1-3.6 1.9-5.4 2.9C304.9 404.7 251.6 416 192 416c-62.8 0-118.58-12.6-153.61-32C14.28 370.6 0 354 0 336v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 342.6 135.8 352 192 352c56.2 0 108.6-9.4 148.1-25.9 7.8-3.2 15.3-6.9 22.4-10.9 6.1-3.4 11.8-7.2 17.2-11.2 1.5-1.1 2.9-2.3 4.3-3.4V336zm32-57.9c18.1-5 36.5-9.5 52.1-16 16.3-6.8 31.4-15.2 43.9-25.5V272c0 10.5-5 21-14.9 30.9-16.3 16.3-45 29.7-81.3 38.4.1-1.7.2-3.5.2-5.3v-57.9zM192 448c56.2 0 108.6-9.4 148.1-25.9 16.3-6.8 31.4-15.2 43.9-25.5V432c0 44.2-86 80-192 80C85.96 512 0 476.2 0 432v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 438.6 135.8 448 192 448z">
						</path>
					</svg>
				</div>
				<div class="header weight">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="m510.3 445.9-73-292.1c-3.8-15.3-16.5-25.8-30.9-25.8h-60.3c3.625-9.1 5.875-20.75 5.875-32 0-53-42.1-96-96-96S159.1 43 159.1 96c0 11.25 2.25 22 5.875 32H105.6c-14.38 0-27.13 10.5-30.88 25.75L1.71 445.85C-6.641 479.1 16.36 512 47.99 512h416c31.61 0 54.61-32.9 46.31-66.1zM256 128c-17.6 0-32.9-14.4-32.9-32s15.3-32 32.9-32c17.63 0 32 14.38 32 32s-14.4 32-32 32z">
						</path>
					</svg>
				</div>
				<div class="header extended-value">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M232.5 5.171a56.026 56.026 0 0 1 47 0L498.1 106.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 145.8 0 137.3 0 127.1c0-8.5 5.437-17 13.93-20.9L232.5 5.171zM498.1 234.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 273.8 0 265.3 0 255.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0l152-70.2 53.2 24.6zM292.9 407.8l152-70.2 53.2 24.6c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 401.8 0 393.3 0 383.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0z">
						</path>
					</svg>
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M512 80c0 18.01-14.3 34.6-38.4 48-29.1 16.1-72.4 27.5-122.3 30.9-3.6-1.7-7.4-3.4-11.2-5C300.6 137.4 248.2 128 192 128c-8.3 0-16.4.2-24.5.6l-1.1-.6C142.3 114.6 128 98.01 128 80c0-44.18 85.1-80 192-80 106 0 192 35.82 192 80zm-351.3 81.1c10.2-.7 20.6-1.1 31.3-1.1 62.2 0 117.4 12.3 152.5 31.4 24.8 13.5 39.5 30.3 39.5 48.6 0 3.1-.7 7.9-2.1 11.7-4.6 13.2-17.8 25.3-35 35.6-.1 0-.3.1-.4.2-.3.2-.6.3-.9.5-35 19.4-90.8 32-153.6 32-59.6 0-112.94-11.3-148.16-29.1-1.87-1-3.69-2.8-5.45-2.9C14.28 274.6 0 258 0 240c0-34.8 53.43-64.5 128-75.4 10.5-1.6 21.4-2.8 32.7-3.5zm231.2 25.5c28.3-4.4 54.2-11.4 76.2-20.5 16.3-6.8 31.4-15.2 43.9-25.5V176c0 19.3-16.5 37.1-43.8 50.9-14.7 7.4-32.4 13.6-52.4 18.4.1-1.7.2-3.5.2-5.3 0-21.9-10.6-39.9-24.1-53.4zM384 336c0 18-14.3 34.6-38.4 48-1.8.1-3.6 1.9-5.4 2.9C304.9 404.7 251.6 416 192 416c-62.8 0-118.58-12.6-153.61-32C14.28 370.6 0 354 0 336v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 342.6 135.8 352 192 352c56.2 0 108.6-9.4 148.1-25.9 7.8-3.2 15.3-6.9 22.4-10.9 6.1-3.4 11.8-7.2 17.2-11.2 1.5-1.1 2.9-2.3 4.3-3.4V336zm32-57.9c18.1-5 36.5-9.5 52.1-16 16.3-6.8 31.4-15.2 43.9-25.5V272c0 10.5-5 21-14.9 30.9-16.3 16.3-45 29.7-81.3 38.4.1-1.7.2-3.5.2-5.3v-57.9zM192 448c56.2 0 108.6-9.4 148.1-25.9 16.3-6.8 31.4-15.2 43.9-25.5V432c0 44.2-86 80-192 80C85.96 512 0 476.2 0 432v-35.4c12.45 10.3 27.62 18.7 43.93 25.5C83.44 438.6 135.8 448 192 448z">
						</path>
					</svg>
				</div>
				<div class="header extended-weight">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="M232.5 5.171a56.026 56.026 0 0 1 47 0L498.1 106.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 145.8 0 137.3 0 127.1c0-8.5 5.437-17 13.93-20.9L232.5 5.171zM498.1 234.2c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 273.8 0 265.3 0 255.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0l152-70.2 53.2 24.6zM292.9 407.8l152-70.2 53.2 24.6c8.5 3.9 13.9 12.4 13.9 20.9 0 10.2-5.4 18.7-13.9 22.7l-218.6 101c-14.9 6.9-32.1 6.9-47 0l-218.57-101C5.438 401.8 0 393.3 0 383.1c0-8.5 5.437-17 13.93-20.9l53.2-24.6 151.97 70.2c23.4 10.9 50.4 10.9 73.8 0z">
						</path>
					</svg>
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path
							d="m510.3 445.9-73-292.1c-3.8-15.3-16.5-25.8-30.9-25.8h-60.3c3.625-9.1 5.875-20.75 5.875-32 0-53-42.1-96-96-96S159.1 43 159.1 96c0 11.25 2.25 22 5.875 32H105.6c-14.38 0-27.13 10.5-30.88 25.75L1.71 445.85C-6.641 479.1 16.36 512 47.99 512h416c31.61 0 54.61-32.9 46.31-66.1zM256 128c-17.6 0-32.9-14.4-32.9-32s15.3-32 32.9-32c17.63 0 32 14.38 32 32s-14.4 32-32 32z">
						</path>
					</svg>
				</div>
				<div class="header reference">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path d="M384 48v464L192 400 0 512V48C0 21.5 21.5 0 48 0h288c26.5 0 48 21.5 48 48z"></path>
					</svg>
				</div>
				
			</div>
			<div id="notes">
				<div class="header entry-parent" readonly></div>
				<div class="header desc">Note</div>
				<div class="header reference">
					<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
						<path d="M384 48v464L192 400 0 512V48C0 21.5 21.5 0 48 0h288c26.5 0 48 21.5 48 48z"></path>
					</svg>
				</div>
				
			</div>
		</div>
		<div id="footer">
			<div class="left">GCS is copyrighted &copy;1998-2022 by Richard A. Wilkes. All rights reserved</div>
			<div class="centre">{{ character.name }}</div>
			<div class="right"><a href="https://gurpscharactersheet.com/">gurpscharactersheet.com</a></div>
		</div>
	</div>
	</div>
{% endblock %}