:root{--ct-ink: #1d2420;--ct-muted: #56625b;--ct-surface: #ffffff;--ct-paper: #faf6ee;--ct-line: #dfe3dc;--ct-pine: #1f4d3a;--ct-pine-dark: #163a2b;--ct-pine-soft: #e5efe8;--ct-berry: #a3283b;--ct-berry-soft: #fbe9ec;--ct-gold: #c9962b;--ct-gold-soft: #fbf1db;--ct-radius: 10px;--ct-shadow: 0 10px 28px rgba(29,36,32,0.08);--ct-focus: 0 0 0 3px rgba(31,77,58,0.28);--ct-serif: Georgia,"Iowan Old Style","Times New Roman",serif;--primary: var(--ct-pine);--primary-dark: var(--ct-pine-dark);--border: var(--ct-line);--surface: var(--ct-surface);--shadow-soft: var(--ct-shadow);--surface-muted: var(--ct-paper);--text-main: var(--ct-ink);--text-muted: var(--ct-muted);}
.ct-wrap [hidden]{display: none !important;}
.ct-tool{background: var(--ct-surface);border: 1px solid var(--ct-line);border-radius: var(--ct-radius);box-shadow: var(--ct-shadow);padding: 20px;margin-bottom: 40px;color: var(--ct-ink);}
.ct-byline{display: flex;flex-wrap: wrap;justify-content: space-between;gap: 4px 16px;font-size: 0.85rem;color: var(--ct-muted);padding-bottom: 12px;margin-bottom: 18px;border-bottom: 1px dashed var(--ct-line);}
.ct-byline a{color: var(--ct-pine);}
.ct-grid{display: grid;grid-template-columns: minmax(0, 1fr);gap: 22px;}
.ct-form{display: grid;gap: 18px;}
.ct-step{border: 0;margin: 0;padding: 0;min-width: 0;}
.ct-step legend{display: flex;align-items: center;gap: 10px;font-family: var(--ct-serif);font-size: 1.08rem;font-weight: 700;color: var(--ct-pine-dark);margin-bottom: 10px;padding: 0;float: none;width: auto;}
.ct-step-no{display: inline-grid;place-items: center;width: 26px;height: 26px;border-radius: 50%;background: var(--ct-pine);color: #fff;font-family: system-ui,sans-serif;font-size: 0.8rem;}
.ct-head{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;gap: 10px;}
.ct-btns{display: flex;flex-wrap: wrap;gap: 8px;}
.ct-btn{appearance: none;border: 1px solid var(--ct-line);background: var(--ct-surface);color: var(--ct-ink);border-radius: 999px;padding: 6px 14px;font-size: 0.88rem;font-weight: 600;cursor: pointer;}
.ct-btn:hover{border-color: var(--ct-pine);color: var(--ct-pine);}
.ct-btn:focus-visible,.ct-field input:focus-visible,.ct-field select:focus-visible,.ct-seg input:focus-visible + span,.ct-chip:focus-visible{outline: none;box-shadow: var(--ct-focus);}
.ct-btn--solid{background: var(--ct-pine);border-color: var(--ct-pine);color: #fff;}
.ct-btn--solid:hover{background: var(--ct-pine-dark);color: #fff;}
.ct-seg{display: inline-flex;flex-wrap: wrap;border: 1px solid var(--ct-line);border-radius: 999px;padding: 3px;background: var(--ct-paper);gap: 2px;}
.ct-seg label{margin: 0;cursor: pointer;}
.ct-seg input{position: absolute;opacity: 0;pointer-events: none;}
.ct-seg span{display: block;padding: 5px 14px;border-radius: 999px;font-size: 0.88rem;font-weight: 600;color: var(--ct-muted);}
.ct-seg input:checked + span{background: var(--ct-pine);color: #fff;}
.ct-fields{display: grid;grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));gap: 12px;}
.ct-field{display: grid;gap: 4px;font-size: 0.9rem;}
.ct-field > span:first-child{font-weight: 600;}
.ct-input{display: flex;align-items: stretch;border: 1px solid var(--ct-line);border-radius: 8px;background: #fff;overflow: hidden;}
.ct-input:focus-within{border-color: var(--ct-pine);box-shadow: var(--ct-focus);}
.ct-input input{flex: 1;min-width: 0;border: 0;padding: 9px 10px;font-size: 1rem;color: var(--ct-ink);background: transparent;}
.ct-input input:focus{outline: none;}
.ct-input em{font-style: normal;display: grid;place-items: center;padding: 0 10px;background: var(--ct-paper);color: var(--ct-muted);font-size: 0.85rem;border-left: 1px solid var(--ct-line);}
.ct-field select{border: 1px solid var(--ct-line);border-radius: 8px;padding: 9px 10px;font-size: 1rem;background: #fff;color: var(--ct-ink);}
.ct-hint{color: var(--ct-muted);font-size: 0.8rem;line-height: 1.4;}
.ct-field--big .ct-input input{font-size: 1.3rem;font-weight: 700;padding: 10px 12px;}
.ct-chips{display: flex;flex-wrap: wrap;gap: 6px;align-items: center;margin-top: 8px;font-size: 0.85rem;color: var(--ct-muted);}
.ct-chip{appearance: none;border: 1px dashed var(--ct-pine);background: var(--ct-pine-soft);color: var(--ct-pine-dark);border-radius: 6px;padding: 3px 10px;font-size: 0.85rem;font-weight: 600;cursor: pointer;}
.ct-shapes{display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: 8px;}
.ct-shape{margin: 0;cursor: pointer;}
.ct-shape input{position: absolute;opacity: 0;pointer-events: none;}
.ct-shape > span{display: grid;justify-items: center;gap: 4px;border: 1px solid var(--ct-line);border-radius: 8px;padding: 10px 4px 8px;font-size: 0.82rem;font-weight: 600;color: var(--ct-muted);text-align: center;height: 100%;}
.ct-shape svg{width: 40px;height: 44px;fill: var(--ct-line);}
.ct-shape small{font-weight: 400;font-size: 0.74rem;}
.ct-shape input:checked + span{border-color: var(--ct-pine);background: var(--ct-pine-soft);color: var(--ct-pine-dark);}
.ct-shape input:checked + span svg{fill: var(--ct-pine);}
.ct-shape input:focus-visible + span{box-shadow: var(--ct-focus);}
.ct-panel{background: var(--ct-paper);border: 1px solid var(--ct-line);border-radius: var(--ct-radius);padding: 18px;display: grid;gap: 16px;align-content: start;}
.ct-empty{text-align: center;color: var(--ct-muted);padding: 30px 10px;font-size: 0.95rem;}
.ct-empty svg{width: 54px;height: 60px;fill: var(--ct-line);margin-bottom: 8px;}
.ct-error{background: var(--ct-berry-soft);color: var(--ct-berry);border-radius: 8px;padding: 12px 14px;font-weight: 600;margin: 0;}
.ct-answer{display: grid;grid-template-columns: minmax(0, 1fr);gap: 14px;align-items: center;}
.ct-answer-label{text-transform: uppercase;letter-spacing: 0.06em;font-size: 0.74rem;font-weight: 700;color: var(--ct-berry);margin: 0;}
.ct-answer-big{font-family: var(--ct-serif);font-size: clamp(2.6rem, 7vw, 3.4rem);font-weight: 700;line-height: 1;color: var(--ct-pine-dark);margin: 4px 0 8px;}
.ct-answer-note{margin: 0;color: var(--ct-muted);font-size: 0.9rem;line-height: 1.5;}
.ct-diagram{background: var(--ct-surface);border: 1px solid var(--ct-line);border-radius: 8px;padding: 6px;}
.ct-diagram svg{display: block;width: 100%;height: auto;max-height: 300px;}
.ct-svg-wall{fill: #fbfaf6;}
.ct-svg-ceil{stroke: var(--ct-ink);stroke-width: 2;}
.ct-svg-floor{stroke: #8a6a45;stroke-width: 4;}
.ct-svg-gap{fill: var(--ct-gold-soft);stroke: var(--ct-gold);stroke-dasharray: 3 3;}
.ct-svg-tier{fill: var(--ct-pine);stroke: var(--ct-pine-dark);stroke-width: 1;}
.ct-svg-trunk{fill: #6b4a2b;}
.ct-svg-stand{fill: var(--ct-berry);}
.ct-svg-star{fill: var(--ct-gold);}
.ct-svg-dim{stroke: var(--ct-muted);stroke-width: 1;stroke-dasharray: 4 3;}
.ct-svg-dim--tree{stroke: var(--ct-pine);stroke-dasharray: none;}
.ct-svg-txt{font: 600 11px system-ui,sans-serif;fill: var(--ct-muted);}
.ct-svg-txt--tree{fill: var(--ct-pine-dark);font-size: 12px;}
.ct-svg-txt--gap{fill: #7a5a12;}
.ct-list{list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));gap: 8px;}
.ct-list li{background: var(--ct-surface);border: 1px solid var(--ct-line);border-radius: 8px;padding: 10px 12px;display: grid;gap: 2px;}
.ct-list b{font-size: 0.74rem;text-transform: uppercase;letter-spacing: 0.05em;color: var(--ct-muted);font-weight: 700;}
.ct-list strong{font-size: 1.12rem;color: var(--ct-ink);}
.ct-list small{color: var(--ct-muted);font-size: 0.8rem;}
.ct-notes{margin: 0;padding: 0;list-style: none;display: grid;gap: 8px;font-size: 0.88rem;line-height: 1.5;}
.ct-notes li{border-left: 3px solid var(--ct-gold);background: var(--ct-surface);padding: 8px 12px;border-radius: 0 6px 6px 0;}
.ct-notes:empty{display: none;}
.ct-out-actions{display: flex;flex-wrap: wrap;gap: 8px;}
.ct-article{margin: 0 auto 36px;color: var(--ct-ink);line-height: 1.7;}
.ct-article h2{font-family: var(--ct-serif);font-size: 1.55rem;color: var(--ct-pine-dark);margin: 34px 0 12px;}
.ct-article h3{font-size: 1.1rem;margin: 22px 0 8px;}
.ct-article p,.ct-article li{font-size: 1rem;}
.ct-article code{background: var(--ct-paper);color: var(--ct-pine-dark);padding: 1px 6px;border-radius: 4px;font-size: 0.92em;}
.ct-stack{display: grid;grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));gap: 0;border: 1px solid var(--ct-line);border-radius: var(--ct-radius);overflow: hidden;margin: 16px 0;}
.ct-stack div{padding: 12px 14px;border-right: 1px solid var(--ct-line);background: var(--ct-surface);}
.ct-stack div:last-child{border-right: 0;background: var(--ct-pine-soft);}
.ct-stack b{display: block;font-size: 1.25rem;font-family: var(--ct-serif);color: var(--ct-pine-dark);}
.ct-stack span{font-size: 0.85rem;color: var(--ct-muted);}
.ct-table-wrap{overflow-x: auto;margin: 14px 0 6px;border: 1px solid var(--ct-line);border-radius: var(--ct-radius);}
.ct-table{width: 100%;border-collapse: collapse;font-size: 0.95rem;min-width: 520px;}
.ct-table th,.ct-table td{padding: 9px 12px;border-bottom: 1px solid var(--ct-line);text-align: left;}
.ct-table thead th{background: var(--ct-pine);color: #fff;font-weight: 600;}
.ct-table tbody tr:nth-child(even){background: var(--ct-paper);}
.ct-table tbody tr:last-child td{border-bottom: 0;}
.ct-caption{font-size: 0.85rem;color: var(--ct-muted);margin: 0 0 18px;}
.ct-formula{background: var(--ct-pine-dark);color: #f3efe3;border-radius: 8px;padding: 14px 16px;font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size: 0.9rem;overflow-x: auto;white-space: pre;margin: 12px 0;}
.ct-callout{background: var(--ct-gold-soft);border: 1px solid #ecd9a6;border-radius: var(--ct-radius);padding: 14px 18px;margin: 18px 0;}
.ct-callout p{margin: 0;}
.ct-limits{list-style: none;padding: 0;margin: 12px 0;display: grid;gap: 10px;}
.ct-limits li{padding: 10px 14px;border: 1px solid var(--ct-line);border-left: 4px solid var(--ct-berry);border-radius: 6px;background: var(--ct-surface);}
.ct-closing{display: grid;grid-template-columns: minmax(0, 1fr);gap: 1.25rem;align-items: start;margin-top: 1rem;}
.ct-closing > section{margin: 0;min-width: 0;}
@media (min-width: 576px){.ct-answer{grid-template-columns: minmax(0, 1fr) 170px;}}
@media (min-width: 992px){.ct-grid{grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);}.ct-tool{padding: 26px;}.ct-closing{grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);}}
@media (max-width: 480px){.ct-shapes{grid-template-columns: repeat(2, minmax(0, 1fr));}.ct-tool{padding: 14px;}}