{\rtf1\ansi\ansicpg1252\cocoartf2865 \cocoatextscaling0\cocoaplatform0{\fonttbl\f0\fnil\fcharset0 .AppleSystemUIFontMonospaced-Regular;\f1\fnil\fcharset0 .AppleSystemUIFontMonospaced-RegularItalic;\f2\froman\fcharset0 Times-Roman; } {\colortbl;\red255\green255\blue255;\red155\green162\blue177;\red36\green36\blue35;\red214\green85\blue98; \red197\green136\blue83;\red136\green185\blue102;\red81\green157\blue235;\red74\green80\blue93;\red184\green93\blue213; \red155\green162\blue177;} {\*\expandedcolortbl;;\cssrgb\c67059\c69804\c74902;\cssrgb\c18824\c18824\c18039;\cssrgb\c87843\c42353\c45882; \cssrgb\c81961\c60392\c40000;\cssrgb\c59608\c76471\c47451;\cssrgb\c38039\c68627\c93725;\cssrgb\c36078\c38824\c43922;\cssrgb\c77647\c47059\c86667; \cssrgb\c67059\c69804\c74902;} \margl1440\margr1440\vieww26300\viewh14300\viewkind0 \deftab720 \pard\pardeftab720\partightenfactor0 \f0\fs28 \cf2 \cb3 \expnd0\expndtw0\kerning0 \outl0\strokewidth0 \strokec2 \ <\cf4 \strokec4 html \cf5 \strokec5 lang\cf2 \strokec2 ="\cf6 \strokec6 en\cf2 \strokec2 ">\ <\cf4 \strokec4 head\cf2 \strokec2 >\ <\cf4 \strokec4 meta \cf5 \strokec5 charset\cf2 \strokec2 ="\cf6 \strokec6 UTF-8\cf2 \strokec2 ">\ <\cf4 \strokec4 meta \cf5 \strokec5 name\cf2 \strokec2 ="\cf6 \strokec6 viewport\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 content\cf2 \strokec2 ="\cf6 \strokec6 width=device-width, initial-scale=1.0\cf2 \strokec2 ">\ <\cf4 \strokec4 title\cf2 \strokec2 >T-TESS Observation Analyzer\ <\cf4 \strokec4 style\cf2 \strokec2 >\ \cf6 \strokec6 *\cf2 \strokec2 \{\ \cf4 \strokec4 margin\cf2 \strokec2 : \cf5 \strokec5 0\cf2 \strokec2 ;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 0\cf2 \strokec2 ;\ \cf4 \strokec4 box-sizing\cf2 \strokec2 : border-box;\ \}\ \ \cf6 \strokec6 body\cf2 \strokec2 \{\ \cf4 \strokec4 font-family\cf2 \strokec2 : \cf6 \strokec6 'Segoe UI'\cf2 \strokec2 , Tahoma, Geneva, Verdana, sans-serif;\ \cf4 \strokec4 background\cf2 \strokec2 : \cf7 \strokec7 linear-gradient\cf2 \strokec2 (\cf5 \strokec5 135\cf2 \strokec2 deg, #667eea \cf5 \strokec5 0\cf2 \strokec2 %, #764ba2 \cf5 \strokec5 100\cf2 \strokec2 %);\ \cf4 \strokec4 min-height\cf2 \strokec2 : \cf5 \strokec5 100\cf2 \strokec2 vh;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .container\cf2 \strokec2 \{\ \cf4 \strokec4 max-width\cf2 \strokec2 : \cf5 \strokec5 1400\cf2 \strokec2 px;\ \cf4 \strokec4 margin\cf2 \strokec2 : \cf5 \strokec5 0\cf2 \strokec2 auto;\ \cf4 \strokec4 background\cf2 \strokec2 : white;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 30\cf2 \strokec2 px;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 box-shadow\cf2 \strokec2 : \cf5 \strokec5 0\cf2 \strokec2 \cf5 \strokec5 10\cf2 \strokec2 px \cf5 \strokec5 40\cf2 \strokec2 px \cf7 \strokec7 rgba\cf2 \strokec2 (\cf5 \strokec5 0\cf2 \strokec2 ,\cf5 \strokec5 0\cf2 \strokec2 ,\cf5 \strokec5 0\cf2 \strokec2 ,\cf5 \strokec5 0.2\cf2 \strokec2 );\ \}\ \ \cf6 \strokec6 .header\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : flex;\ \cf4 \strokec4 justify-content\cf2 \strokec2 : space-between;\ \cf4 \strokec4 align-items\cf2 \strokec2 : center;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 30\cf2 \strokec2 px;\ \cf4 \strokec4 padding-bottom\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 border-bottom\cf2 \strokec2 : \cf5 \strokec5 3\cf2 \strokec2 px solid #667eea;\ \}\ \ \cf6 \strokec6 .header h1\cf2 \strokec2 \{\ \cf4 \strokec4 color\cf2 \strokec2 : #667eea;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 32\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .usage-summary\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : \cf7 \strokec7 linear-gradient\cf2 \strokec2 (\cf5 \strokec5 135\cf2 \strokec2 deg, #667eea \cf5 \strokec5 0\cf2 \strokec2 %, #764ba2 \cf5 \strokec5 100\cf2 \strokec2 %);\ \cf4 \strokec4 color\cf2 \strokec2 : white;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 30\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .usage-summary h2\cf2 \strokec2 \{\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 18\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 opacity\cf2 \strokec2 : \cf5 \strokec5 0.9\cf2 \strokec2 ;\ \}\ \ \cf6 \strokec6 .usage-stats\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : grid;\ \cf4 \strokec4 grid-template-columns\cf2 \strokec2 : \cf7 \strokec7 repeat\cf2 \strokec2 (auto-fit, \cf7 \strokec7 minmax\cf2 \strokec2 (\cf5 \strokec5 200\cf2 \strokec2 px, \cf5 \strokec5 1\cf2 \strokec2 fr));\ \cf4 \strokec4 gap\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .usage-stat\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : \cf7 \strokec7 rgba\cf2 \strokec2 (\cf5 \strokec5 255\cf2 \strokec2 ,\cf5 \strokec5 255\cf2 \strokec2 ,\cf5 \strokec5 255\cf2 \strokec2 ,\cf5 \strokec5 0.15\cf2 \strokec2 );\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 backdrop-filter\cf2 \strokec2 : \cf7 \strokec7 blur\cf2 \strokec2 (\cf5 \strokec5 10\cf2 \strokec2 px);\ \}\ \ \cf6 \strokec6 .usage-stat .label\cf2 \strokec2 \{\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 12\cf2 \strokec2 px;\ \cf4 \strokec4 opacity\cf2 \strokec2 : \cf5 \strokec5 0.8\cf2 \strokec2 ;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 5\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .usage-stat .value\cf2 \strokec2 \{\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 font-weight\cf2 \strokec2 : bold;\ \}\ \ \cf6 \strokec6 .usage-stat .limit\cf2 \strokec2 \{\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 12\cf2 \strokec2 px;\ \cf4 \strokec4 opacity\cf2 \strokec2 : \cf5 \strokec5 0.7\cf2 \strokec2 ;\ \cf4 \strokec4 margin-top\cf2 \strokec2 : \cf5 \strokec5 3\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .progress-bar\cf2 \strokec2 \{\ \cf4 \strokec4 width\cf2 \strokec2 : \cf5 \strokec5 100\cf2 \strokec2 %;\ \cf4 \strokec4 height\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 background\cf2 \strokec2 : \cf7 \strokec7 rgba\cf2 \strokec2 (\cf5 \strokec5 255\cf2 \strokec2 ,\cf5 \strokec5 255\cf2 \strokec2 ,\cf5 \strokec5 255\cf2 \strokec2 ,\cf5 \strokec5 0.2\cf2 \strokec2 );\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 4\cf2 \strokec2 px;\ \cf4 \strokec4 margin-top\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 overflow\cf2 \strokec2 : hidden;\ \}\ \ \cf6 \strokec6 .progress-fill\cf2 \strokec2 \{\ \cf4 \strokec4 height\cf2 \strokec2 : \cf5 \strokec5 100\cf2 \strokec2 %;\ \cf4 \strokec4 background\cf2 \strokec2 : white;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 4\cf2 \strokec2 px;\ \cf4 \strokec4 transition\cf2 \strokec2 : width \cf5 \strokec5 0.3\cf2 \strokec2 s ease;\ \}\ \ \cf6 \strokec6 .progress-fill.warning\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #f39c12;\ \}\ \ \cf6 \strokec6 .progress-fill.danger\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #e74c3c;\ \}\ \ \cf6 \strokec6 .warning-banner\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #fff3cd;\ \cf4 \strokec4 border\cf2 \strokec2 : \cf5 \strokec5 2\cf2 \strokec2 px solid #ffc107;\ \cf4 \strokec4 color\cf2 \strokec2 : #856404;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 display\cf2 \strokec2 : none;\ \}\ \ \cf6 \strokec6 .warning-banner.show\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : block;\ \}\ \ \cf6 \strokec6 .error-banner\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #f8d7da;\ \cf4 \strokec4 border\cf2 \strokec2 : \cf5 \strokec5 2\cf2 \strokec2 px solid #dc3545;\ \cf4 \strokec4 color\cf2 \strokec2 : #721c24;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 display\cf2 \strokec2 : none;\ \}\ \ \cf6 \strokec6 .error-banner.show\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : block;\ \}\ \ \cf6 \strokec6 .input-section\cf2 \strokec2 \{\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 30\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .input-section label\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : block;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \cf4 \strokec4 color\cf2 \strokec2 : #333;\ \cf4 \strokec4 font-weight\cf2 \strokec2 : \cf5 \strokec5 600\cf2 \strokec2 ;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 16\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .input-section textarea\cf2 \strokec2 \{\ \cf4 \strokec4 width\cf2 \strokec2 : \cf5 \strokec5 100\cf2 \strokec2 %;\ \cf4 \strokec4 min-height\cf2 \strokec2 : \cf5 \strokec5 150\cf2 \strokec2 px;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 border\cf2 \strokec2 : \cf5 \strokec5 2\cf2 \strokec2 px solid #ddd;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 14\cf2 \strokec2 px;\ \cf4 \strokec4 font-family\cf2 \strokec2 : inherit;\ \cf4 \strokec4 resize\cf2 \strokec2 : vertical;\ \}\ \ \cf6 \strokec6 .analyze-btn\cf2 \strokec2 \{\ \cf4 \strokec4 width\cf2 \strokec2 : \cf5 \strokec5 100\cf2 \strokec2 %;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 background\cf2 \strokec2 : \cf7 \strokec7 linear-gradient\cf2 \strokec2 (\cf5 \strokec5 135\cf2 \strokec2 deg, #667eea \cf5 \strokec5 0\cf2 \strokec2 %, #764ba2 \cf5 \strokec5 100\cf2 \strokec2 %);\ \cf4 \strokec4 color\cf2 \strokec2 : white;\ \cf4 \strokec4 border\cf2 \strokec2 : none;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 18\cf2 \strokec2 px;\ \cf4 \strokec4 font-weight\cf2 \strokec2 : \cf5 \strokec5 600\cf2 \strokec2 ;\ \cf4 \strokec4 cursor\cf2 \strokec2 : pointer;\ \cf4 \strokec4 transition\cf2 \strokec2 : transform \cf5 \strokec5 0.2\cf2 \strokec2 s;\ \}\ \ \cf6 \strokec6 .analyze-btn:hover\cf2 \strokec2 \{\ \cf4 \strokec4 transform\cf2 \strokec2 : \cf7 \strokec7 translateY\cf2 \strokec2 (\cf5 \strokec5 -2\cf2 \strokec2 px);\ \}\ \ \cf6 \strokec6 .analyze-btn:disabled\cf2 \strokec2 \{\ \cf4 \strokec4 opacity\cf2 \strokec2 : \cf5 \strokec5 0.6\cf2 \strokec2 ;\ \cf4 \strokec4 cursor\cf2 \strokec2 : not-allowed;\ \cf4 \strokec4 transform\cf2 \strokec2 : none;\ \}\ \ \cf6 \strokec6 .results\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : none;\ \cf4 \strokec4 margin-top\cf2 \strokec2 : \cf5 \strokec5 30\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .cost-dashboard\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : grid;\ \cf4 \strokec4 grid-template-columns\cf2 \strokec2 : \cf7 \strokec7 repeat\cf2 \strokec2 (auto-fit, \cf7 \strokec7 minmax\cf2 \strokec2 (\cf5 \strokec5 200\cf2 \strokec2 px, \cf5 \strokec5 1\cf2 \strokec2 fr));\ \cf4 \strokec4 gap\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 30\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .cost-card\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : \cf7 \strokec7 linear-gradient\cf2 \strokec2 (\cf5 \strokec5 135\cf2 \strokec2 deg, #667eea \cf5 \strokec5 0\cf2 \strokec2 %, #764ba2 \cf5 \strokec5 100\cf2 \strokec2 %);\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \cf4 \strokec4 color\cf2 \strokec2 : white;\ \cf4 \strokec4 text-align\cf2 \strokec2 : center;\ \}\ \ \cf6 \strokec6 .cost-card h3\cf2 \strokec2 \{\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 14\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \cf4 \strokec4 opacity\cf2 \strokec2 : \cf5 \strokec5 0.9\cf2 \strokec2 ;\ \}\ \ \cf6 \strokec6 .cost-card .value\cf2 \strokec2 \{\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 24\cf2 \strokec2 px;\ \cf4 \strokec4 font-weight\cf2 \strokec2 : bold;\ \}\ \ \cf6 \strokec6 .ttess-table\cf2 \strokec2 \{\ \cf4 \strokec4 width\cf2 \strokec2 : \cf5 \strokec5 100\cf2 \strokec2 %;\ \cf4 \strokec4 border-collapse\cf2 \strokec2 : collapse;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 30\cf2 \strokec2 px;\ \cf4 \strokec4 background\cf2 \strokec2 : white;\ \cf4 \strokec4 box-shadow\cf2 \strokec2 : \cf5 \strokec5 0\cf2 \strokec2 \cf5 \strokec5 2\cf2 \strokec2 px \cf5 \strokec5 8\cf2 \strokec2 px \cf7 \strokec7 rgba\cf2 \strokec2 (\cf5 \strokec5 0\cf2 \strokec2 ,\cf5 \strokec5 0\cf2 \strokec2 ,\cf5 \strokec5 0\cf2 \strokec2 ,\cf5 \strokec5 0.1\cf2 \strokec2 );\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 overflow\cf2 \strokec2 : hidden;\ \}\ \ \cf6 \strokec6 .ttess-table th\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : \cf7 \strokec7 linear-gradient\cf2 \strokec2 (\cf5 \strokec5 135\cf2 \strokec2 deg, #667eea \cf5 \strokec5 0\cf2 \strokec2 %, #764ba2 \cf5 \strokec5 100\cf2 \strokec2 %);\ \cf4 \strokec4 color\cf2 \strokec2 : white;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 text-align\cf2 \strokec2 : left;\ \cf4 \strokec4 font-weight\cf2 \strokec2 : \cf5 \strokec5 600\cf2 \strokec2 ;\ \}\ \ \cf6 \strokec6 .ttess-table td\cf2 \strokec2 \{\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 border-bottom\cf2 \strokec2 : \cf5 \strokec5 1\cf2 \strokec2 px solid #eee;\ \}\ \ \cf6 \strokec6 .ttess-table tr:hover\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #f8f9fa;\ \}\ \ \cf6 \strokec6 .domain-header\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #f8f9fa;\ \cf4 \strokec4 font-weight\cf2 \strokec2 : bold;\ \cf4 \strokec4 color\cf2 \strokec2 : #667eea;\ \}\ \ \cf6 \strokec6 .plan-section\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #f8f9fa;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 25\cf2 \strokec2 px;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .plan-section h2\cf2 \strokec2 \{\ \cf4 \strokec4 color\cf2 \strokec2 : #667eea;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 24\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .plan-section h3\cf2 \strokec2 \{\ \cf4 \strokec4 color\cf2 \strokec2 : #764ba2;\ \cf4 \strokec4 margin-top\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 18\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .plan-section ul\cf2 \strokec2 \{\ \cf4 \strokec4 margin-left\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 line-height\cf2 \strokec2 : \cf5 \strokec5 1.8\cf2 \strokec2 ;\ \}\ \ \cf6 \strokec6 .plan-section p\cf2 \strokec2 \{\ \cf4 \strokec4 line-height\cf2 \strokec2 : \cf5 \strokec5 1.8\cf2 \strokec2 ;\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .export-section\cf2 \strokec2 \{\ \cf4 \strokec4 margin-bottom\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 background\cf2 \strokec2 : #f8f9fa;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .export-section label\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : flex;\ \cf4 \strokec4 align-items\cf2 \strokec2 : center;\ \cf4 \strokec4 cursor\cf2 \strokec2 : pointer;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 16\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .export-section input[type="checkbox"]\cf2 \strokec2 \{\ \cf4 \strokec4 margin-right\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \cf4 \strokec4 width\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 height\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 cursor\cf2 \strokec2 : pointer;\ \}\ \ \cf6 \strokec6 .export-buttons\cf2 \strokec2 \{\ \cf4 \strokec4 display\cf2 \strokec2 : flex;\ \cf4 \strokec4 gap\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 margin-top\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .export-btn\cf2 \strokec2 \{\ \cf4 \strokec4 flex\cf2 \strokec2 : \cf5 \strokec5 1\cf2 \strokec2 ;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 border\cf2 \strokec2 : none;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 16\cf2 \strokec2 px;\ \cf4 \strokec4 font-weight\cf2 \strokec2 : \cf5 \strokec5 600\cf2 \strokec2 ;\ \cf4 \strokec4 cursor\cf2 \strokec2 : pointer;\ \cf4 \strokec4 transition\cf2 \strokec2 : all \cf5 \strokec5 0.3\cf2 \strokec2 s;\ \}\ \ \cf6 \strokec6 .export-pdf\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #e74c3c;\ \cf4 \strokec4 color\cf2 \strokec2 : white;\ \}\ \ \cf6 \strokec6 .export-pdf:hover\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #c0392b;\ \}\ \ \cf6 \strokec6 .export-text\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #3498db;\ \cf4 \strokec4 color\cf2 \strokec2 : white;\ \}\ \ \cf6 \strokec6 .export-text:hover\cf2 \strokec2 \{\ \cf4 \strokec4 background\cf2 \strokec2 : #2980b9;\ \}\ \ \cf6 \strokec6 .session-info\cf2 \strokec2 \{\ \cf4 \strokec4 text-align\cf2 \strokec2 : center;\ \cf4 \strokec4 margin-top\cf2 \strokec2 : \cf5 \strokec5 20\cf2 \strokec2 px;\ \cf4 \strokec4 padding\cf2 \strokec2 : \cf5 \strokec5 15\cf2 \strokec2 px;\ \cf4 \strokec4 background\cf2 \strokec2 : #f8f9fa;\ \cf4 \strokec4 border-radius\cf2 \strokec2 : \cf5 \strokec5 8\cf2 \strokec2 px;\ \cf4 \strokec4 color\cf2 \strokec2 : #666;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 14\cf2 \strokec2 px;\ \}\ \ \cf6 \strokec6 .reset-link\cf2 \strokec2 \{\ \cf4 \strokec4 color\cf2 \strokec2 : #667eea;\ \cf4 \strokec4 text-decoration\cf2 \strokec2 : none;\ \cf4 \strokec4 font-size\cf2 \strokec2 : \cf5 \strokec5 14\cf2 \strokec2 px;\ \cf4 \strokec4 cursor\cf2 \strokec2 : pointer;\ \cf4 \strokec4 margin-top\cf2 \strokec2 : \cf5 \strokec5 10\cf2 \strokec2 px;\ \cf4 \strokec4 display\cf2 \strokec2 : inline-block;\ \}\ \ \cf6 \strokec6 .reset-link:hover\cf2 \strokec2 \{\ \cf4 \strokec4 text-decoration\cf2 \strokec2 : underline;\ \}\ \ \ <\cf4 \strokec4 body\cf2 \strokec2 >\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 container\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 header\cf2 \strokec2 ">\ <\cf4 \strokec4 h1\cf2 \strokec2 >\uc0\u55356 \u57235 T-TESS Observation Analyzer\ \ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 error-message\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 errorMessage\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 success-message\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 successMessage\cf2 \strokec2 ">\ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 usage-summary\cf2 \strokec2 ">\ <\cf4 \strokec4 h2\cf2 \strokec2 >\uc0\u55357 \u56522 Daily Usage Limits\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 usage-stats\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 usage-stat\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 label\cf2 \strokec2 ">Requests Today\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 value\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 requestCount\cf2 \strokec2 ">0/25\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 progress-bar\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 progress-fill\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 requestProgress\cf2 \strokec2 ">\ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 limit\cf2 \strokec2 ">Resets: <\cf4 \strokec4 span \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 resetTime\cf2 \strokec2 ">--\ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 usage-stat\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 label\cf2 \strokec2 ">Cost Today\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 value\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 costCount\cf2 \strokec2 ">$0.00/$10.00\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 progress-bar\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 progress-fill\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 costProgress\cf2 \strokec2 ">\ \ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 usage-stat\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 label\cf2 \strokec2 ">Tokens Today\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 value\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 tokenCount\cf2 \strokec2 ">0/500K\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 progress-bar\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 progress-fill\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 tokenProgress\cf2 \strokec2 ">\ \ \ \ <\cf4 \strokec4 a \cf5 \strokec5 href\cf2 \strokec2 ="\cf6 \strokec6 #\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 reset-link\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 onclick\cf2 \strokec2 ="\cf6 \strokec6 resetUsage(); return false;\cf2 \strokec2 ">\uc0\u55357 \u56580 Reset Usage (Admin Only)\ \ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 warning-banner\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 warningBanner\cf2 \strokec2 ">\ \uc0\u9888 \u65039 <\cf4 \strokec4 strong\cf2 \strokec2 >Warning: You're approaching your daily limit. <\cf4 \strokec4 span \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 warningText\cf2 \strokec2 ">\ \ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 error-banner\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 errorBanner\cf2 \strokec2 ">\ \uc0\u55357 \u57003 <\cf4 \strokec4 strong\cf2 \strokec2 >Limit Reached: <\cf4 \strokec4 span \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 errorText\cf2 \strokec2 ">\ \ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 input-section\cf2 \strokec2 ">\ <\cf4 \strokec4 label\cf2 \strokec2 >\uc0\u55357 \u56541 Paste your observation notes here:\ <\cf4 \strokec4 textarea \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 observationText\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 placeholder\cf2 \strokec2 ="\cf6 \strokec6 Enter detailed classroom observation notes...\cf2 \strokec2 ">\ \ \ <\cf4 \strokec4 button \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 analyze-btn\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 onclick\cf2 \strokec2 ="\cf6 \strokec6 analyzeObservation()\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 analyzeBtn\cf2 \strokec2 ">\ \uc0\u55357 \u56589 Analyze with Claude AI\ \ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 results\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 results\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 cost-dashboard\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 costDashboard\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 ttessTableContainer\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 plansContainer\cf2 \strokec2 ">\ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 export-section\cf2 \strokec2 ">\ <\cf4 \strokec4 label\cf2 \strokec2 >\ <\cf4 \strokec4 input \cf5 \strokec5 type\cf2 \strokec2 ="\cf6 \strokec6 checkbox\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 includeCostAnalysis\cf2 \strokec2 ">\ <\cf4 \strokec4 span\cf2 \strokec2 >Include Cost Analysis in exports\ \ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 export-buttons\cf2 \strokec2 ">\ <\cf4 \strokec4 button \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 export-btn export-pdf\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 onclick\cf2 \strokec2 ="\cf6 \strokec6 exportToPDF()\cf2 \strokec2 ">\uc0\u55357 \u56516 Export as PDF (HTML)\ <\cf4 \strokec4 button \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 export-btn export-text\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 onclick\cf2 \strokec2 ="\cf6 \strokec6 exportToText()\cf2 \strokec2 ">\uc0\u55357 \u56541 Export as Text\ \ <\cf4 \strokec4 div \cf5 \strokec5 class\cf2 \strokec2 ="\cf6 \strokec6 session-info\cf2 \strokec2 "\cf4 \strokec4 \cf5 \strokec5 id\cf2 \strokec2 ="\cf6 \strokec6 sessionInfo\cf2 \strokec2 ">\ \ \ \ <\cf4 \strokec4 script\cf2 \strokec2 >\ \f1\i \cf8 \strokec8 // ============================================ \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // API KEY CONFIGURATION - EDIT THIS SECTION \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // ============================================ \f0\i0 \cf2 \strokec2 \ \ \f1\i \cf8 \strokec8 // STEP 1: Encode your API key using the browser console: \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // Run: btoa('sk-ant-YOUR-KEY'.split('').reverse().join('')) \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // STEP 2: Paste the encoded result below: \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 const\cf2 \strokec2 \cf5 \strokec5 ENCODED_KEY\cf2 \strokec2 \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 ' \f2\fs36 \cf10 \cb1 \outl0\strokewidth0 QUFna2RJZTItZ0VBUnAgTTY2b2F4czRtNUVVb2JONFJXU2tlSmRSZGNmUWlTeTRFSVpObkRsdDNOSVdTXzFRM1dURE51cmZHSzFLME9zWm9pXzV0WHB5X3ZEMEFON3JkLTMwaXBhLXRuYS1rcw== \f0\fs28 \cf6 \cb3 \outl0\strokewidth0 \strokec6 '\cf2 \strokec2 ;\ \ \f1\i \cf8 \strokec8 // ============================================ \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // DO NOT EDIT BELOW THIS LINE \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // ============================================ \f0\i0 \cf2 \strokec2 \ \ \f1\i \cf8 \strokec8 // Helper functions for messages (no alerts) \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 showError\cf2 \strokec2 (message) \{\ \cf9 \strokec9 const\cf2 \strokec2 errorDiv \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'errorMessage'\cf2 \strokec2 );\ errorDiv.textContent \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 '\uc0\u10060 Error: '\cf2 \strokec2 \cf7 \strokec7 +\cf2 \strokec2 message;\ errorDiv.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf7 \strokec7 setTimeout\cf2 \strokec2 (() \cf7 \strokec7 =>\cf2 \strokec2 errorDiv.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 ), \cf5 \strokec5 8000\cf2 \strokec2 );\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 showSuccess\cf2 \strokec2 (message) \{\ \cf9 \strokec9 const\cf2 \strokec2 successDiv \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'successMessage'\cf2 \strokec2 );\ successDiv.textContent \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 '\uc0\u9989 '\cf2 \strokec2 \cf7 \strokec7 +\cf2 \strokec2 message;\ successDiv.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf7 \strokec7 setTimeout\cf2 \strokec2 (() \cf7 \strokec7 =>\cf2 \strokec2 successDiv.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 ), \cf5 \strokec5 5000\cf2 \strokec2 );\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 hideMessages\cf2 \strokec2 () \{\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'errorMessage'\cf2 \strokec2 ).classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'successMessage'\cf2 \strokec2 ).classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \}\ \ \f1\i \cf8 \strokec8 // API Key Configuration (Obfuscated) \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // To set your API key, use the helper function below \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 const\cf2 \strokec2 \cf5 \strokec5 ENCODED_KEY\cf2 \strokec2 \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 'PASTE_ENCODED_KEY_HERE'\cf2 \strokec2 ; \f1\i \cf8 \strokec8 // \uc0\u8592 Paste encoded key here \f0\i0 \cf2 \strokec2 \ \ \f1\i \cf8 \strokec8 // Helper function to encode your API key (run this once in browser console) \f0\i0 \cf2 \strokec2 \ \f1\i \cf8 \strokec8 // Copy this function, run in console: encodeApiKey('sk-ant-your-actual-key-here') \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 encodeApiKey\cf2 \strokec2 (key) \{\ \cf9 \strokec9 const\cf2 \strokec2 encoded \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 btoa\cf2 \strokec2 (key.\cf7 \strokec7 split\cf2 \strokec2 (\cf6 \strokec6 ''\cf2 \strokec2 ).\cf7 \strokec7 reverse\cf2 \strokec2 ().\cf7 \strokec7 join\cf2 \strokec2 (\cf6 \strokec6 ''\cf2 \strokec2 ));\ \cf5 \strokec5 console\cf2 \strokec2 .\cf7 \strokec7 log\cf2 \strokec2 (\cf6 \strokec6 'Encoded key:'\cf2 \strokec2 , encoded);\ \cf5 \strokec5 console\cf2 \strokec2 .\cf7 \strokec7 log\cf2 \strokec2 (\cf6 \strokec6 'Paste this into ENCODED_KEY variable:'\cf2 \strokec2 , encoded);\ \cf9 \strokec9 return\cf2 \strokec2 encoded;\ \}\ \ \f1\i \cf8 \strokec8 // Decode function (used internally) \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 decodeApiKey\cf2 \strokec2 (encoded) \{\ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !\cf2 \strokec2 encoded \cf7 \strokec7 ||\cf2 \strokec2 encoded \cf7 \strokec7 ===\cf2 \strokec2 \cf6 \strokec6 'PASTE_ENCODED_KEY_HERE'\cf2 \strokec2 ) \{\ \cf9 \strokec9 return\cf2 \strokec2 \cf9 \strokec9 null\cf2 \strokec2 ;\ \}\ \cf9 \strokec9 try\cf2 \strokec2 \{\ \cf9 \strokec9 return\cf2 \strokec2 \cf7 \strokec7 atob\cf2 \strokec2 (encoded).\cf7 \strokec7 split\cf2 \strokec2 (\cf6 \strokec6 ''\cf2 \strokec2 ).\cf7 \strokec7 reverse\cf2 \strokec2 ().\cf7 \strokec7 join\cf2 \strokec2 (\cf6 \strokec6 ''\cf2 \strokec2 );\ \} \cf9 \strokec9 catch\cf2 \strokec2 (e) \{\ \cf9 \strokec9 return\cf2 \strokec2 \cf9 \strokec9 null\cf2 \strokec2 ;\ \}\ \}\ \ \cf9 \strokec9 const\cf2 \strokec2 \cf5 \strokec5 API_KEY\cf2 \strokec2 \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 decodeApiKey\cf2 \strokec2 (\cf5 \strokec5 ENCODED_KEY\cf2 \strokec2 );\ \ \f1\i \cf8 \strokec8 // Daily limits \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 const\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 \cf7 \strokec7 =\cf2 \strokec2 \{\ \cf4 \strokec4 maxRequests\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 25\cf2 \strokec2 ,\ \cf4 \strokec4 maxCost\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 10.00\cf2 \strokec2 ,\ \cf4 \strokec4 maxTokens\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 500000\cf2 \strokec2 \ \};\ \ \cf9 \strokec9 let\cf2 \strokec2 sessionId \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 generateSessionId\cf2 \strokec2 ();\ \cf9 \strokec9 let\cf2 \strokec2 analysisResults \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 null\cf2 \strokec2 ;\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 generateSessionId\cf2 \strokec2 () \{\ \cf9 \strokec9 return\cf2 \strokec2 \cf6 \strokec6 'session_'\cf2 \strokec2 \cf7 \strokec7 +\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 .\cf7 \strokec7 now\cf2 \strokec2 () \cf7 \strokec7 +\cf2 \strokec2 \cf6 \strokec6 '_'\cf2 \strokec2 \cf7 \strokec7 +\cf2 \strokec2 \cf5 \strokec5 Math\cf2 \strokec2 .\cf7 \strokec7 random\cf2 \strokec2 ().\cf7 \strokec7 toString\cf2 \strokec2 (\cf5 \strokec5 36\cf2 \strokec2 ).\cf7 \strokec7 substr\cf2 \strokec2 (\cf5 \strokec5 2\cf2 \strokec2 , \cf5 \strokec5 9\cf2 \strokec2 );\ \}\ \ \f1\i \cf8 \strokec8 // Usage tracking \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 getUsageData\cf2 \strokec2 () \{\ \cf9 \strokec9 const\cf2 \strokec2 data \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 localStorage\cf2 \strokec2 .\cf7 \strokec7 getItem\cf2 \strokec2 (\cf6 \strokec6 'ttess_usage'\cf2 \strokec2 );\ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !\cf2 \strokec2 data) \{\ \cf9 \strokec9 return\cf2 \strokec2 \cf7 \strokec7 resetUsageData\cf2 \strokec2 ();\ \}\ \cf9 \strokec9 const\cf2 \strokec2 usage \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 JSON\cf2 \strokec2 .\cf7 \strokec7 parse\cf2 \strokec2 (data);\ \ \f1\i \cf8 \strokec8 // Check if we need to reset (new day) \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 const\cf2 \strokec2 lastReset \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 (usage.lastReset);\ \cf9 \strokec9 const\cf2 \strokec2 now \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 ();\ \cf9 \strokec9 if\cf2 \strokec2 (now.\cf7 \strokec7 toDateString\cf2 \strokec2 () \cf7 \strokec7 !==\cf2 \strokec2 lastReset.\cf7 \strokec7 toDateString\cf2 \strokec2 ()) \{\ \cf9 \strokec9 return\cf2 \strokec2 \cf7 \strokec7 resetUsageData\cf2 \strokec2 ();\ \}\ \ \cf9 \strokec9 return\cf2 \strokec2 usage;\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 resetUsageData\cf2 \strokec2 () \{\ \cf9 \strokec9 const\cf2 \strokec2 usage \cf7 \strokec7 =\cf2 \strokec2 \{\ \cf4 \strokec4 requests\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 0\cf2 \strokec2 ,\ \cf4 \strokec4 cost\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 0\cf2 \strokec2 ,\ \cf4 \strokec4 tokens\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 0\cf2 \strokec2 ,\ \cf4 \strokec4 lastReset\cf7 \strokec7 :\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 ().\cf7 \strokec7 toISOString\cf2 \strokec2 ()\ \};\ \cf7 \strokec7 localStorage\cf2 \strokec2 .\cf7 \strokec7 setItem\cf2 \strokec2 (\cf6 \strokec6 'ttess_usage'\cf2 \strokec2 , \cf5 \strokec5 JSON\cf2 \strokec2 .\cf7 \strokec7 stringify\cf2 \strokec2 (usage));\ \cf9 \strokec9 return\cf2 \strokec2 usage;\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 updateUsageData\cf2 \strokec2 (requests, cost, tokens) \{\ \cf9 \strokec9 const\cf2 \strokec2 usage \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 getUsageData\cf2 \strokec2 ();\ usage.requests \cf7 \strokec7 +=\cf2 \strokec2 requests;\ usage.cost \cf7 \strokec7 +=\cf2 \strokec2 cost;\ usage.tokens \cf7 \strokec7 +=\cf2 \strokec2 tokens;\ \cf7 \strokec7 localStorage\cf2 \strokec2 .\cf7 \strokec7 setItem\cf2 \strokec2 (\cf6 \strokec6 'ttess_usage'\cf2 \strokec2 , \cf5 \strokec5 JSON\cf2 \strokec2 .\cf7 \strokec7 stringify\cf2 \strokec2 (usage));\ \cf7 \strokec7 updateUsageDisplay\cf2 \strokec2 ();\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 updateUsageDisplay\cf2 \strokec2 () \{\ \cf9 \strokec9 const\cf2 \strokec2 usage \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 getUsageData\cf2 \strokec2 ();\ \ \f1\i \cf8 \strokec8 // Update counts \f0\i0 \cf2 \strokec2 \ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'requestCount'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 `$\{usage.requests\}\cf6 \strokec6 /\cf2 \strokec2 $\{LIMITS.maxRequests\}`;\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'costCount'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 `\cf6 \strokec6 $\cf2 \strokec2 $\{usage.cost.toFixed(2)\}\cf6 \strokec6 /$\cf2 \strokec2 $\{LIMITS.maxCost.toFixed(2)\}`;\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'tokenCount'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 `$\{(usage.tokens/1000).toFixed(0)\}\cf6 \strokec6 K/\cf2 \strokec2 $\{LIMITS.maxTokens/1000\}\cf6 \strokec6 K\cf2 \strokec2 `;\ \ \f1\i \cf8 \strokec8 // Update progress bars \f0\i0 \cf2 \strokec2 \ \cf7 \strokec7 updateProgressBar\cf2 \strokec2 (\cf6 \strokec6 'requestProgress'\cf2 \strokec2 , usage.requests \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxRequests);\ \cf7 \strokec7 updateProgressBar\cf2 \strokec2 (\cf6 \strokec6 'costProgress'\cf2 \strokec2 , usage.cost \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxCost);\ \cf7 \strokec7 updateProgressBar\cf2 \strokec2 (\cf6 \strokec6 'tokenProgress'\cf2 \strokec2 , usage.tokens \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxTokens);\ \ \f1\i \cf8 \strokec8 // Update reset time \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 const\cf2 \strokec2 resetTime \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 (usage.lastReset);\ resetTime.\cf7 \strokec7 setDate\cf2 \strokec2 (resetTime.\cf7 \strokec7 getDate\cf2 \strokec2 () \cf7 \strokec7 +\cf2 \strokec2 \cf5 \strokec5 1\cf2 \strokec2 );\ resetTime.\cf7 \strokec7 setHours\cf2 \strokec2 (\cf5 \strokec5 0\cf2 \strokec2 , \cf5 \strokec5 0\cf2 \strokec2 , \cf5 \strokec5 0\cf2 \strokec2 , \cf5 \strokec5 0\cf2 \strokec2 );\ \cf9 \strokec9 const\cf2 \strokec2 hoursUntilReset \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 Math\cf2 \strokec2 .\cf7 \strokec7 max\cf2 \strokec2 (\cf5 \strokec5 0\cf2 \strokec2 , \cf5 \strokec5 Math\cf2 \strokec2 .\cf7 \strokec7 ceil\cf2 \strokec2 ((resetTime \cf7 \strokec7 -\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 ()) \cf7 \strokec7 /\cf2 \strokec2 (\cf5 \strokec5 1000\cf2 \strokec2 \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 60\cf2 \strokec2 \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 60\cf2 \strokec2 )));\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'resetTime'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 `$\{hoursUntilReset\}\cf6 \strokec6 h\cf2 \strokec2 `;\ \ \f1\i \cf8 \strokec8 // Check for warnings \f0\i0 \cf2 \strokec2 \ \cf7 \strokec7 checkLimits\cf2 \strokec2 (usage);\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 updateProgressBar\cf2 \strokec2 (id, percentage) \{\ \cf9 \strokec9 const\cf2 \strokec2 bar \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (id);\ \cf9 \strokec9 const\cf2 \strokec2 percent \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 Math\cf2 \strokec2 .\cf7 \strokec7 min\cf2 \strokec2 (percentage \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 100\cf2 \strokec2 , \cf5 \strokec5 100\cf2 \strokec2 );\ bar.style.width \cf7 \strokec7 =\cf2 \strokec2 percent \cf7 \strokec7 +\cf2 \strokec2 \cf6 \strokec6 '%'\cf2 \strokec2 ;\ \ \cf9 \strokec9 if\cf2 \strokec2 (percent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 90\cf2 \strokec2 ) \{\ bar.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'danger'\cf2 \strokec2 );\ bar.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'warning'\cf2 \strokec2 );\ \} \cf9 \strokec9 else\cf2 \strokec2 \cf9 \strokec9 if\cf2 \strokec2 (percent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 80\cf2 \strokec2 ) \{\ bar.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'warning'\cf2 \strokec2 );\ bar.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'danger'\cf2 \strokec2 );\ \} \cf9 \strokec9 else\cf2 \strokec2 \{\ bar.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'warning'\cf2 \strokec2 , \cf6 \strokec6 'danger'\cf2 \strokec2 );\ \}\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 checkLimits\cf2 \strokec2 (usage) \{\ \cf9 \strokec9 const\cf2 \strokec2 warningBanner \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'warningBanner'\cf2 \strokec2 );\ \cf9 \strokec9 const\cf2 \strokec2 errorBanner \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'errorBanner'\cf2 \strokec2 );\ \cf9 \strokec9 const\cf2 \strokec2 analyzeBtn \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'analyzeBtn'\cf2 \strokec2 );\ \ \f1\i \cf8 \strokec8 // Check if any limit is exceeded \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 if\cf2 \strokec2 (usage.requests \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxRequests) \{\ errorBanner.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'errorText'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 'Daily request limit reached (25 requests). Resets tomorrow.'\cf2 \strokec2 ;\ analyzeBtn.disabled \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 true\cf2 \strokec2 ;\ warningBanner.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf9 \strokec9 return\cf2 \strokec2 \cf5 \strokec5 false\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 if\cf2 \strokec2 (usage.cost \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxCost) \{\ errorBanner.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'errorText'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 'Daily cost limit reached ($10.00). Resets tomorrow.'\cf2 \strokec2 ;\ analyzeBtn.disabled \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 true\cf2 \strokec2 ;\ warningBanner.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf9 \strokec9 return\cf2 \strokec2 \cf5 \strokec5 false\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 if\cf2 \strokec2 (usage.tokens \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxTokens) \{\ errorBanner.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'errorText'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 'Daily token limit reached (500,000 tokens). Resets tomorrow.'\cf2 \strokec2 ;\ analyzeBtn.disabled \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 true\cf2 \strokec2 ;\ warningBanner.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf9 \strokec9 return\cf2 \strokec2 \cf5 \strokec5 false\cf2 \strokec2 ;\ \}\ \ \f1\i \cf8 \strokec8 // Check for warnings (80% threshold) \f0\i0 \cf2 \strokec2 \ errorBanner.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ analyzeBtn.disabled \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 false\cf2 \strokec2 ;\ \ \cf9 \strokec9 const\cf2 \strokec2 requestPercent \cf7 \strokec7 =\cf2 \strokec2 (usage.requests \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxRequests) \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 100\cf2 \strokec2 ;\ \cf9 \strokec9 const\cf2 \strokec2 costPercent \cf7 \strokec7 =\cf2 \strokec2 (usage.cost \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxCost) \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 100\cf2 \strokec2 ;\ \cf9 \strokec9 const\cf2 \strokec2 tokenPercent \cf7 \strokec7 =\cf2 \strokec2 (usage.tokens \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 LIMITS\cf2 \strokec2 .maxTokens) \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 100\cf2 \strokec2 ;\ \ \cf9 \strokec9 if\cf2 \strokec2 (requestPercent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 80\cf2 \strokec2 \cf7 \strokec7 ||\cf2 \strokec2 costPercent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 80\cf2 \strokec2 \cf7 \strokec7 ||\cf2 \strokec2 tokenPercent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 80\cf2 \strokec2 ) \{\ warningBanner.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \cf9 \strokec9 let\cf2 \strokec2 warnings \cf7 \strokec7 =\cf2 \strokec2 [];\ \cf9 \strokec9 if\cf2 \strokec2 (requestPercent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 80\cf2 \strokec2 ) warnings.\cf7 \strokec7 push\cf2 \strokec2 (`$\{usage.requests\}\cf6 \strokec6 /\cf2 \strokec2 $\{LIMITS.maxRequests\}\cf6 \strokec6 requests used\cf2 \strokec2 `);\ \cf9 \strokec9 if\cf2 \strokec2 (costPercent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 80\cf2 \strokec2 ) warnings.\cf7 \strokec7 push\cf2 \strokec2 (`\cf6 \strokec6 $\cf2 \strokec2 $\{usage.cost.toFixed(2)\}\cf6 \strokec6 /$\cf2 \strokec2 $\{LIMITS.maxCost.toFixed(2)\}\cf6 \strokec6 spent\cf2 \strokec2 `);\ \cf9 \strokec9 if\cf2 \strokec2 (tokenPercent \cf7 \strokec7 >=\cf2 \strokec2 \cf5 \strokec5 80\cf2 \strokec2 ) warnings.\cf7 \strokec7 push\cf2 \strokec2 (`$\{(usage.tokens/1000).toFixed(0)\}\cf6 \strokec6 K/\cf2 \strokec2 $\{LIMITS.maxTokens/1000\}\cf6 \strokec6 K tokens used\cf2 \strokec2 `);\ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'warningText'\cf2 \strokec2 ).textContent \cf7 \strokec7 =\cf2 \strokec2 warnings.\cf7 \strokec7 join\cf2 \strokec2 (\cf6 \strokec6 ', '\cf2 \strokec2 );\ \} \cf9 \strokec9 else\cf2 \strokec2 \{\ warningBanner.classList.\cf7 \strokec7 remove\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \}\ \ \cf9 \strokec9 return\cf2 \strokec2 \cf5 \strokec5 true\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 resetUsage\cf2 \strokec2 () \{\ \cf9 \strokec9 const\cf2 \strokec2 confirmDiv \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'errorMessage'\cf2 \strokec2 );\ confirmDiv.innerHTML \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 '\uc0\u9888 \u65039 Reset usage statistics? '\cf2 \strokec2 ;\ confirmDiv.classList.\cf7 \strokec7 add\cf2 \strokec2 (\cf6 \strokec6 'show'\cf2 \strokec2 );\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 confirmReset\cf2 \strokec2 () \{\ \cf7 \strokec7 resetUsageData\cf2 \strokec2 ();\ \cf7 \strokec7 updateUsageDisplay\cf2 \strokec2 ();\ \cf7 \strokec7 showSuccess\cf2 \strokec2 (\cf6 \strokec6 'Usage statistics have been reset.'\cf2 \strokec2 );\ \}\ \ \cf9 \strokec9 async\cf2 \strokec2 \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 analyzeObservation\cf2 \strokec2 () \{\ \cf7 \strokec7 hideMessages\cf2 \strokec2 ();\ \ \f1\i \cf8 \strokec8 // Check API key \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !\cf5 \strokec5 API_KEY\cf2 \strokec2 ) \{\ \cf7 \strokec7 showError\cf2 \strokec2 (\cf6 \strokec6 'API key not configured. To set up: 1) Open browser console (F12), 2) Run: encodeApiKey("sk-ant-your-key"), 3) Copy the encoded result, 4) Paste into ENCODED_KEY in the code'\cf2 \strokec2 );\ \cf9 \strokec9 return\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 const\cf2 \strokec2 observationText \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'observationText'\cf2 \strokec2 ).value.\cf7 \strokec7 trim\cf2 \strokec2 ();\ \ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !\cf2 \strokec2 observationText) \{\ \cf7 \strokec7 showError\cf2 \strokec2 (\cf6 \strokec6 'Please enter observation notes'\cf2 \strokec2 );\ \cf9 \strokec9 return\cf2 \strokec2 ;\ \}\ \ \f1\i \cf8 \strokec8 // Check limits \f0\i0 \cf2 \strokec2 \ \cf9 \strokec9 const\cf2 \strokec2 usage \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 getUsageData\cf2 \strokec2 ();\ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !checkLimits\cf2 \strokec2 (usage)) \{\ \cf9 \strokec9 return\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 const\cf2 \strokec2 analyzeBtn \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'analyzeBtn'\cf2 \strokec2 );\ analyzeBtn.disabled \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 true\cf2 \strokec2 ;\ analyzeBtn.textContent \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 '\uc0\u55357 \u56580 Analyzing...'\cf2 \strokec2 ;\ \ \cf9 \strokec9 const\cf2 \strokec2 startTime \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 .\cf7 \strokec7 now\cf2 \strokec2 ();\ \ \cf9 \strokec9 try\cf2 \strokec2 \{\ \cf9 \strokec9 const\cf2 \strokec2 response \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 await\cf2 \strokec2 \cf7 \strokec7 fetch\cf2 \strokec2 (\cf6 \strokec6 'https://api.anthropic.com/v1/messages'\cf2 \strokec2 , \{\ \cf4 \strokec4 method\cf7 \strokec7 :\cf2 \strokec2 \cf6 \strokec6 'POST'\cf2 \strokec2 ,\ \cf4 \strokec4 headers\cf7 \strokec7 :\cf2 \strokec2 \{\ \cf4 \strokec4 'Content-Type'\cf7 \strokec7 :\cf2 \strokec2 \cf6 \strokec6 'application/json'\cf2 \strokec2 ,\ \cf4 \strokec4 'x-api-key'\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 API_KEY\cf2 \strokec2 ,\ \cf4 \strokec4 'anthropic-version'\cf7 \strokec7 :\cf2 \strokec2 \cf6 \strokec6 '2023-06-01'\cf2 \strokec2 \ \},\ \cf4 \strokec4 body\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 JSON\cf2 \strokec2 .\cf7 \strokec7 stringify\cf2 \strokec2 (\{\ \cf4 \strokec4 model\cf7 \strokec7 :\cf2 \strokec2 \cf6 \strokec6 'claude-sonnet-4-20250514'\cf2 \strokec2 ,\ \cf4 \strokec4 max_tokens\cf7 \strokec7 :\cf2 \strokec2 \cf5 \strokec5 4000\cf2 \strokec2 ,\ \cf4 \strokec4 messages\cf7 \strokec7 :\cf2 \strokec2 [\{\ \cf4 \strokec4 role\cf7 \strokec7 :\cf2 \strokec2 \cf6 \strokec6 'user'\cf2 \strokec2 ,\ \cf4 \strokec4 content\cf7 \strokec7 :\cf2 \strokec2 `\cf6 \strokec6 You are an expert T-TESS evaluator. Analyze this classroom observation and provide ratings for all 16 dimensions across 4 domains.\ \cf2 \strokec2 \ Observation Notes:\ $\{observationText\}\cf6 \strokec6 \ \cf2 \strokec2 \ Provide your analysis in this exact JSON format:\ \{\ "dimensions": [\ \{\ "domain": "Planning",\ "dimension": "1.1 Standards and Alignment",\ "rating": "Distinguished/Accomplished/Proficient/Developing/Improvement Needed",\ "evidence": "Specific evidence from observation"\ \},\ \{\ "domain": "Planning",\ "dimension": "1.2 Data and Assessment",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Planning",\ "dimension": "1.3 Knowledge of Students",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Planning",\ "dimension": "1.4 Activities",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Instruction",\ "dimension": "2.1 Achieving Expectations",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Instruction",\ "dimension": "2.2 Content Knowledge and Expertise",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Instruction",\ "dimension": "2.3 Communication",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Instruction",\ "dimension": "2.4 Differentiation",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Instruction",\ "dimension": "2.5 Monitor and Adjust",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Learning Environment",\ "dimension": "3.1 Classroom Environment, Routines and Procedures",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Learning Environment",\ "dimension": "3.2 Managing Student Behavior",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Learning Environment",\ "dimension": "3.3 Classroom Culture",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Professional Practices and Responsibilities",\ "dimension": "4.1 Professional Demeanor and Ethics",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Professional Practices and Responsibilities",\ "dimension": "4.2 Goal Setting",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Professional Practices and Responsibilities",\ "dimension": "4.3 Professional Development",\ "rating": "...",\ "evidence": "..."\ \},\ \{\ "domain": "Professional Practices and Responsibilities",\ "dimension": "4.4 School Community Involvement",\ "rating": "...",\ "evidence": "..."\ \}\ ],\ "reinforcement_plan": \{\ "strengths": ["strength 1", "strength 2", "strength 3"],\ "recommendations": ["recommendation 1", "recommendation 2"]\ \},\ "refinement_plan": \{\ "areas_for_growth": ["area 1", "area 2"],\ "action_steps": ["step 1", "step 2", "step 3"]\ \}\ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6 \}\cf2 \strokec2 `\ \}]\ \})\ \});\ \ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !\cf2 \strokec2 response.ok) \{\ \cf9 \strokec9 throw\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Error\cf2 \strokec2 (`\cf6 \strokec6 API Error: \cf2 \strokec2 $\{response.status\}`);\ \}\ \ \cf9 \strokec9 const\cf2 \strokec2 data \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 await\cf2 \strokec2 response.\cf7 \strokec7 json\cf2 \strokec2 ();\ \cf9 \strokec9 const\cf2 \strokec2 endTime \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 .\cf7 \strokec7 now\cf2 \strokec2 ();\ \cf9 \strokec9 const\cf2 \strokec2 processingTime \cf7 \strokec7 =\cf2 \strokec2 ((endTime \cf7 \strokec7 -\cf2 \strokec2 startTime) \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 1000\cf2 \strokec2 ).\cf7 \strokec7 toFixed\cf2 \strokec2 (\cf5 \strokec5 2\cf2 \strokec2 );\ \ \cf9 \strokec9 const\cf2 \strokec2 content \cf7 \strokec7 =\cf2 \strokec2 data.content[\cf5 \strokec5 0\cf2 \strokec2 ].text;\ \cf9 \strokec9 const\cf2 \strokec2 jsonMatch \cf7 \strokec7 =\cf2 \strokec2 content.\cf7 \strokec7 match\cf2 \strokec2 (\cf6 \strokec6 /\\\{[\\s\\S]*\\\}/\cf2 \strokec2 );\ \cf9 \strokec9 const\cf2 \strokec2 analysisData \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 JSON\cf2 \strokec2 .\cf7 \strokec7 parse\cf2 \strokec2 (jsonMatch[\cf5 \strokec5 0\cf2 \strokec2 ]);\ \ \cf9 \strokec9 const\cf2 \strokec2 inputTokens \cf7 \strokec7 =\cf2 \strokec2 data.usage.input_tokens;\ \cf9 \strokec9 const\cf2 \strokec2 outputTokens \cf7 \strokec7 =\cf2 \strokec2 data.usage.output_tokens;\ \cf9 \strokec9 const\cf2 \strokec2 totalTokens \cf7 \strokec7 =\cf2 \strokec2 inputTokens \cf7 \strokec7 +\cf2 \strokec2 outputTokens;\ \cf9 \strokec9 const\cf2 \strokec2 estimatedCost \cf7 \strokec7 =\cf2 \strokec2 ((inputTokens \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 0.003\cf2 \strokec2 \cf7 \strokec7 +\cf2 \strokec2 outputTokens \cf7 \strokec7 *\cf2 \strokec2 \cf5 \strokec5 0.015\cf2 \strokec2 ) \cf7 \strokec7 /\cf2 \strokec2 \cf5 \strokec5 1000\cf2 \strokec2 );\ \cf9 \strokec9 const\cf2 \strokec2 wordCount \cf7 \strokec7 =\cf2 \strokec2 observationText.\cf7 \strokec7 split\cf2 \strokec2 (\cf6 \strokec6 /\\s+/\cf2 \strokec2 ).length;\ \ \f1\i \cf8 \strokec8 // Update usage tracking \f0\i0 \cf2 \strokec2 \ \cf7 \strokec7 updateUsageData\cf2 \strokec2 (\cf5 \strokec5 1\cf2 \strokec2 , estimatedCost, totalTokens);\ \ analysisResults \cf7 \strokec7 =\cf2 \strokec2 \{\ \cf7 \strokec7 ...\cf2 \strokec2 analysisData,\ \cf4 \strokec4 metadata\cf7 \strokec7 :\cf2 \strokec2 \{\ sessionId,\ inputTokens,\ outputTokens,\ totalTokens,\ \cf4 \strokec4 estimatedCost\cf7 \strokec7 :\cf2 \strokec2 estimatedCost.\cf7 \strokec7 toFixed\cf2 \strokec2 (\cf5 \strokec5 4\cf2 \strokec2 ),\ processingTime,\ wordCount,\ \cf4 \strokec4 timestamp\cf7 \strokec7 :\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Date\cf2 \strokec2 ().\cf7 \strokec7 toLocaleString\cf2 \strokec2 ()\ \}\ \};\ \ \cf7 \strokec7 displayResults\cf2 \strokec2 (analysisResults);\ \ \} \cf9 \strokec9 catch\cf2 \strokec2 (error) \{\ \cf7 \strokec7 showError\cf2 \strokec2 (\cf6 \strokec6 'Failed to analyze observation: '\cf2 \strokec2 \cf7 \strokec7 +\cf2 \strokec2 error.message);\ \cf5 \strokec5 console\cf2 \strokec2 .\cf7 \strokec7 error\cf2 \strokec2 (\cf6 \strokec6 'Analysis error:'\cf2 \strokec2 , error);\ \} \cf9 \strokec9 finally\cf2 \strokec2 \{\ analyzeBtn.disabled \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 false\cf2 \strokec2 ;\ analyzeBtn.textContent \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 '\uc0\u55357 \u56589 Analyze with Claude AI'\cf2 \strokec2 ;\ \}\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 displayResults\cf2 \strokec2 (results) \{\ \cf9 \strokec9 const\cf2 \strokec2 costDashboard \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'costDashboard'\cf2 \strokec2 );\ costDashboard.innerHTML \cf7 \strokec7 =\cf2 \strokec2 `\
\

Input Tokens

\
$\{results.metadata.inputTokens.toLocaleString()\}
\
\
\

Output Tokens

\
$\{results.metadata.outputTokens.toLocaleString()\}
\
\
\

Total Cost

\
$$\{results.metadata.estimatedCost\}
\
\
\

Processing Time

\
$\{results.metadata.processingTime\}s
\
\
\

Word Count

\
$\{results.metadata.wordCount\}
\
\ `;\ \ \cf9 \strokec9 const\cf2 \strokec2 ttessTable \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'ttessTableContainer'\cf2 \strokec2 );\ \cf9 \strokec9 let\cf2 \strokec2 tableHTML \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 ''\cf2 \strokec2 ;\ \ \cf9 \strokec9 let\cf2 \strokec2 currentDomain \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 ''\cf2 \strokec2 ;\ results.dimensions.\cf7 \strokec7 forEach\cf2 \strokec2 (dim \cf7 \strokec7 =>\cf2 \strokec2 \{\ \cf9 \strokec9 if\cf2 \strokec2 (dim.domain \cf7 \strokec7 !==\cf2 \strokec2 currentDomain) \{\ tableHTML \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \cf2 \strokec2 `;\ currentDomain \cf7 \strokec7 =\cf2 \strokec2 dim.domain;\ \}\ tableHTML \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \cf2 \strokec2 `;\ \});\ \ tableHTML \cf7 \strokec7 +=\cf2 \strokec2 \cf6 \strokec6 '
DomainDimensionRatingEvidence
\cf2 \strokec2 $\{dim.domain\}\cf6 \strokec6
\cf2 \strokec2 $\{dim.dimension\}\cf6 \strokec6 \cf2 \strokec2 $\{dim.rating\}\cf6 \strokec6 \cf2 \strokec2 $\{dim.evidence\}\cf6 \strokec6
'\cf2 \strokec2 ;\ ttessTable.innerHTML \cf7 \strokec7 =\cf2 \strokec2 tableHTML;\ \ \cf9 \strokec9 const\cf2 \strokec2 plansContainer \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'plansContainer'\cf2 \strokec2 );\ plansContainer.innerHTML \cf7 \strokec7 =\cf2 \strokec2 `\
\

\uc0\u55357 \u56490 Reinforcement Plan

\

Strengths:

\ \

Recommendations:

\ \
\
\

\uc0\u55356 \u57263 Refinement Plan

\

Areas for Growth:

\ \

Action Steps:

\ \
\ `;\ \ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'sessionInfo'\cf2 \strokec2 ).innerHTML \cf7 \strokec7 =\cf2 \strokec2 `\ Session ID: $\{results.metadata.sessionId\} | Generated: $\{results.metadata.timestamp\}\ `;\ \ \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'results'\cf2 \strokec2 ).style.display \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 'block'\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 exportToPDF\cf2 \strokec2 () \{\ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !\cf2 \strokec2 analysisResults) \{\ \cf7 \strokec7 showError\cf2 \strokec2 (\cf6 \strokec6 'No analysis results to export'\cf2 \strokec2 );\ \cf9 \strokec9 return\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 const\cf2 \strokec2 checkbox \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'includeCostAnalysis'\cf2 \strokec2 );\ \cf9 \strokec9 const\cf2 \strokec2 includeCost \cf7 \strokec7 =\cf2 \strokec2 checkbox.checked;\ \ \cf9 \strokec9 let\cf2 \strokec2 currentDomain \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 ''\cf2 \strokec2 ;\ \cf9 \strokec9 let\cf2 \strokec2 tableRows \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 ''\cf2 \strokec2 ;\ \ analysisResults.dimensions.\cf7 \strokec7 forEach\cf2 \strokec2 (dim \cf7 \strokec7 =>\cf2 \strokec2 \{\ \cf9 \strokec9 if\cf2 \strokec2 (dim.domain \cf7 \strokec7 !==\cf2 \strokec2 currentDomain) \{\ tableRows \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \cf2 \strokec2 $\{dim.domain\}\cf6 \strokec6 \cf2 \strokec2 `;\ currentDomain \cf7 \strokec7 =\cf2 \strokec2 dim.domain;\ \}\ tableRows \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \cf2 \strokec2 $\{dim.dimension\}\cf6 \strokec6 \cf2 \strokec2 $\{dim.rating\}\cf6 \strokec6 \cf2 \strokec2 $\{dim.evidence\}\cf6 \strokec6 \cf2 \strokec2 `;\ \});\ \ \cf9 \strokec9 let\cf2 \strokec2 htmlContent \cf7 \strokec7 =\cf2 \strokec2 `\cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2 \ \ \ \ T-TESS Analysis Report\ \ \ \
\

\uc0\u55356 \u57235 T-TESS Observation Analysis Report

\
\ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6

Session ID: \cf2 \strokec2 $\{analysisResults.metadata.sessionId\}\cf6 \strokec6

\

Generated: \cf2 \strokec2 $\{analysisResults.metadata.timestamp\}\cf6 \strokec6

\
\cf2 \strokec2 `;\ \ \cf9 \strokec9 if\cf2 \strokec2 (includeCost) \{\ htmlContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2

\uc0\u55357 \u56522 Cost Analysis

\
\ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6

Input Tokens

\cf2 \strokec2 $\{analysisResults.metadata.inputTokens.toLocaleString()\}\cf6 \strokec6
\

Output Tokens

\cf2 \strokec2 $\{analysisResults.metadata.outputTokens.toLocaleString()\}\cf6 \strokec6
\

Total Cost

\cf2 \strokec2 $\{analysisResults.metadata.estimatedCost\}\cf6 \strokec6
\

Processing Time

\cf2 \strokec2 $\{analysisResults.metadata.processingTime\}\cf6 \strokec6 s
\

Word Count

\cf2 \strokec2 $\{analysisResults.metadata.wordCount\}\cf6 \strokec6
\
\cf2 \strokec2 `;\ \}\ \ htmlContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2

\uc0\u55357 \u56523 T-TESS Dimensions Analysis

\ \ \ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6 \cf2 \strokec2 $\{tableRows\}\cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2
DomainDimensionRatingEvidence
\
\

\uc0\u55357 \u56490 Reinforcement Plan

\

Strengths:

\ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2

Recommendations:

\ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2
\
\

\uc0\u55356 \u57263 Refinement Plan

\

Areas for Growth:

\ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2

Action Steps:

\ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6 \ \pard\pardeftab720\partightenfactor0 \cf2 \strokec2
\
\ \ \pard\pardeftab720\partightenfactor0 \cf6 \strokec6 \cf2 \strokec2 `;\ \ \cf9 \strokec9 const\cf2 \strokec2 blob \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Blob\cf2 \strokec2 ([htmlContent], \{ \cf4 \strokec4 type\cf7 \strokec7 :\cf2 \strokec2 \cf6 \strokec6 'text/html;charset=utf-8'\cf2 \strokec2 \});\ \cf9 \strokec9 const\cf2 \strokec2 url \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 URL\cf2 \strokec2 .\cf7 \strokec7 createObjectURL\cf2 \strokec2 (blob);\ \cf9 \strokec9 const\cf2 \strokec2 a \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 createElement\cf2 \strokec2 (\cf6 \strokec6 'a'\cf2 \strokec2 );\ a.href \cf7 \strokec7 =\cf2 \strokec2 url;\ a.download \cf7 \strokec7 =\cf2 \strokec2 `\cf6 \strokec6 TTESS_Report_\cf2 \strokec2 $\{analysisResults.metadata.sessionId\}\cf6 \strokec6 .html\cf2 \strokec2 `;\ \cf7 \strokec7 document\cf2 \strokec2 .body.\cf7 \strokec7 appendChild\cf2 \strokec2 (a);\ a.\cf7 \strokec7 click\cf2 \strokec2 ();\ \cf7 \strokec7 document\cf2 \strokec2 .body.\cf7 \strokec7 removeChild\cf2 \strokec2 (a);\ \cf5 \strokec5 URL\cf2 \strokec2 .\cf7 \strokec7 revokeObjectURL\cf2 \strokec2 (url);\ \ \cf7 \strokec7 showSuccess\cf2 \strokec2 (\cf6 \strokec6 'HTML report downloaded successfully!'\cf2 \strokec2 );\ \}\ \ \cf9 \strokec9 function\cf2 \strokec2 \cf7 \strokec7 exportToText\cf2 \strokec2 () \{\ \cf9 \strokec9 if\cf2 \strokec2 (\cf7 \strokec7 !\cf2 \strokec2 analysisResults) \{\ \cf7 \strokec7 showError\cf2 \strokec2 (\cf6 \strokec6 'No analysis results to export'\cf2 \strokec2 );\ \cf9 \strokec9 return\cf2 \strokec2 ;\ \}\ \ \cf9 \strokec9 const\cf2 \strokec2 checkbox \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 getElementById\cf2 \strokec2 (\cf6 \strokec6 'includeCostAnalysis'\cf2 \strokec2 );\ \cf9 \strokec9 const\cf2 \strokec2 includeCost \cf7 \strokec7 =\cf2 \strokec2 checkbox.checked;\ \ \cf9 \strokec9 let\cf2 \strokec2 textContent \cf7 \strokec7 =\cf2 \strokec2 `\cf6 \strokec6 T-TESS OBSERVATION ANALYSIS REPORT\\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `$\{'='.repeat(80)\}\cf6 \strokec6 \\n\\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Session ID: \cf2 \strokec2 $\{analysisResults.metadata.sessionId\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Generated: \cf2 \strokec2 $\{analysisResults.metadata.timestamp\}\cf6 \strokec6 \\n\\n\cf2 \strokec2 `;\ \ \cf9 \strokec9 if\cf2 \strokec2 (includeCost) \{\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 COST ANALYSIS\\n\cf2 \strokec2 $\{'-'.repeat(80)\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Input Tokens: \cf2 \strokec2 $\{analysisResults.metadata.inputTokens\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Output Tokens: \cf2 \strokec2 $\{analysisResults.metadata.outputTokens\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Total Cost: \cf2 \strokec2 $\{analysisResults.metadata.estimatedCost\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Processing Time: \cf2 \strokec2 $\{analysisResults.metadata.processingTime\}\cf6 \strokec6 s\\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Word Count: \cf2 \strokec2 $\{analysisResults.metadata.wordCount\}\cf6 \strokec6 \\n\\n\cf2 \strokec2 `;\ \}\ \ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 T-TESS DIMENSIONS\\n\cf2 \strokec2 $\{'='.repeat(80)\}\cf6 \strokec6 \\n\\n\cf2 \strokec2 `;\ \ \cf9 \strokec9 let\cf2 \strokec2 currentDomain \cf7 \strokec7 =\cf2 \strokec2 \cf6 \strokec6 ''\cf2 \strokec2 ;\ analysisResults.dimensions.\cf7 \strokec7 forEach\cf2 \strokec2 (dim \cf7 \strokec7 =>\cf2 \strokec2 \{\ \cf9 \strokec9 if\cf2 \strokec2 (dim.domain \cf7 \strokec7 !==\cf2 \strokec2 currentDomain) \{\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \\n\cf2 \strokec2 $\{dim.domain.toUpperCase()\}\cf6 \strokec6 \\n\cf2 \strokec2 $\{'-'.repeat(80)\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ currentDomain \cf7 \strokec7 =\cf2 \strokec2 dim.domain;\ \}\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \\n\cf2 \strokec2 $\{dim.dimension\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Rating: \cf2 \strokec2 $\{dim.rating\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Evidence: \cf2 \strokec2 $\{dim.evidence\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ \});\ \ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \\n\\nREINFORCEMENT PLAN\\n\cf2 \strokec2 $\{'='.repeat(80)\}\cf6 \strokec6 \\n\\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Strengths:\\n\cf2 \strokec2 `;\ analysisResults.reinforcement_plan.strengths.\cf7 \strokec7 forEach\cf2 \strokec2 ((s, i) \cf7 \strokec7 =>\cf2 \strokec2 \{\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `$\{i + 1\}\cf6 \strokec6 . \cf2 \strokec2 $\{s\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ \});\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \\nRecommendations:\\n\cf2 \strokec2 `;\ analysisResults.reinforcement_plan.recommendations.\cf7 \strokec7 forEach\cf2 \strokec2 ((r, i) \cf7 \strokec7 =>\cf2 \strokec2 \{\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `$\{i + 1\}\cf6 \strokec6 . \cf2 \strokec2 $\{r\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ \});\ \ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \\n\\nREFINEMENT PLAN\\n\cf2 \strokec2 $\{'='.repeat(80)\}\cf6 \strokec6 \\n\\n\cf2 \strokec2 `;\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 Areas for Growth:\\n\cf2 \strokec2 `;\ analysisResults.refinement_plan.areas_for_growth.\cf7 \strokec7 forEach\cf2 \strokec2 ((a, i) \cf7 \strokec7 =>\cf2 \strokec2 \{\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `$\{i + 1\}\cf6 \strokec6 . \cf2 \strokec2 $\{a\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ \});\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `\cf6 \strokec6 \\nAction Steps:\\n\cf2 \strokec2 `;\ analysisResults.refinement_plan.action_steps.\cf7 \strokec7 forEach\cf2 \strokec2 ((s, i) \cf7 \strokec7 =>\cf2 \strokec2 \{\ textContent \cf7 \strokec7 +=\cf2 \strokec2 `$\{i + 1\}\cf6 \strokec6 . \cf2 \strokec2 $\{s\}\cf6 \strokec6 \\n\cf2 \strokec2 `;\ \});\ \ \cf9 \strokec9 const\cf2 \strokec2 blob \cf7 \strokec7 =\cf2 \strokec2 \cf9 \strokec9 new\cf2 \strokec2 \cf5 \strokec5 Blob\cf2 \strokec2 ([textContent], \{ \cf4 \strokec4 type\cf7 \strokec7 :\cf2 \strokec2 \cf6 \strokec6 'text/plain;charset=utf-8'\cf2 \strokec2 \});\ \cf9 \strokec9 const\cf2 \strokec2 url \cf7 \strokec7 =\cf2 \strokec2 \cf5 \strokec5 URL\cf2 \strokec2 .\cf7 \strokec7 createObjectURL\cf2 \strokec2 (blob);\ \cf9 \strokec9 const\cf2 \strokec2 a \cf7 \strokec7 =\cf2 \strokec2 \cf7 \strokec7 document\cf2 \strokec2 .\cf7 \strokec7 createElement\cf2 \strokec2 (\cf6 \strokec6 'a'\cf2 \strokec2 );\ a.href \cf7 \strokec7 =\cf2 \strokec2 url;\ a.download \cf7 \strokec7 =\cf2 \strokec2 `\cf6 \strokec6 TTESS_Report_\cf2 \strokec2 $\{analysisResults.metadata.sessionId\}\cf6 \strokec6 .txt\cf2 \strokec2 `;\ \cf7 \strokec7 document\cf2 \strokec2 .body.\cf7 \strokec7 appendChild\cf2 \strokec2 (a);\ a.\cf7 \strokec7 click\cf2 \strokec2 ();\ \cf7 \strokec7 document\cf2 \strokec2 .body.\cf7 \strokec7 removeChild\cf2 \strokec2 (a);\ \cf5 \strokec5 URL\cf2 \strokec2 .\cf7 \strokec7 revokeObjectURL\cf2 \strokec2 (url);\ \ \cf7 \strokec7 showSuccess\cf2 \strokec2 (\cf6 \strokec6 'Text report downloaded successfully!'\cf2 \strokec2 );\ \}\ \ \f1\i \cf8 \strokec8 // Initialize on page load \f0\i0 \cf2 \strokec2 \ \cf7 \strokec7 updateUsageDisplay\cf2 \strokec2 ();\ \ \ }