﻿@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lora:ital,wght@0,400..700;1,400..700&family=Roboto:ital,wdth,wght@0,75..100,100..900;1,75..100,100..900&display=swap');
@font-face{font-family:Anthropic Sans; src:url(https://assets-proxy.anthropic.com/claude-ai/v2/assets/v1/cc27851ad-CFxw3nG7.woff2) format("woff2");font-weight:300 800;font-style:normal;font-display:swap;font-feature-settings:"dlig" 0}
@font-face{font-family:Anthropic Sans; src:url(https://assets-proxy.anthropic.com/claude-ai/v2/assets/v1/c9d3a3a49-BI1hrwN4.woff2) format("woff2");font-weight:300 800;font-style:italic;font-display:swap;font-feature-settings:"dlig" 0}
@font-face{font-family:Anthropic Serif;src:url(https://assets-proxy.anthropic.com/claude-ai/v2/assets/v1/c66fc489e-C-BHYa_K.woff2) format("woff2");font-weight:300 800;font-style:normal;font-display:swap}
@font-face{font-family:Anthropic Serif;src:url(https://assets-proxy.anthropic.com/claude-ai/v2/assets/v1/cc410af59-DH94ugQz.woff2) format("woff2");font-weight:300 800;font-style:italic;font-display:swap}
@font-face{font-family:Anthropic Mono; src:url(https://assets-proxy.anthropic.com/claude-ai/v2/assets/v1/c5dbe0935-B88FVziN.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Anthropic Mono; src:url(https://assets-proxy.anthropic.com/claude-ai/v2/assets/v1/c2f08283e-DHGc3er-.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}

:root
{
	--background-color: #f8f5f0;
	--background-color-dark:color-mix(in srgb, var(--background-color), black 2.5%);
	--border-radius:10px;
	--border-color:#ddd8d0;
	--border-color-dark:color-mix(in srgb, var(--border-color), black 50%);
	--box-shadow: 0 1px 3px rgba(0, 0, 0, .07), 0 4px 16px rgba(0, 0, 0, .05);
	--box-shadow-hover:0 8px 32px rgba(0, 0, 0, .12);
	
	--textClr: #0f0f0f;
	--grayTextClr:#999;
	--padding: 15px;
	--red:#c84b2f;
	--green:#2d7a4f;
}
* {font-family:Roboto;box-sizing: border-box;}
body {margin:0;background-color:var(--background-color);font-size:14px;color:var(--textClr);line-height:135%;}
a {color:#1a73e8;text-decoration:none}
a:hover {text-decoration:underline}
h1 {margin:0;margin-bottom:20px;font-size:30px;line-height:110%;}
h2 {margin:0;margin-bottom:10px;font-size:20px;line-height:110%;}
h3 {margin:0;margin-bottom:5px ;font-size:16px;line-height:110%;}
ul {padding: 0;margin: 0 0 0 17px;}
li {margin-top:5px;}
li:first-child {margin-top:0;}
hr {background-color:black;border:none;height:1px}
p {margin:0;padding:0;}
label {color:#AAA;font-size:12px;display:block;padding-bottom:3px}
input[type=text],textarea {display:block;width:100%;margin:0;padding:10px;font-family:inherit;font-size:inherit;border:1px solid var(--border-color);border-radius:5px;outline:none;}
input[type=text]:focus,textarea:focus {border-color:var(--border-color-dark);}
input::placeholder,textarea::placeholder {font-family:inherit;font-size:inherit;color:#C5C5C5;}

label>input.toggle[type=radio]             {display:none;}
label:has(>input[type=radio].toggle)       {color:var(--textClr);font-size:12px;cursor:pointer;padding:3px 12px;border:1px solid var(--border-color);border-radius:var(--border-radius);}
label:has(>input[type=radio].toggle:hover)       {border-color:#0f0f0f;}
label:has(input[type=radio].toggle:checked){color:white;background:#0f0f0f;border-color:#0f0f0f;}

#header a {color:var(--text);}
#header a:hover {text-decoration:none;}
#header > div>a>span {color:#A32D2D;}
#header > div > div:nth-child(1) > div > a > span {font-family:Lora;}
#header > div > div:nth-child(1) > div > a {font-size:26px;color:var(--red);}
#header > div > div:nth-child(2) {display:flex;gap:2px 15px;font-size:10px;line-height:100%;letter-spacing: 0.2px;}
#header > div > div:nth-child(1) > div > a > span:nth-child(1) {color:#E24B4A;font-weight:500;line-height:100%;}
#header > div > div:nth-child(1) > div > a > span:nth-child(2) {color:#791F1F;font-weight:500;line-height:100%;}


.w400 {max-width:400px;margin:auto;}
.w500 {max-width:500px;margin:auto;}
.w600 {max-width:600px;margin:auto;}

.sml {color:#DDD;font-size:12px;}

.tag {display:flex;gap:3px;align-items:center;background-color:#f0ebe3;border-radius:10px;padding:3px 10px;text-decoration:none;color:#3d3d3d;font-size:11px;}
.tag:hover {background-color:#E0E0E0;text-decoration:none}
.tag>* {line-height:100%}
.tag.blue {color:#3a5399;background-color:#e8edf7;border-color:#e8edf7}

.ctr {text-align:center;}
.tbl    {border-collapse:collapse;}
.tbl th {background-color:#F5F5F5;border:1px solid #E0E0E0;}
.tbl th {padding:10px 15px; font-weight:bold;}
.tbl td {padding:10px 15px; border:1px solid #DDD;}
.tbl th:first-child,
.tbl td:first-child {}
.tbl th:last-child {}
.tbl td:last-child {}
.tbl > tbody > tr:hover {background-color:#F4F4F4;}
.button, .button:link, .button:active, .button:visited
{
	display:inline-block;
	text-align:center;
  padding:6px 20px;
 	text-decoration:none; 
	border-style:none;
	border-radius:20px;
	background-color:var(--red);
	transition:background-color 0.25s;
	color:white;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.button:hover
{
	background-color: color-mix(in srgb, var(--red), black 30%);
}
.button.sml {font-size:11px;padding:3px 10px;}
.box {padding:var(--padding);border-radius:var(--border-radius);border:1px solid var(--border-color);background-color:white;box-shadow: var(--box-shadow);}
.box:hover {box-shadow: var(--box-shadow-hover);}

.brd {padding:var(--padding);border-radius:var(--border-radius);border:1px solid var(--border-color);}

@media(max-width:600px)
{
	#header > div > div:nth-child(2) {display:none;}
}


