*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.-bottom-12{bottom:-3rem}.-bottom-4{bottom:-1rem}.-bottom-6{bottom:-1.5rem}.-bottom-8{bottom:-2rem}.-left-10{left:-2.5rem}.-left-4{left:-1rem}.-left-6{left:-1.5rem}.-left-8{left:-2rem}.-right-12{right:-3rem}.-right-4{right:-1rem}.-right-5{right:-1.25rem}.-right-8{right:-2rem}.-top-10{top:-2.5rem}.-top-4{top:-1rem}.-top-5{top:-1.25rem}.-top-8{top:-2rem}.right-4{right:1rem}.top-4{top:1rem}.z-0{z-index:0}.z-10{z-index:10}.order-1{order:1}.order-2{order:2}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-3{margin-left:.75rem}.mr-2{margin-right:.5rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-20{margin-top:5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.\!inline{display:inline!important}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.aspect-video{aspect-ratio:16 / 9}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-12{height:3rem}.h-2{height:.5rem}.h-20{height:5rem}.h-24{height:6rem}.h-28{height:7rem}.h-32{height:8rem}.h-36{height:9rem}.h-4{height:1rem}.h-40{height:10rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-full{height:100%}.min-h-screen{min-height:100vh}.w-12{width:3rem}.w-20{width:5rem}.w-24{width:6rem}.w-28{width:7rem}.w-32{width:8rem}.w-36{width:9rem}.w-4{width:1rem}.w-40{width:10rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-full{width:100%}.min-w-\[84px\]{min-width:84px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.flex-shrink-0{flex-shrink:0}.-rotate-12{--tw-rotate: -12deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-12{--tw-rotate: 12deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.animate-spin{animation:spin 1s linear infinite}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.resize{resize:both}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-r-lg{border-top-right-radius:.5rem;border-bottom-right-radius:.5rem}.border{border-width:1px}.border-2{border-width:2px}.border-8{border-width:8px}.border-\[10px\]{border-width:10px}.border-l-4{border-left-width:4px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.border-primary\/20{border-color:#00827f33}.border-teal-200{--tw-border-opacity: 1;border-color:rgb(153 246 228 / var(--tw-border-opacity, 1))}.border-teal-500{--tw-border-opacity: 1;border-color:rgb(20 184 166 / var(--tw-border-opacity, 1))}.border-white{--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1))}.border-yellow-200{--tw-border-opacity: 1;border-color:rgb(254 240 138 / var(--tw-border-opacity, 1))}.border-yellow-400{--tw-border-opacity: 1;border-color:rgb(250 204 21 / var(--tw-border-opacity, 1))}.border-t-transparent{border-top-color:transparent}.bg-background-light{--tw-bg-opacity: 1;background-color:rgb(245 248 248 / var(--tw-bg-opacity, 1))}.bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-gray-400{--tw-bg-opacity: 1;background-color:rgb(156 163 175 / var(--tw-bg-opacity, 1))}.bg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.bg-gray-800{--tw-bg-opacity: 1;background-color:rgb(31 41 55 / var(--tw-bg-opacity, 1))}.bg-primary{--tw-bg-opacity: 1;background-color:rgb(0 130 127 / var(--tw-bg-opacity, 1))}.bg-primary\/10{background-color:#00827f1a}.bg-primary\/20{background-color:#00827f33}.bg-primary\/5{background-color:#00827f0d}.bg-teal-100{--tw-bg-opacity: 1;background-color:rgb(204 251 241 / var(--tw-bg-opacity, 1))}.bg-teal-50{--tw-bg-opacity: 1;background-color:rgb(240 253 250 / var(--tw-bg-opacity, 1))}.bg-teal-500{--tw-bg-opacity: 1;background-color:rgb(20 184 166 / var(--tw-bg-opacity, 1))}.bg-teal-600{--tw-bg-opacity: 1;background-color:rgb(13 148 136 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.bg-yellow-50{--tw-bg-opacity: 1;background-color:rgb(254 252 232 / var(--tw-bg-opacity, 1))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-black\/70{--tw-gradient-from: rgb(0 0 0 / .7) var(--tw-gradient-from-position);--tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-teal-50{--tw-gradient-from: #f0fdfa var(--tw-gradient-from-position);--tw-gradient-to: rgb(240 253 250 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.via-black\/40{--tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / .4) var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-cyan-50{--tw-gradient-to: #ecfeff var(--tw-gradient-to-position)}.to-emerald-50{--tw-gradient-to: #ecfdf5 var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position)}.object-cover{-o-object-fit:cover;object-fit:cover}.p-10{padding:2.5rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-24{padding-top:6rem;padding-bottom:6rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pt-8{padding-top:2rem}.text-left{text-align:left}.text-center{text-align:center}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.leading-snug{line-height:1.375}.leading-tight{line-height:1.25}.tracking-tight{letter-spacing:-.025em}.tracking-widest{letter-spacing:.1em}.text-gray-200{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity, 1))}.text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.text-gray-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity, 1))}.text-primary{--tw-text-opacity: 1;color:rgb(0 130 127 / var(--tw-text-opacity, 1))}.text-teal-600{--tw-text-opacity: 1;color:rgb(13 148 136 / var(--tw-text-opacity, 1))}.text-teal-700{--tw-text-opacity: 1;color:rgb(15 118 110 / var(--tw-text-opacity, 1))}.text-text-dark{--tw-text-opacity: 1;color:rgb(10 20 20 / var(--tw-text-opacity, 1))}.text-text-light{--tw-text-opacity: 1;color:rgb(88 98 98 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.text-yellow-500{--tw-text-opacity: 1;color:rgb(234 179 8 / var(--tw-text-opacity, 1))}.text-yellow-600{--tw-text-opacity: 1;color:rgb(202 138 4 / var(--tw-text-opacity, 1))}.text-yellow-800{--tw-text-opacity: 1;color:rgb(133 77 14 / var(--tw-text-opacity, 1))}.opacity-60{opacity:.6}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline{outline-style:solid}.ring-1{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ring-gray-200{--tw-ring-opacity: 1;--tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity, 1))}.ring-teal-500{--tw-ring-opacity: 1;--tw-ring-color: rgb(20 184 166 / var(--tw-ring-opacity, 1))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}:root{--font-roboto: "Roboto", sans-serif;--font-noto-sc: "Noto Sans SC", sans-serif;--font-noto-thai: "Noto Sans Thai", sans-serif;--primary-color: #00827F;--background-light: #F5F8F8;--text-light: #586262;--text-dark: #0A1414;--border-color: #E2E8F0}body{font-family:var(--font-roboto);overflow-x:hidden;background-color:var(--background-light);margin:0;min-height:100vh}#root{min-height:100vh;display:flex;flex-direction:column}@keyframes subtle-glow{0%{box-shadow:0 0 8px #00827f4d}50%{box-shadow:0 0 16px 2px #00827f80}to{box-shadow:0 0 8px #00827f4d}}.glow-on-hover:hover{animation:subtle-glow 2s ease-in-out infinite}.animate-on-scroll{opacity:0;transform:translateY(30px);transition:opacity .6s ease-out,transform .6s ease-out}.animate-on-scroll.is-visible{opacity:1;transform:translateY(0)}*{box-sizing:border-box}button{border:none;background:none;cursor:pointer;font-family:inherit}img{max-width:100%;height:auto}.material-symbols-outlined{font-family:Material Symbols Outlined!important;font-variation-settings:"FILL" 1,"wght" 500,"GRAD" 0,"opsz" 24!important;font-size:24px;line-height:1;display:inline-block;vertical-align:middle;font-weight:400;font-style:normal;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:"liga"}.hover\:-translate-y-2:hover{--tw-translate-y: -.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:scale-105:hover{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:bg-teal-700:hover{--tw-bg-opacity: 1;background-color:rgb(15 118 110 / var(--tw-bg-opacity, 1))}.hover\:text-primary:hover{--tw-text-opacity: 1;color:rgb(0 130 127 / var(--tw-text-opacity, 1))}.hover\:shadow-lg:hover{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:shadow-sm:hover{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:shadow-xl:hover{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.focus\:ring-teal-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(20 184 166 / var(--tw-ring-opacity, 1))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:hover\:scale-100:hover:disabled{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@media (min-width: 640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:space-y-0>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}.sm\:p-8{padding:2rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:py-24{padding-top:6rem;padding-bottom:6rem}.sm\:py-32{padding-top:8rem;padding-bottom:8rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-6xl{font-size:3.75rem;line-height:1}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width: 768px){.md\:order-1{order:1}.md\:order-2{order:2}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:text-left{text-align:left}}@media (min-width: 1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:gap-16{gap:4rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}}@media (min-width: 1280px){.xl\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}.app{min-height:100vh;display:flex;flex-direction:column;background-color:var(--background-light)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-roboto);line-height:1.6;color:var(--text-dark);background-color:var(--background-light)}@media (max-width: 768px){.app{font-size:14px}}button{cursor:pointer;border:none;outline:none;font-family:inherit}a{text-decoration:none;color:inherit}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.lang-switch{position:relative;display:inline-block;width:74px;height:34px}.lang-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#e2e8f0;transition:.4s;border-radius:34px;display:flex;align-items:center;justify-content:space-between;padding:0 8px}.slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.4s;border-radius:50%;box-shadow:0 0 2px #0003}input:checked+.slider{background-color:var(--primary-color, #00827F)}input:checked+.slider:before{transform:translate(40px)}.slider-text-zh,.slider-text-th{font-weight:700;font-size:14px;transition:color .4s}.slider-text-zh{color:#fff;padding-left:4px}.slider-text-th{color:#a0aec0;padding-right:4px}input:checked+.slider .slider-text-zh{color:#a0aec0}input:checked+.slider .slider-text-th{color:#fff}.header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;white-space:nowrap;border-bottom:1px solid #e5e7eb;background-color:#fffffff2;padding:.75rem 1rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 1px 3px #0000001a;min-height:4rem}@media (min-width: 640px){.header{padding:.75rem 1.5rem}}@media (min-width: 1024px){.header{padding:.75rem 2.5rem}}.header-left{display:flex;align-items:center;gap:.75rem;color:var(--text-dark, #0A1414);flex-shrink:0}.logo-link{display:flex;align-items:center;gap:.75rem;text-decoration:none;padding:.25rem .5rem;border-radius:.5rem;transition:background-color .2s}.logo-link:hover{background-color:#00827f1a}.logo-icon{width:1.75rem;height:1.75rem;color:var(--primary-color, #00827F);flex-shrink:0}.logo-text{color:var(--text-dark, #0A1414);font-size:1.25rem;font-weight:700;margin:0;white-space:nowrap}@media (max-width: 480px){.logo-text{display:none}.logo-icon{width:2rem;height:2rem}}.desktop-nav{display:none;flex:1;align-items:center;justify-content:center;gap:2.25rem;margin:0 2rem}@media (min-width: 768px){.desktop-nav{display:flex}}@media (min-width: 768px) and (max-width: 1024px){.header{justify-content:center;position:relative}.header-left{position:absolute;left:1.5rem}.header-right{position:absolute;right:1.5rem}.desktop-nav{margin:0}}.nav-link{color:var(--text-light, #586262);font-size:.875rem;font-weight:500;text-decoration:none;transition:color .2s}.nav-link:hover{color:var(--primary-color, #00827F)}.nav-link.active{color:var(--primary-color, #00827F);font-weight:700}.header-right{display:none;align-items:center;gap:1rem}@media (min-width: 768px){.header-right{display:flex}}.login-btn{display:flex;min-width:84px;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;height:2.5rem;padding:0 1rem;background-color:var(--primary-color, #00827F);color:#fff;font-size:.875rem;font-weight:700;border:none;transition:transform .2s}.login-btn:hover{transform:scale(1.05)}.mobile-nav-toggle{display:block}@media (min-width: 768px){.mobile-nav-toggle{display:none}}.mobile-menu-btn{color:var(--text-dark, #0A1414);background:none;border:none;cursor:pointer}.menu-icon{width:1.5rem;height:1.5rem}.mobile-menu{position:absolute;top:61px;left:0;width:100%;background-color:#fffffffa;z-index:40;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 10px 15px -3px #0000001a}@media (min-width: 768px){.mobile-menu{display:none}}.mobile-nav{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem 0}.mobile-nav-link{color:var(--text-dark, #0A1414);font-weight:500;text-decoration:none;transition:color .2s}.mobile-nav-link:hover{color:var(--primary-color, #00827F)}.mobile-nav-link.active{color:var(--primary-color, #00827F);font-weight:700}.mobile-controls{display:flex;align-items:center;gap:1rem;margin-top:1rem}.hero-section-enhanced{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:2rem 1rem}.hero-background-animated{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.hero-bg-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;animation:ken-burns 20s ease-in-out infinite alternate}@keyframes ken-burns{0%{transform:scale(1)}to{transform:scale(1.1)}}.hero-overlay-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#00827fe6,#006b68d9 25%,#0a1414e6)}.hero-grid-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:50px 50px;opacity:.5}.hero-content-container{position:relative;z-index:10;max-width:1200px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2rem}.hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:50px;color:#fff;font-size:.875rem;font-weight:600;box-shadow:0 4px 12px #0000001a}.hero-badge .material-symbols-outlined{font-size:1.25rem;color:#fbbf24}.hero-title-section{max-width:900px}.hero-main-title{font-size:clamp(2.5rem,6vw,5rem);font-weight:900;line-height:1.2;color:#fff;margin:0 0 1.5rem;text-shadow:0 2px 20px rgba(0,0,0,.3);display:flex;flex-direction:column;gap:.5rem}.title-line{display:block;animation:slide-up .8s ease-out forwards;opacity:0}.title-line:nth-child(1){animation-delay:.2s}.title-line:nth-child(2){animation-delay:.4s}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.hero-subtitle-enhanced{font-size:clamp(1rem,2vw,1.25rem);color:#ffffffe6;line-height:1.6;max-width:700px;margin:0 auto}.hero-features-pills{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;max-width:800px}.feature-pill{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.25);border-radius:50px;color:#fff;font-size:.875rem;font-weight:500;transition:all .3s ease}.feature-pill:hover{background:#ffffff40;transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.feature-pill .material-symbols-outlined{font-size:1.125rem}.hero-cta-section{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:1rem}.hero-cta-primary,.hero-cta-secondary{display:inline-flex;align-items:center;gap:.5rem;padding:1rem 2rem;border-radius:12px;font-size:1rem;font-weight:700;transition:all .3s ease;cursor:pointer;border:none;position:relative;overflow:hidden}.hero-cta-primary{background:linear-gradient(135deg,#00a99f,#00827f);color:#fff;box-shadow:0 8px 24px #00827f66}.hero-cta-primary:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,rgba(255,255,255,.2) 0%,transparent 100%);opacity:0;transition:opacity .3s ease}.hero-cta-primary:hover:before{opacity:1}.hero-cta-primary:hover{transform:translateY(-2px);box-shadow:0 12px 32px #00827f80}.cta-arrow{transition:transform .3s ease;font-size:1.25rem}.hero-cta-primary:hover .cta-arrow{transform:translate(4px)}.hero-cta-secondary{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;border:2px solid rgba(255,255,255,.3)}.hero-cta-secondary:hover{background:#fff3;transform:translateY(-2px);box-shadow:0 8px 20px #00000026}.hero-stats{display:flex;gap:.875rem;margin-top:1.5rem;flex-wrap:wrap;justify-content:center;align-items:stretch}.hero-stats .stat-item{display:flex;flex-direction:row;align-items:center;gap:.875rem;padding:.875rem 1.25rem;background:linear-gradient(135deg,#ffffff26,#ffffff14);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);border-radius:12px;box-shadow:0 4px 16px #00000026;transition:all .4s cubic-bezier(.4,0,.2,1);opacity:.88;min-width:168px;flex:1;max-width:224px;cursor:default;position:relative;overflow:hidden}.hero-stats .stat-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);transition:left .6s ease}.hero-stats .stat-item:hover:before{left:100%}.hero-stats .stat-item.stat-active{opacity:1;background:linear-gradient(135deg,#ffffff38,#ffffff1f);border-color:#ffffff59;transform:translateY(-8px) scale(1.03);box-shadow:0 8px 24px #00000040,0 0 0 1px #ffffff1a inset}.hero-stats .stat-item .stat-icon{font-size:1.925rem;color:#fbbf24;flex-shrink:0;line-height:1;display:flex;align-items:center;justify-content:center;width:2.1rem;height:2.1rem;background:#fbbf2426;border-radius:8px;transition:all .3s ease;position:relative;z-index:1}.hero-stats .stat-item:hover .stat-icon{transform:scale(1.1) rotate(5deg);background:#fbbf2440}.hero-stats .stat-item .stat-content{flex:1;display:flex;flex-direction:column;gap:.25rem;justify-content:center;position:relative;z-index:1}.hero-stats .stat-item .stat-value{font-size:1.4rem;font-weight:900;color:#fff;line-height:1.1;letter-spacing:-.03em;white-space:nowrap;text-shadow:0 2px 8px rgba(0,0,0,.2)}.hero-stats .stat-item .stat-label{font-size:.7rem;color:#fffffff2;font-weight:600;line-height:1.2;white-space:nowrap;letter-spacing:.02em}.hero-stats .stat-item .stat-label-en{font-size:.49rem;color:#ffffffa6;line-height:1.2;font-weight:500;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap;position:relative;z-index:1}.scroll-indicator{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);color:#fffc;font-size:2rem}.animate-fade-in-up{animation:fadeInUp .8s ease-out forwards;opacity:0}.animate-bounce-slow{animation:bounce-slow 2s ease-in-out infinite}@keyframes bounce-slow{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-10px)}}@media (max-width: 768px){.hero-features-pills{max-width:100%}.feature-pill{font-size:.75rem;padding:.4rem .8rem}.hero-stats{gap:.7rem;margin-top:1rem}.hero-stats .stat-item{padding:.8rem 1.05rem;min-width:154px;gap:.7rem}.hero-stats .stat-item .stat-content{gap:.21rem}.hero-stats .stat-item .stat-icon{font-size:1.575rem;width:1.75rem;height:1.75rem}.hero-stats .stat-item .stat-value{font-size:1.225rem}.hero-stats .stat-item .stat-label{font-size:.63rem}.hero-stats .stat-item .stat-label-en{font-size:.455rem;letter-spacing:.1em}}@media (max-width: 480px){.hero-cta-section{flex-direction:column;width:100%}.hero-cta-primary,.hero-cta-secondary{width:100%;justify-content:center}.hero-stats .stat-item{padding:.7rem .875rem;min-width:126px;max-width:100%;gap:.6125rem}.hero-stats .stat-item .stat-content{gap:.175rem}.hero-stats .stat-item .stat-icon{font-size:1.4rem;width:1.575rem;height:1.575rem}.hero-stats .stat-item .stat-value{font-size:1.05rem}.hero-stats .stat-item .stat-label{font-size:.595rem}.hero-stats .stat-item .stat-label-en{font-size:.42rem;letter-spacing:.08em}}.chatgpt-style-container{display:flex;flex-direction:column;height:calc(100vh - 20rem);background:linear-gradient(135deg,#fffffff2,#f8fafcf2);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:1rem;box-shadow:0 8px 24px -4px #0000001f,0 0 0 1px #ffffff80;overflow:hidden;max-width:1200px;margin:0 auto;position:relative;animation:slideInUp .8s ease-out;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Noto Sans SC,Noto Sans Thai,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.chat-header{padding:1rem 1.5rem;border-bottom:1px solid #e5e7eb;background-color:#f9fafb;display:flex;justify-content:space-between;align-items:center}.chat-header-left{display:flex;flex-direction:column;gap:.25rem}.chat-title{font-size:1.125rem;font-weight:700;color:#111827;margin:0;letter-spacing:-.01em}@media (min-width: 768px){.chat-title{font-size:1.25rem}}@media (min-width: 1024px){.chat-title{font-size:1.375rem}}.conversation-indicator{font-size:.8125rem;color:#6b7280;font-weight:500;line-height:1.4}@media (min-width: 768px){.conversation-indicator{font-size:.875rem}}.chat-header-right{display:flex;align-items:center}.new-conversation-btn{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:.625rem;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #10b9814d,0 0 0 1px #fff3;position:relative;overflow:hidden}.new-conversation-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent,rgba(255,255,255,.2),transparent);transform:translate(-100%);transition:transform .6s}.new-conversation-btn:hover:before{transform:translate(100%)}.new-conversation-btn:hover{background:linear-gradient(135deg,#059669,#047857);transform:translateY(-2px) scale(1.05);box-shadow:0 4px 16px #10b98166,0 0 0 1px #ffffff4d}.new-conversation-btn .material-symbols-outlined{font-size:1.5rem;font-weight:600;color:#fff!important;font-family:Material Symbols Outlined!important;font-variation-settings:"FILL" 0,"wght" 600,"GRAD" 0,"opsz" 24!important}.chat-messages-container{flex:1;overflow-y:auto;padding:1rem;background-color:#fff!important;min-height:0;display:flex;flex-direction:column;margin-bottom:0}.message-wrapper{margin-bottom:.9rem;padding:0 .25rem;animation:messageSlideIn .5s ease-out;opacity:0;animation-fill-mode:forwards}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.user-message-wrapper{display:flex;justify-content:flex-end}.bot-message-wrapper{display:flex;justify-content:flex-start}.bot-message{display:flex;align-items:flex-start;gap:.75rem;max-width:85%}.bot-message .bot-avatar{flex-shrink:0;width:2rem;height:2rem;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #10b9814d}.bot-avatar .material-symbols-outlined{color:#fff;font-size:1.125rem;font-family:Material Symbols Outlined;font-variation-settings:"FILL" 1,"wght" 500,"GRAD" 0,"opsz" 24}.bot-content{background:#fff!important;border-radius:1rem 1rem 1rem .25rem;padding:.75rem .875rem;max-width:100%;transition:all .3s ease;display:flex;flex-direction:column;border:1px solid #e2e8f0;box-shadow:0 1px 3px #0000000d;color:#1e293b!important}.bot-content .markdown-paragraph,.bot-content p,.bot-content span,.bot-content div,.bot-content li,.bot-content td,.bot-content th{color:#1e293b!important}.bot-content:hover{background:#f1f5f9!important;border-color:#cbd5e1;box-shadow:0 2px 6px #00000014}.bot-content .message-text{color:#1e293b!important;font-size:.9375rem;line-height:1.6;margin:0;letter-spacing:.005em;background:transparent!important}@media (min-width: 768px){.bot-content .message-text{font-size:1rem;line-height:1.65}}@media (min-width: 1024px){.bot-content .message-text{font-size:1.0625rem;line-height:1.65}}.user-message{display:flex;align-items:flex-start;gap:.375rem;max-width:85%}.chatgpt-style-container .user-message{flex-direction:row!important}.user-avatar{flex-shrink:0;width:2rem;height:2rem;background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #10b9814d}.chatgpt-style-container .user-message .message-avatar.user-avatar{background:linear-gradient(135deg,#10b981,#059669)!important}.chatgpt-style-container .user-message .message-avatar.user-avatar .material-symbols-outlined{color:#fff!important}.user-avatar .material-symbols-outlined{color:#fff;font-size:1.125rem;font-family:Material Symbols Outlined;font-variation-settings:"FILL" 1,"wght" 500,"GRAD" 0,"opsz" 24}.user-content{background:linear-gradient(135deg,#10b981,#059669);padding:.375rem .75rem;max-width:100%;border-radius:1rem .25rem 1rem 1rem;box-shadow:0 2px 8px #10b98140;transition:all .3s ease}.user-content:hover{background:linear-gradient(135deg,#059669,#047857);box-shadow:0 3px 12px #10b98159}.user-content .message-text{color:#fff;font-size:.9375rem;line-height:1.55;margin:0;letter-spacing:.01em}@media (min-width: 768px){.user-content .message-text{font-size:1rem;line-height:1.6}}@media (min-width: 1024px){.user-content .message-text{font-size:1.0625rem}}.thinking-indicator{display:flex;align-items:center;gap:.5rem}.thinking-dots{display:flex;gap:.25rem}.dot{width:.5rem;height:.5rem;background-color:#374151;border-radius:50%;animation:thinking-bounce 1.4s infinite ease-in-out}.dot:nth-child(1){animation-delay:-.32s}.dot:nth-child(2){animation-delay:-.16s}@keyframes thinking-bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.thinking-text{color:#374151;font-size:.9375rem;font-style:italic;letter-spacing:.01em}@media (min-width: 768px){.thinking-text{font-size:1rem}}.chat-input-area{flex-shrink:0;padding:1.25rem 1.5rem;border-top:1px solid rgba(229,231,235,.5);background:linear-gradient(135deg,#f9fafbfa,#f3f4f6fa);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 -2px 12px -2px #00000014;position:sticky;bottom:0;z-index:10;animation:slideInUp .6s ease-out .2s both}.input-container{display:flex;flex-direction:row;align-items:center;gap:.75rem;background:#fff;border:none;border-radius:1rem;padding:1rem 1.25rem;transition:all .3s ease;box-shadow:none;width:100%;box-sizing:border-box}.input-container:focus-within{background:#fff}.chat-input{flex:1;min-width:0;padding:0;border:none;font-size:1rem;background:transparent;transition:all .3s ease;font-family:inherit;line-height:1.6;overflow-y:auto;min-height:40px;max-height:200px;resize:none;box-sizing:border-box;letter-spacing:.01em;color:#111827;outline:none}.chat-input::-moz-placeholder{color:#9ca3af}.chat-input::placeholder{color:#9ca3af}.chat-input::-webkit-scrollbar{width:6px}.chat-input::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.input-actions{display:flex;flex-direction:row;align-items:center;gap:.5rem;flex-shrink:0}.action-button{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;background:#f3f4f6;color:#6b7280;border:none;border-radius:.5rem;cursor:pointer;transition:all .2s ease;padding:0}.send-button.action-button{width:48px;height:48px}.action-button:hover:not(:disabled){background:#e5e7eb;color:#374151;transform:scale(1.05)}.action-button:disabled{opacity:.5;cursor:not-allowed}.voice-button{background:#9ca3af;color:#fff}.voice-button:hover:not(:disabled){background:#6b7280;transform:scale(1.05);box-shadow:0 4px 12px #00000026}.voice-button.recording{animation:pulse 1.5s ease-in-out infinite;background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 0 0 4px #ef444433}.send-button{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.send-button:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);transform:scale(1.05);box-shadow:0 4px 12px #10b9814d}.send-button .material-symbols-outlined{font-size:22px}@media (max-width: 768px){.chatgpt-style-container{height:calc(100vh - 18rem);border-radius:.75rem}.bot-message,.user-message{max-width:90%}.chat-input-area{padding:.875rem 1rem;gap:.5rem;position:sticky;bottom:0;align-items:center}.chat-input{height:2.75rem}.voice-button{width:2.75rem;height:2.75rem}.send-button{padding:.75rem 1.25rem;height:2.75rem;font-size:.875rem}.status-bar{bottom:4.5rem;width:calc(100% - 1rem);max-width:calc(100vw - 2rem)}.status-item{padding:.625rem .875rem}.status-title{font-size:.8125rem}.status-subtitle{font-size:.6875rem}}.chat-messages-container::-webkit-scrollbar{width:12px}.chat-messages-container::-webkit-scrollbar-track{background:#f1f5f9;border-radius:6px}.chat-messages-container::-webkit-scrollbar-thumb{background:var(--primary-color, #00827F);border-radius:6px;border:2px solid #f1f5f9}.chat-messages-container::-webkit-scrollbar-thumb:hover{background:#006b6b}.chat-messages-container::-webkit-scrollbar-thumb:active{background:#004d4d}.chat-messages-container{scrollbar-width:thin;scrollbar-color:var(--primary-color, #00827F) #f1f5f9}@media (min-width: 1024px){.chatgpt-style-container{height:calc(100vh - 22rem)}}@media (min-width: 1440px){.chatgpt-style-container{height:calc(100vh - 24rem)}}.chat-input-area{position:sticky!important;bottom:0!important;z-index:100!important;margin-bottom:0!important}.chatgpt-style-container{position:relative;overflow:hidden}.markdown-paragraph{margin:.25rem 0;line-height:1.6;word-wrap:break-word;overflow-wrap:break-word;letter-spacing:.005em}@media (min-width: 768px){.markdown-paragraph{line-height:1.65}}.markdown-h1{font-size:1.75rem;font-weight:700;margin:.75rem 0 .5rem;color:#1e293b;border-bottom:2px solid #e2e8f0;padding-bottom:.4rem}.markdown-h2{font-size:1.5rem;font-weight:700;margin:.65rem 0 .4rem;color:#1e293b;border-bottom:1px solid #e2e8f0;padding-bottom:.2rem}.markdown-h3{font-size:1.25rem;font-weight:700;margin:.5rem 0 .35rem;color:#1e293b}.markdown-h4{font-size:1.125rem;font-weight:700;margin:.4rem 0 .2rem;color:#1e293b}.markdown-h5{font-size:1rem;font-weight:700;margin:.35rem 0 .2rem;color:#1e293b}.markdown-h6{font-size:.875rem;font-weight:700;margin:.3rem 0 .2rem;color:#6b7280;text-transform:uppercase;letter-spacing:.05em}.markdown-list,.markdown-ordered-list{margin:.1rem 0;padding-left:1.5rem}.markdown-list-item{margin:.1rem 0;line-height:1.5}.markdown-blockquote{border-left:4px solid var(--primary-color, #00827F);padding-left:.875rem;margin:.4rem 0;color:#6b7280;font-style:italic;background-color:#f8fafc;padding:.5rem .875rem;border-radius:0 .5rem .5rem 0}.markdown-paragraph img[alt*=emoji]{width:1.2em;height:1.2em;vertical-align:middle;margin:0 .1em}.bot-content .message-text{word-wrap:break-word;overflow-wrap:break-word;white-space:pre-wrap;background:transparent!important}.bot-content .message-text *{color:inherit;background:transparent!important}.bot-content .markdown-paragraph{word-break:break-word;hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto}.markdown-paragraph{font-feature-settings:"tnum"}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.status-bar{position:fixed;bottom:5rem;left:50%;transform:translate(-50%);max-width:400px;width:calc(100% - 2rem);z-index:100;animation:slideInUp .3s ease-out;pointer-events:none}.status-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:.75rem;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 4px 12px #00000026,0 0 0 1px #fff3;margin-bottom:.5rem;pointer-events:auto}.recording-status{background:linear-gradient(135deg,#ef44441a,#dc26260d);border:1px solid rgba(239,68,68,.2)}.transcribing-status{background:linear-gradient(135deg,#3b82f61a,#2563eb0d);border:1px solid rgba(59,130,246,.2)}.status-icon{flex-shrink:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center}.recording-dot{width:.75rem;height:.75rem;background:linear-gradient(135deg,#ef4444,#dc2626);border-radius:50%;animation:recordingPulse 1.5s ease-in-out infinite}.transcribing-spinner{width:1rem;height:1rem;border:2px solid rgba(59,130,246,.3);border-top:2px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite}.status-content{flex:1;min-width:0}.status-title{font-size:.9375rem;font-weight:600;margin-bottom:.125rem;letter-spacing:.01em;line-height:1.4}@media (min-width: 768px){.status-title{font-size:1rem}}.recording-status .status-title{color:#dc2626}.transcribing-status .status-title{color:#2563eb}.status-subtitle{font-size:.8125rem;opacity:.8;line-height:1.5;letter-spacing:.01em}@media (min-width: 768px){.status-subtitle{font-size:.875rem}}.recording-status .status-subtitle{color:#991b1b}.transcribing-status .status-subtitle{color:#1d4ed8}@keyframes recordingPulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}}.welcome-buttons{display:flex;flex-direction:column;gap:.75rem;margin-top:1.25rem;padding-top:1rem;border-top:1px solid rgba(226,232,240,.5);width:100%}.welcome-btn{width:100%;padding:1rem 1.5rem;border:none;border-radius:.75rem;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:.75rem;box-shadow:0 2px 8px #0000001a,0 0 0 1px #ffffff1a;position:relative;overflow:hidden;flex-shrink:0;letter-spacing:.02em;line-height:1.5}@media (min-width: 768px){.welcome-btn{font-size:1.0625rem;padding:1.125rem 1.75rem}}@media (min-width: 1024px){.welcome-btn{font-size:1.125rem}}.welcome-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent,rgba(255,255,255,.2),transparent);transform:translate(-100%);transition:transform .6s}.welcome-btn:hover:before{transform:translate(100%)}.welcome-btn .material-symbols-outlined{font-size:1.25rem!important;font-weight:500!important;color:#fff!important;font-family:Material Symbols Outlined!important}.bot-content .welcome-btn .material-symbols-outlined,.bot-content button .material-symbols-outlined{color:#fff!important;font-size:1.25rem!important}.test-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.test-btn:hover{background:linear-gradient(135deg,#059669,#047857);transform:translateY(-2px);box-shadow:0 4px 16px #10b9814d,0 0 0 1px #fff3}.check-btn{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.check-btn:hover{background:linear-gradient(135deg,#d97706,#b45309);transform:translateY(-2px);box-shadow:0 4px 16px #f59e0b4d,0 0 0 1px #fff3}.learning-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.learning-btn:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);transform:translateY(-2px);box-shadow:0 4px 16px #3b82f64d,0 0 0 1px #fff3}.chatgpt-style-container .chat-input-area{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important}.chatgpt-style-container .chat-input-area>*{display:inline-flex!important}.chatgpt-style-container .chat-input-area>textarea{display:block!important}.chat-input-area[class*=flex]{flex-direction:row!important}.chat-input-area>*[class*=w-],.chat-input-area>*[class*=h-]{flex-shrink:0!important}.user-info-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .3s ease-out;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Noto Sans SC,Noto Sans Thai,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.user-info-dialog{background:#fff!important;border-radius:1rem;box-shadow:0 20px 50px #0000004d,0 0 0 1px #ffffff80;max-width:500px;width:90%;animation:slideInUp .4s ease-out;overflow:hidden;color:#111827!important}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog-header{padding:2rem 2rem 1rem;text-align:center;background:linear-gradient(135deg,#10b9811a,#00827f0d)!important;border-bottom:1px solid #e5e7eb}.dialog-title{font-size:1.25rem;font-weight:700;color:#111827!important;margin:0 0 .5rem;display:flex;align-items:center;justify-content:center;gap:.75rem;letter-spacing:-.01em;line-height:1.3}@media (min-width: 768px){.dialog-title{font-size:1.5rem}}.dialog-title .material-symbols-outlined{font-size:2rem;color:var(--primary-color, #00827F);font-variation-settings:"FILL" 1,"wght" 500,"GRAD" 0,"opsz" 24}.dialog-subtitle{font-size:.9375rem;color:#6b7280!important;margin:0;line-height:1.6;letter-spacing:.01em}@media (min-width: 768px){.dialog-subtitle{font-size:1rem}}.dialog-form{padding:2rem}.form-group{margin-bottom:1.5rem}.form-group:last-of-type{margin-bottom:2rem}.form-label{display:flex;align-items:center;gap:.5rem;font-size:.9375rem;font-weight:600;color:#374151!important;margin-bottom:.5rem;letter-spacing:.01em;line-height:1.4}@media (min-width: 768px){.form-label{font-size:1rem}}.form-label .material-symbols-outlined{font-size:1.125rem;color:var(--primary-color, #00827F)}.form-input{width:100%;padding:.75rem 1rem;border:2px solid #e5e7eb;border-radius:.5rem;font-size:.9375rem;transition:all .3s ease;box-sizing:border-box;letter-spacing:.01em;line-height:1.5;font-family:inherit;background:#fff!important;color:#111827!important}@media (min-width: 768px){.form-input{font-size:1rem;padding:.875rem 1.125rem}}.form-input:focus{outline:none;border-color:var(--primary-color, #00827F);box-shadow:0 0 0 3px #00827f1a}.form-input::-moz-placeholder{color:#9ca3af}.form-input::placeholder{color:#9ca3af}.error-message{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#fef2f2;border:1px solid #fecaca;border-radius:.5rem;color:#dc2626;font-size:.9375rem;margin-bottom:1rem;animation:shake .5s ease-out;letter-spacing:.01em;line-height:1.5}@media (min-width: 768px){.error-message{font-size:1rem}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.error-message .material-symbols-outlined{font-size:1.125rem;flex-shrink:0}.dialog-actions{display:flex;justify-content:center}.submit-btn{display:flex;align-items:center;justify-content:center;gap:.625rem;padding:.875rem 1.75rem;background:linear-gradient(135deg,var(--primary-color, #00827F),#006b6b);color:#fff;border:none;border-radius:.75rem;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #00827f4d,0 0 0 1px #ffffff1a;position:relative;overflow:hidden;letter-spacing:.02em;line-height:1.4}@media (min-width: 768px){.submit-btn{font-size:1rem;padding:1rem 2rem}}.submit-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent,rgba(255,255,255,.2),transparent);transform:translate(-100%);transition:transform .6s}.submit-btn:hover:before{transform:translate(100%)}.submit-btn:hover{background:linear-gradient(135deg,#006b6b,#004d4d);transform:translateY(-2px);box-shadow:0 6px 20px #00827f66,0 0 0 1px #fff3}.submit-btn:active{transform:translateY(0)}.submit-btn .material-symbols-outlined{font-size:1.25rem;font-variation-settings:"FILL" 1,"wght" 500,"GRAD" 0,"opsz" 24}@media (max-width: 640px){.user-info-dialog{width:95%}.dialog-header{padding:1.5rem 1.5rem 1rem}.dialog-title{font-size:1.25rem}.dialog-form{padding:1.5rem}.submit-btn{width:100%}}:root{--font-roboto: "Roboto", sans-serif;--font-noto-sc: "Noto Sans SC", sans-serif;--font-noto-thai: "Noto Sans Thai", sans-serif;--primary-color: #00827F;--background-light: #FAFBFC;--text-light: #586262;--text-dark: #0A1414;--border-color: #E2E8F0}html{scroll-behavior:smooth}body{font-family:var(--font-roboto);overflow-x:hidden;background-color:var(--background-light);margin:0}html[lang=zh] body{font-family:var(--font-noto-sc)}html[lang=th] body{font-family:var(--font-noto-thai)}.card{background-color:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;border:1px solid var(--border-color);padding:1.5rem;transition:all .2s ease;display:flex;flex-direction:column;gap:1.5rem}.page-header{text-align:center;margin-bottom:3rem}.module-badge{display:inline-flex;align-items:center;gap:.75rem;background-color:#00827f1a;color:var(--primary-color);padding:.5rem 1rem;border-radius:9999px;margin-bottom:1rem}.module-badge .material-symbols-outlined{font-size:1.25rem}.module-text{font-size:.875rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:0}.page-title{color:var(--text-dark);font-size:1.875rem;font-weight:700;margin:0}@media (min-width: 640px){.page-title{font-size:2.25rem}}.page-subtitle{color:var(--text-light);font-size:1.125rem;margin:.75rem 0 0;max-width:48rem;margin-left:auto;margin-right:auto}.content-grid{display:grid;gap:2rem}.main-content{flex:1;padding:3rem 1rem}@media (min-width: 640px){.main-content{padding:4rem 1rem}}.content-container{max-width:80rem;margin:0 auto}.function1-container{background:var(--background-light);min-height:100vh;padding-top:4rem;width:100%;overflow-x:hidden;position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.function1-container .ms,.function1-container .material-symbols-outlined{font-family:Material Symbols Outlined!important;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24!important}.function1-container:before{content:none}.function1-wrapper{position:relative;display:flex;min-height:100vh;width:100%;flex-direction:column;z-index:1}.module-badge{display:inline-flex;align-items:center;gap:1rem;margin-bottom:1rem;padding:1rem 2rem;background:linear-gradient(135deg,#00827f26,#00827f0d);border-radius:2rem;border:1px solid rgba(0,130,127,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideInDown .6s ease-out .2s both;transition:all .3s ease;position:relative;overflow:hidden}.module-badge:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.module-badge:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00827f33}.module-icon{display:flex;align-items:center;justify-content:center;background-color:var(--primary-color);border-radius:50%;width:3.5rem;height:3.5rem}.module-icon .ms,.module-icon .material-symbols-outlined{color:#fff;font-size:2rem}.module-text{color:var(--primary-color);font-size:1.25rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:0;line-height:1.3}@media (min-width: 768px){.module-text{font-size:1.375rem}}@media (min-width: 1024px){.module-text{font-size:1.5rem}}.page-title{color:var(--text-dark);font-size:1.75rem;font-weight:800;margin:0 0 1rem;letter-spacing:-.02em;line-height:1.2}@media (min-width: 480px){.page-title{font-size:2rem}}@media (min-width: 768px){.page-title{font-size:2.25rem}}@media (min-width: 1024px){.page-title{font-size:2.5rem}}.page-subtitle{color:var(--text-light);margin:0 auto;font-size:.9375rem;max-width:600px;line-height:1.6;padding:0 1rem;word-wrap:break-word;animation:fadeInUp .8s ease-out .6s both;opacity:.85;letter-spacing:.01em}@media (min-width: 480px){.page-subtitle{font-size:1rem;line-height:1.65}}@media (min-width: 768px){.page-subtitle{font-size:1.125rem;max-width:800px;line-height:1.7}}@media (min-width: 1024px){.page-subtitle{font-size:1.25rem}}.function-cards-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:2rem;max-width:1400px;margin:0 auto 2rem;padding:0 1rem;animation:fadeIn .8s ease-out .4s both;align-items:stretch}@media (min-width: 1024px){.function-cards-container{grid-template-columns:repeat(2,1fr)}}.function-card{background:#fff;border-radius:1.25rem;padding:2.5rem;box-shadow:0 4px 16px #00000014;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid var(--border-color);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center}.function-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),#006b69);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}.function-card:hover:before{transform:scaleX(1)}.function-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px #00827f29;border-color:#00827f4d}.function-card:nth-child(2):before{background:linear-gradient(90deg,#ea580c,#c2410c)}.function-card:nth-child(2):hover{box-shadow:0 12px 32px #ea580c29;border-color:#ea580c4d}.card-icon{width:56px;height:56px;background:linear-gradient(135deg,var(--primary-color),#006b69);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;box-shadow:0 4px 12px #00827f47;border:1px solid rgba(0,130,127,.15)}.card-icon.checklist-icon{background:linear-gradient(135deg,#d97706,#b45309);box-shadow:0 4px 12px #d9770640;border:1px solid rgba(217,119,6,.2)}.card-icon .ms{font-size:28px;color:#fff}.function1-container .function-card .card-title{font-size:1.375rem;font-weight:700;color:var(--primary-color);margin:0 0 .875rem;line-height:1.3;letter-spacing:-.01em;text-align:center;width:100%}@media (min-width: 768px){.function1-container .function-card .card-title{font-size:1.5rem}}@media (min-width: 1024px){.function1-container .function-card .card-title{font-size:1.625rem}}.function1-container .function-card:nth-child(2) .card-title{color:#c2410c}.card-divider{width:60px;height:3px;background:linear-gradient(90deg,rgba(0,130,127,.2),var(--primary-color),rgba(0,130,127,.2));border-radius:999px;margin:0 auto 1.5rem}.function-card:nth-child(2) .card-divider{background:linear-gradient(90deg,#ea580c33,#ea580c,#ea580c33)}.card-content{margin-bottom:1.5rem;flex-grow:1;display:flex;flex-direction:column;gap:.75rem;width:100%}.card-description{color:#1f2937;font-size:1.1875rem;line-height:1.75;margin-bottom:1.25rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-left:3px solid var(--primary-color);border-radius:.5rem;box-shadow:0 1px 3px #0000000f;text-align:left}.function-card:nth-child(2) .card-description{border-left-color:#ea580c}.card-description strong{color:#dc2626;font-weight:700}.card-features{display:none}.card-timing{order:-1;align-self:center;display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .875rem;background:#dcfce799;border-radius:.75rem;font-size:.875rem;color:#065f46;font-weight:600;border:1px solid rgba(0,130,127,.2)}.card-timing.warning{background:#fef3c799;color:#b45309;border:1px solid rgba(217,119,6,.2)}.card-timing .ms{font-size:20px}.card-warning-notice{margin-top:1.5rem;padding:1rem;background:#fef3c780;border-left:4px solid #f59e0b;border-radius:.5rem;display:flex;align-items:flex-start;gap:.75rem;color:#b45309}.card-warning-notice .warning-icon{font-size:1.25rem;margin-top:2px}.card-warning-notice span{font-size:.875rem;line-height:1.5}.card-warning-notice strong{font-weight:700}.card-button{width:100%;max-width:280px;padding:.875rem 1.5rem;background:linear-gradient(135deg,var(--primary-color),#006b69);color:#fff;border:none;border-radius:.75rem;font-size:1rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #00827f4d;margin:0 auto}.card-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00827f66}.card-button.checklist-button{background:linear-gradient(135deg,#ea580c,#c2410c);box-shadow:0 4px 12px #ea580c47}.card-button.checklist-button:hover{box-shadow:0 6px 20px #ea580c59}.card-button .ms{font-size:20px}.card-last-completed{margin-top:1rem;padding:.75rem;background:#f9fafb;border-radius:.5rem;display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:#6b7280}.card-last-completed .ms{font-size:16px}.back-button{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;background:#fff;border:1px solid #e5e7eb;border-radius:.5rem;color:#6b7280;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-bottom:1rem}.back-button:hover{border-color:var(--primary-color);color:var(--primary-color);background:#00827f0a;transform:translate(-4px);box-shadow:0 2px 8px #00827f26}.back-button .ms{font-size:20px}.tab-switcher{display:flex;justify-content:center;gap:1rem;margin-bottom:2rem;padding:0 1rem;animation:fadeInUp .8s ease-out .8s both}.tab-button{display:flex;align-items:center;gap:.5rem;padding:.875rem 1.5rem;background:#fff;border:2px solid #e2e8f0;border-radius:.75rem;color:#475569;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:160px;justify-content:center;position:relative;overflow:hidden;box-shadow:0 2px 8px #0000001a;letter-spacing:.01em;line-height:1.4}@media (min-width: 768px){.tab-button{font-size:1rem;padding:1rem 1.75rem;min-width:180px}}@media (min-width: 1024px){.tab-button{font-size:1.0625rem;padding:1rem 2rem;min-width:200px}}.tab-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .6s cubic-bezier(.4,0,.2,1)}.tab-button:hover:before{left:100%}.tab-button:hover{background:#f8fafc;border-color:#cbd5e1;color:#334155;transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.tab-button.active{background:#10b981;border-color:#10b981;color:#fff;box-shadow:0 4px 16px #10b9814d;transform:translateY(-2px);font-weight:700;letter-spacing:.02em}.tab-button .ms,.tab-button .material-symbols-outlined{font-size:1.25rem;transition:all .3s ease}.tab-button:hover .material-symbols-outlined{transform:scale(1.1)}.tab-button.active .material-symbols-outlined{animation:iconPulse 1.5s ease-in-out infinite}@keyframes iconPulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.tab-button:active{transform:translateY(0) scale(.98);transition:all .1s cubic-bezier(.4,0,.2,1)}.tab-button.active:active{transform:translateY(0) scale(.98)}.safety-content-container{width:100%;max-width:100%;margin:0 auto;padding:0 1rem;box-sizing:border-box;animation:fadeInUp .8s ease-out 1s both}@media (min-width: 768px){.safety-content-container{padding:0 2rem}}@media (min-width: 1024px){.safety-content-container{padding:0 3rem}}.ai-test-section{width:100%;min-width:0;display:flex;flex-direction:column;gap:0}.checklist-section{width:100%;min-width:0}.ai-test-section>*:not(.back-button),.checklist-section>*:not(.back-button){width:100%!important;min-width:0!important;max-width:100%!important}.ai-test-section .chatgpt-style-container{display:flex!important;flex-direction:column!important}.main-content{flex:1;padding:.5rem;width:100%;box-sizing:border-box}@media (min-width: 480px){.main-content{padding:1rem}}@media (min-width: 768px){.main-content{padding:2rem}}@media (min-width: 1024px){.main-content{padding:2.5rem}}.content-container{max-width:100%;margin:0 auto;padding:0 1rem;width:100%;box-sizing:border-box}@media (min-width: 1280px){.content-container{max-width:1400px;padding:0 2rem}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.search-container{position:relative;margin-bottom:2rem}.search-form{position:relative}.search-input{width:100%;height:3.5rem;padding-left:3rem;padding-right:1rem;border-radius:9999px;border:1px solid #d1d5db;box-shadow:0 1px 2px #0000000d;font-size:1rem;transition:border-color .2s,box-shadow .2s}.search-input:focus{outline:none;border-color:var(--primary-color, #00827F);box-shadow:0 0 0 2px #00827f33}.search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-light, #586262);font-size:1.25rem}.terminology-section{background:#fff;padding:1.5rem;border-radius:.75rem;border:1px solid #e5e7eb;box-shadow:0 2px 8px #00827f0f}@media (min-width: 1024px){.terminology-section{grid-column:span 2}}.section-title{font-size:1.25rem;font-weight:700;color:var(--text-dark, #0A1414);margin:0 0 1rem}.terminology-grid{display:grid;grid-template-columns:1fr;gap:1.25rem}@media (min-width: 768px){.terminology-grid{grid-template-columns:repeat(2,1fr)}}.terminology-card{display:flex;flex-direction:column;gap:.5rem;border-radius:.75rem;border:1px solid #e5e7eb;padding:1rem;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;background:#fff;position:relative;overflow:hidden}.terminology-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary-color, #00827F),#26D0CE);opacity:0;transition:opacity .3s}.terminology-card:hover:before{opacity:1}.terminology-card:hover{transform:translateY(-2px);box-shadow:0 12px 24px -8px #00827f26,0 8px 16px -8px #0000001a;border-color:#00827f4d}.terminology-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem}.terminology-title-group{display:flex;flex-direction:column;gap:.25rem;flex:1}.terminology-title{font-size:1.125rem;font-weight:700;color:var(--text-dark, #0A1414);margin:0;line-height:1.4}.category-tag{font-size:.6875rem;color:var(--primary-color, #00827F);background:linear-gradient(135deg,#00827f1f,#26d0ce14);padding:.25rem .625rem;border-radius:1rem;font-weight:600;display:inline-block;width:-moz-fit-content;width:fit-content;border:1px solid rgba(0,130,127,.2);letter-spacing:.02em}.card-badges{display:flex;align-items:center;gap:.5rem}.core-badge{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#d97706;font-size:.625rem;padding:.25rem .5rem;border-radius:1rem;font-weight:700;display:flex;align-items:center;gap:.125rem;box-shadow:0 1px 3px #d9770626}.core-badge:before{content:"⭐";font-size:.625rem}.visual-badge{font-size:1rem;opacity:.8;transition:transform .2s}.terminology-card:hover .visual-badge{transform:scale(1.1)}.badge-3d{display:flex;align-items:center;gap:.125rem;background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff;font-size:.625rem;padding:.25rem .5rem;border-radius:1rem;font-weight:700;box-shadow:0 2px 4px #06b6d433;transition:all .2s}.badge-3d .material-symbols-outlined{font-size:14px}.terminology-card:hover .badge-3d{transform:translateY(-2px);box-shadow:0 4px 8px #06b6d44d}.favorite-button{background:none;border:none;cursor:pointer;padding:.25rem;border-radius:.25rem;transition:all .2s;display:flex;align-items:center;justify-content:center}.favorite-button:hover{background-color:#f3f4f6}.favorite-button .material-symbols-outlined{font-size:1.25rem;color:#d1d5db;transition:color .2s}.favorite-button.favorited .material-symbols-outlined,.favorite-button:hover .material-symbols-outlined{color:#ef4444}.terminology-languages{display:flex;flex-direction:column;gap:.25rem;padding:.5rem .625rem;background:linear-gradient(135deg,#00827f0a,#26d0ce05);border-radius:.5rem;border-left:3px solid var(--primary-color, #00827F)}.terminology-english{font-size:.875rem;font-weight:600;color:var(--primary-color, #00827F);margin:0;letter-spacing:.01em}.terminology-thai{font-size:.75rem;color:#6b7280;margin:0;font-style:italic;opacity:.9}.terminology-description{color:var(--text-light, #4b5563);font-size:.8125rem;line-height:1.5;margin:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.terminology-thai-description{color:var(--text-gray, #6B7280);font-size:.75rem;margin:.375rem 0 0;padding:.375rem .5rem;background:#6b72800d;border-radius:.375rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.4;font-style:italic;opacity:.85;border-left:2px solid rgba(107,114,128,.2)}.terminology-metadata{display:flex;flex-direction:column;gap:.375rem;margin-top:auto;padding-top:.5rem;border-top:1px solid #f3f4f6}.metadata-label{font-size:.75rem;color:#6b7280;font-weight:500}.related-commands,.application-tags{display:flex;align-items:center;gap:.5rem}.command-tags,.tag-list{display:flex;flex-wrap:wrap;gap:.25rem}.command-tag{background:linear-gradient(135deg,#e0f2fe,#bae6fd);color:#0369a1;font-size:.625rem;padding:.25rem .5rem;border-radius:.375rem;font-weight:600;font-family:Courier New,monospace;letter-spacing:.02em;border:1px solid #7dd3fc}.application-tag{background:linear-gradient(135deg,#f3e8ff,#e9d5ff);color:#6b21a8;font-size:.625rem;padding:.25rem .5rem;border-radius:.375rem;font-weight:600;border:1px solid #d8b4fe}.more-tag{background-color:#f3f4f6;color:#6b7280;font-size:.625rem;padding:.125rem .375rem;border-radius:.25rem;font-weight:500}.difficulty-level{display:flex;justify-content:flex-end}.difficulty-badge{font-size:.625rem;padding:.125rem .375rem;border-radius:.25rem;font-weight:600}.difficulty-badge.basic{background-color:#dcfce7;color:#16a34a}.difficulty-badge.intermediate{background-color:#fef3c7;color:#d97706}.difficulty-badge.advanced{background-color:#fee2e2;color:#dc2626}.terminology-tags{display:flex;flex-wrap:wrap;gap:.25rem;margin:.25rem 0}.terminology-tag{background-color:#f3f4f6;color:#6b7280;font-size:.625rem;padding:.125rem .375rem;border-radius:.75rem;font-weight:500}.terminology-hint{font-size:.6875rem;color:#9ca3af;text-align:center;padding:.25rem .375rem;background:#00827f05;border-radius:.375rem;transition:all .3s;margin-top:0}.terminology-card:hover .terminology-hint{color:var(--primary-color, #00827F);background:#00827f14;font-weight:500}.no-results{text-align:center;padding:2rem;color:var(--text-light, #586262)}.no-results p{margin:0;font-size:.875rem}.feedback-button{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background-color:var(--primary-color, #00827F);color:#fff;border:none;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;box-shadow:0 2px 4px #0000001a}.feedback-button:hover{background-color:#006b68;transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.feedback-button .material-symbols-outlined{font-size:1.125rem}.feedback-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.feedback-modal{background-color:#fff;border-radius:.75rem;box-shadow:0 20px 25px -5px #0000001a;width:100%;max-width:500px;max-height:90vh;overflow-y:auto}.feedback-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 1.5rem 0}.feedback-title{font-size:1.25rem;font-weight:600;color:var(--text-dark, #0A1414);margin:0}.feedback-close{background:none;border:none;color:#6b7280;cursor:pointer;padding:.25rem;border-radius:.25rem;transition:all .2s}.feedback-close:hover{background-color:#f3f4f6;color:var(--text-dark, #0A1414)}.feedback-close .material-symbols-outlined{font-size:1.25rem}.feedback-form{padding:1.5rem}.feedback-textarea{width:100%;padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.875rem;font-family:inherit;resize:vertical;min-height:100px;transition:border-color .2s}.feedback-textarea:focus{outline:none;border-color:var(--primary-color, #00827F);box-shadow:0 0 0 3px #00827f1a}.feedback-textarea::-moz-placeholder{color:#9ca3af}.feedback-textarea::placeholder{color:#9ca3af}.feedback-actions{display:flex;gap:.75rem;justify-content:flex-end;margin-top:1rem}.feedback-cancel{padding:.5rem 1rem;background-color:#fff;color:#6b7280;border:1px solid #d1d5db;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s}.feedback-cancel:hover{background-color:#f9fafb;border-color:#9ca3af}.feedback-submit{padding:.5rem 1rem;background-color:var(--primary-color, #00827F);color:#fff;border:none;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s}.feedback-submit:hover{background-color:#006b68}.feedback-submit:disabled{background-color:#d1d5db;cursor:not-allowed}.feedback-success{display:flex;flex-direction:column;align-items:center;padding:2rem 1.5rem;text-align:center}.feedback-success .material-symbols-outlined{font-size:3rem;color:#10b981;margin-bottom:1rem}.feedback-success p{color:var(--text-dark, #0A1414);font-size:1rem;margin:0}@media (max-width: 640px){.feedback-modal{margin:1rem;max-width:none}.feedback-header{padding:1rem 1rem 0}.feedback-form{padding:1rem}.feedback-actions{flex-direction:column}.feedback-cancel,.feedback-submit{width:100%}}.alphabet-index-compact{background-color:#fff;padding:.5rem;border-radius:.5rem;border:1px solid #e5e7eb;margin-bottom:.5rem}.alphabet-index-buttons{display:flex;flex-wrap:wrap;gap:.375rem}.alphabet-button{padding:.25rem .5rem;border:1px solid #d1d5db;border-radius:.25rem;background-color:#fff;color:var(--text-dark, #0A1414);font-size:.6875rem;font-weight:500;cursor:pointer;transition:all .2s;min-width:1.5rem;text-align:center;height:1.75rem;display:flex;align-items:center;justify-content:center}.alphabet-button:hover{background-color:#f9fafb;border-color:var(--primary-color, #00827F);color:var(--primary-color, #00827F)}.alphabet-button.active{background-color:var(--primary-color, #00827F);border-color:var(--primary-color, #00827F);color:#fff}.alphabet-button.active:hover{background-color:#006b68;border-color:#006b68}@media (max-width: 640px){.alphabet-index-compact{padding:.5rem}.alphabet-index-buttons{gap:.25rem}.alphabet-button{padding:.1875rem .375rem;font-size:.625rem;min-width:1.25rem;height:1.5rem}}.tag-filter{background-color:#fff;padding:1rem;border-radius:.5rem;border:1px solid #e5e7eb;margin-bottom:1rem}.filter-section{margin-bottom:1rem}.filter-section:last-child{margin-bottom:0}.filter-label{font-size:.75rem;font-weight:600;color:var(--text-dark, #0A1414);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.05em}.filter-buttons{display:flex;flex-wrap:wrap;gap:.375rem}.filter-button{padding:.25rem .75rem;border:1px solid #d1d5db;border-radius:1rem;background-color:#fff;color:var(--text-dark, #0A1414);font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.filter-button:hover{background-color:#f9fafb;border-color:var(--primary-color, #00827F);color:var(--primary-color, #00827F)}.filter-button.active{background-color:var(--primary-color, #00827F);border-color:var(--primary-color, #00827F);color:#fff}.filter-button.active:hover{background-color:#006b68;border-color:#006b68}@media (max-width: 640px){.tag-filter{padding:.75rem}.filter-buttons{gap:.25rem}.filter-button{padding:.1875rem .5rem;font-size:.6875rem}}.robot-arm-stage{background-color:transparent;border-radius:0;border:none;display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden;position:relative}.stage-header{padding:12px 16px;background:#ffffff0d;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.stage-title{font-size:.9rem;font-weight:600;color:#ffffffe6;margin:0;display:flex;align-items:center;gap:8px}.stage-title .material-symbols-outlined{font-size:1.3rem;color:var(--primary-color)}.stage-section{flex:1;position:relative;overflow:hidden;width:100%;height:100%;min-height:400px}.demo-status-banner{position:absolute;top:16px;left:50%;transform:translate(-50%);z-index:50;background:linear-gradient(135deg,#00827ff2,#10b981f2);color:#fff;padding:10px 20px;border-radius:8px;font-size:.875rem;font-weight:600;display:flex;align-items:center;gap:8px;box-shadow:0 4px 16px #00827f66;animation:fadeInDown .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none;white-space:nowrap}.demo-status-banner .material-symbols-outlined{font-size:1.125rem}@keyframes fadeInDown{0%{opacity:0;transform:translate(-50%) translateY(-10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.stage-container{width:100%;height:100%;min-height:inherit;background:radial-gradient(circle at 50% 50%,#2d2d2d,#1a1a1a);overflow:hidden;position:relative;cursor:grab}.stage-container:active{cursor:grabbing}.stage-container canvas{display:block!important;width:100%!important;height:100%!important;outline:none;position:absolute;top:0;left:0}.control-panel{position:absolute;top:10px;right:10px;padding:0;background:#fffffff2;border-radius:.5rem;border:1px solid rgba(209,213,219,.5);width:180px;box-shadow:0 5px 10px -3px #0000001a,0 2px 4px -2px #0000000d;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:10;max-height:calc(50vh - 20px)!important;overflow-y:auto;overflow-x:hidden;transition:all .3s ease;pointer-events:auto}.control-panel-header{display:flex;justify-content:space-between;align-items:center;padding:.25rem .5rem;border-bottom:1px solid rgba(209,213,219,.3);background:#fffc}.control-panel-title{font-size:.6rem;font-weight:600;color:#374151;margin:0}.control-panel-actions{display:flex;gap:.25rem}.scale-btn,.collapse-btn{width:20px;height:20px;border:none;border-radius:3px;background:#4b5563cc;color:#fff;cursor:pointer;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .2s}.scale-btn:hover,.collapse-btn:hover{background:#4b5563;transform:scale(1.1)}.control-panel.collapsed{width:auto;min-width:200px}.control-panel.collapsed .control-panel-header{border-bottom:none}.control-panel>div:not(.control-panel-header){padding:.25rem}.joint-controls{margin-bottom:.2rem}.control-row{display:flex;align-items:center;margin-bottom:.1rem}.control-row label{width:25px;font-size:.55rem;color:#374151;font-weight:500}.control-row input[type=range]{width:60px;margin:0 1px}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;background:#e5e7eb;border-radius:2px;outline:none;transition:background .2s}input[type=range]:hover{background:#d1d5db}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;background:#f97316;border-radius:50%;cursor:pointer;border:1px solid #fff;box-shadow:0 1px 2px #0003;-webkit-transition:transform .2s;transition:transform .2s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1)}input[type=range]::-moz-range-thumb{width:14px;height:14px;background:#f97316;border-radius:50%;cursor:pointer;border:2px solid #fff;box-shadow:0 1px 3px #0003}.control-row span{width:35px;font-size:.6rem;text-align:right;color:#374151;font-family:monospace}.action-buttons{display:grid;grid-template-columns:1fr;gap:.15rem;margin-top:.25rem}.action-buttons button{padding:.2rem .25rem;border:none;border-radius:.15rem;background-color:#4b5563;color:#fff;cursor:pointer;transition:all .2s;font-weight:500;font-size:.5rem;line-height:1.1}.action-buttons button:hover{background-color:#374151;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.gripper-button.closed{background-color:#f97316}.gripper-button.closed:hover{background-color:#ea580c}.action-buttons button:last-child{grid-column:span 2;background-color:#1f2937}.action-buttons button:last-child:hover{background-color:#111827}.header-controls{display:flex;align-items:center;gap:.5rem}.ik-mode-btn{width:40px;height:40px;border:none;border-radius:50%;background:#6b7280;color:#fff;font-size:.75rem;font-weight:700;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.ik-mode-btn:hover{background:#4b5563;transform:scale(1.1)}.ik-mode-btn.active{background:#f97316;box-shadow:0 0 0 3px #f973164d}.ik-mode-btn.active:hover{background:#ea580c}.teaching-points-control{margin:.5rem 0;padding:.5rem;background:#22c55e0d;border-radius:.375rem;border:1px solid rgba(34,197,94,.2)}.teaching-points-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.teaching-points-header h5{font-size:.8rem;font-weight:600;color:#059669;margin:0}.hide-points-btn{padding:.2rem .4rem;border:1px solid #dc2626;border-radius:.2rem;background:#fff;color:#dc2626;font-size:.6rem;cursor:pointer;transition:all .2s;width:100%}.hide-points-btn:hover{background:#dc2626;color:#fff}.points-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.25rem}.point-btn{padding:.3rem .5rem;border:1px solid #22c55e;border-radius:.25rem;background:#fff;color:#22c55e;font-size:.7rem;font-weight:500;cursor:pointer;transition:all .2s}.point-btn:hover{background:#22c55e;color:#fff;transform:scale(1.05)}.ik-controls{margin:1rem 0;padding:.75rem;background:#f973160d;border-radius:.5rem;border:1px solid rgba(249,115,22,.2)}.ik-mode-toggle{margin-bottom:.75rem}.ik-toggle-label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:#374151;cursor:pointer}.ik-toggle-label input[type=checkbox]{width:16px;height:16px;accent-color:#f97316}.target-position-controls{margin-top:.75rem}.control-section-title{font-size:.6rem;font-weight:600;color:#374151;margin:0 0 .25rem}.position-inputs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.5rem;margin-bottom:.75rem}.position-input{display:flex;flex-direction:column;gap:.25rem}.position-input label{font-size:.75rem;font-weight:500;color:#6b7280}.position-input input{padding:.25rem .5rem;border:1px solid #d1d5db;border-radius:.25rem;font-size:.75rem;background:#fff}.position-input input:focus{outline:none;border-color:#f97316;box-shadow:0 0 0 2px #f973161a}.ik-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.75rem}.ik-move-btn,.ik-solve-btn{padding:.4rem .5rem;border:none;border-radius:.375rem;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s}.ik-move-btn{background-color:#f97316;color:#fff}.ik-move-btn:hover{background-color:#ea580c;transform:translateY(-1px)}.ik-solve-btn{background-color:#4b5563;color:#fff}.ik-solve-btn:hover{background-color:#374151;transform:translateY(-1px)}.ik-solution{padding:.5rem;background:#22c55e1a;border-radius:.375rem;border:1px solid rgba(34,197,94,.2)}.ik-solution h5{font-size:.75rem;font-weight:600;color:#059669;margin:0 0 .25rem}.solution-values{display:grid;grid-template-columns:1fr 1fr;gap:.25rem;font-size:.7rem;color:#047857}.solution-values span{font-family:monospace}.status-message{margin-top:.25rem;font-size:.55rem;color:#6b7280;text-align:center;line-height:1.2}@media (max-width: 768px){.control-panel{width:140px;top:5px;right:5px}.control-panel-header{padding:.5rem .75rem}.control-panel-title{font-size:.8rem}.scale-btn,.collapse-btn{width:20px;height:20px;font-size:10px}.control-row label{width:70px;font-size:.8rem}.control-row input[type=range]{width:120px}.control-row span{width:35px;font-size:.8rem}.action-buttons button{font-size:.8rem;padding:.4rem}.ik-controls{padding:.5rem}.position-inputs,.ik-actions{grid-template-columns:1fr;gap:.25rem}.solution-values,.points-grid{grid-template-columns:1fr}}@media (max-width: 480px){.control-panel{width:120px;top:5px;right:5px}.control-panel-header{padding:.4rem .6rem}.control-panel-title{font-size:.75rem}.scale-btn,.collapse-btn{width:18px;height:18px;font-size:9px}.control-row{margin-bottom:.5rem}.control-row label{width:60px;font-size:.75rem}.control-row input[type=range]{width:100px;margin:0 8px}.control-row span{width:30px;font-size:.75rem}.action-buttons{gap:.25rem}.action-buttons button{font-size:.75rem;padding:.3rem}.status-message{font-size:.8rem}.ik-controls{padding:.4rem}.position-inputs,.ik-actions{grid-template-columns:1fr;gap:.2rem}.solution-values{grid-template-columns:1fr;font-size:.65rem}.points-grid{grid-template-columns:1fr}.ik-mode-btn{width:35px;height:35px;font-size:.7rem}}.initial-pose-display{background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:.25rem;padding:.25rem;margin-bottom:.5rem}.pose-values{display:grid;grid-template-columns:repeat(3,1fr);gap:.15rem;margin-top:.25rem}.pose-value{font-size:.55rem;color:#475569;background-color:#fff;padding:.1rem .15rem;border-radius:.1rem;border:1px solid #e2e8f0;text-align:center;font-weight:500}.set-initial-pose-btn{background-color:#10b981!important;color:#fff!important;border:1px solid #059669!important}.set-initial-pose-btn:hover{background-color:#059669!important}.reset-initial-pose-btn{background-color:#f59e0b!important;color:#fff!important;border:1px solid #d97706!important}.reset-initial-pose-btn:hover{background-color:#d97706!important}.control-panel::-webkit-scrollbar{width:4px}.control-panel::-webkit-scrollbar-track{background:#0000001a;border-radius:2px}.control-panel::-webkit-scrollbar-thumb{background:#0000004d;border-radius:2px}.control-panel::-webkit-scrollbar-thumb:hover{background:#00000080}.alignment-controls{margin-top:1rem;padding:1rem;background-color:#f8fafc;border-radius:.5rem;border:1px solid #e2e8f0}.alignment-controls h4{margin:0 0 .75rem;color:#1e293b;font-size:.875rem;font-weight:600}.alignment-distance{margin-top:.75rem;padding:.5rem;background-color:#f1f5f9;border-radius:.375rem;border:1px solid #cbd5e1}.alignment-distance p{margin:.25rem 0;font-size:.8rem}.alignment-distance .aligned{color:#059669;font-weight:600}.alignment-distance .not-aligned{color:#dc2626;font-weight:600}.mode-indicator{font-size:.75rem;color:#059669;font-weight:600;margin-left:.5rem}.tool-mode-info{margin-top:.5rem;padding:.25rem;background-color:#ecfdf5;border-radius:.25rem;border:1px solid #a7f3d0;font-size:.75rem;color:#065f46}.home-controls{margin:1rem 0;text-align:center}.home-btn{padding:.75rem 1.5rem;background-color:#059669;color:#fff;border:none;border-radius:.5rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:background-color .2s}.home-btn:hover:not(:disabled){background-color:#047857}.home-btn:disabled{background-color:#9ca3af;cursor:not-allowed}.coordinate-info{margin-top:1rem;padding:.75rem;background-color:#f0f9ff;border-radius:.5rem;border:1px solid #bae6fd}.coordinate-info h4{margin:0 0 .5rem;font-size:.875rem;font-weight:600;color:#0c4a6e}.coordinate-info p{margin:.25rem 0;font-size:.75rem;color:#0c4a6e;line-height:1.4}.coordinate-info p strong{color:#0c4a6e;font-weight:600}.header-actions{display:flex;gap:8px}.code-toggle-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #667eea4d}.code-toggle-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.code-toggle-btn .material-symbols-outlined{font-size:1.2rem}.code-editor-section{background:linear-gradient(135deg,#1e293b,#0f172a);border-bottom:2px solid rgba(102,126,234,.3);padding:16px;display:flex;flex-direction:column;gap:12px;max-height:400px;overflow:hidden}.code-editor-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.code-editor-header h3{margin:0;font-size:1rem;font-weight:600;color:#fff;display:flex;align-items:center;gap:8px}.code-actions{display:flex;gap:8px}.action-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.action-btn:hover:not(:disabled){background:#fff3;border-color:#ffffff4d;transform:translateY(-1px)}.action-btn:disabled{opacity:.5;cursor:not-allowed}.action-btn .material-symbols-outlined{font-size:1.1rem}.execute-btn{background:linear-gradient(135deg,#10b981,#059669);border-color:#10b981}.execute-btn:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);box-shadow:0 2px 8px #10b98166}.stop-btn{background:linear-gradient(135deg,#ef4444,#dc2626);border-color:#ef4444}.stop-btn:hover:not(:disabled){background:linear-gradient(135deg,#dc2626,#b91c1c);box-shadow:0 2px 8px #ef444466}.rapid-code-editor{width:100%;min-height:200px;max-height:280px;padding:12px;background:#0f172a;color:#e2e8f0;border:2px solid rgba(102,126,234,.3);border-radius:8px;font-family:Consolas,Monaco,Courier New,monospace;font-size:.875rem;line-height:1.6;resize:vertical;transition:all .3s ease}.rapid-code-editor:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea33}.rapid-code-editor::-moz-placeholder{color:#e2e8f066}.rapid-code-editor::placeholder{color:#e2e8f066}.execution-status{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.status-indicator{font-size:1.25rem;min-width:24px;text-align:center}.status-text{flex:1;color:#ffffffe6;font-size:.875rem;font-weight:500}.status-idle .status-indicator{opacity:.5}.status-running .status-indicator{animation:spin 1s linear infinite}.status-completed .status-text{color:#10b981}.status-error .status-text{color:#ef4444}@media (max-width: 768px){.code-editor-section{max-height:350px}.code-editor-header{flex-direction:column;align-items:flex-start}.code-actions{width:100%;flex-wrap:wrap}.action-btn{flex:1;min-width:120px;justify-content:center}.rapid-code-editor{min-height:150px;max-height:200px;font-size:.8125rem}}.terminology-detail-modal-overlay{position:relative;z-index:10}.terminology-detail-modal{background-color:#fff;border-radius:12px;box-shadow:0 8px 24px #00827f26,0 0 0 1px #00827f1a;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden}@keyframes slideDown{0%{opacity:0;transform:translateY(-30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;background:linear-gradient(135deg,#00827f,#10b981);color:#fff;border-radius:16px 16px 0 0;box-shadow:0 2px 8px #00827f26}.modal-title{font-size:1.5rem;font-weight:600;margin:0}.modal-close-button{background:none;border:none;color:#fff;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:background-color .2s}.modal-close-button:hover{background-color:#ffffff1a}.modal-close-button .material-symbols-outlined{font-size:1.5rem}.modal-content{flex:1;display:flex;overflow:hidden}.term-info-panel{width:300px;background-color:#f8fafc;border-right:1px solid #e2e8f0;padding:1rem 1.25rem;overflow-y:auto}.term-basic-info{margin-bottom:1.25rem}.term-chinese{font-size:1.25rem;font-weight:700;color:var(--text-dark, #0A1414);margin:0 0 .375rem}.term-english{font-size:.95rem;color:#64748b;margin:0 0 .375rem;font-style:italic}.term-thai{font-size:.875rem;color:#059669;margin:0;font-weight:500}.term-description{margin-bottom:1.25rem}.term-description h4,.thai-description h4{font-size:.875rem;font-weight:600;color:var(--text-dark, #0A1414);margin:0 0 .5rem}.term-description p,.thai-description p{font-size:.8125rem;line-height:1.5;color:#475569;margin:0}.thai-description{margin-top:1rem;padding-top:1rem;border-top:1px solid #e2e8f0}.visual-section{margin-bottom:2rem}.visual-section h4{font-size:1rem;font-weight:600;color:var(--text-dark, #0A1414);margin:0 0 .75rem}.visual-placeholder{background-color:#fff;border:2px dashed #cbd5e1;border-radius:.75rem;padding:1.5rem;text-align:center;color:#64748b}.visual-placeholder .material-symbols-outlined{font-size:2rem;margin-bottom:.5rem;display:block}.demo-animation-btn{margin-top:1rem;padding:.625rem 1.25rem;background:linear-gradient(135deg,#00827f,#10b981);color:#fff;border:none;border-radius:.5rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:inline-flex;align-items:center;gap:.5rem;box-shadow:0 2px 8px #00827f33}.demo-animation-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00827f4d;background:linear-gradient(135deg,#006b68,#059669)}.demo-animation-btn:active{transform:translateY(0)}.demo-animation-btn .material-symbols-outlined{font-size:1.25rem;margin:0}.related-commands,.application-tags,.difficulty-level{margin-bottom:1.5rem}.related-commands h4,.application-tags h4,.difficulty-level h4{font-size:1rem;font-weight:600;color:var(--text-dark, #0A1414);margin:0 0 .75rem}.command-tags{display:flex;flex-wrap:wrap;gap:.5rem}.command-tag{background-color:var(--primary-color, #00827F);color:#fff;padding:.25rem .75rem;border-radius:1rem;font-size:.8rem;font-weight:500}.tag-list{display:flex;flex-wrap:wrap;gap:.5rem}.application-tag{background-color:#e0f2fe;color:#0369a1;padding:.25rem .75rem;border-radius:1rem;font-size:.8rem;font-weight:500}.difficulty-badge{padding:.25rem .75rem;border-radius:1rem;font-size:.8rem;font-weight:600}.difficulty-badge.basic{background-color:#dcfce7;color:#166534}.difficulty-badge.intermediate{background-color:#fef3c7;color:#92400e}.difficulty-badge.advanced{background-color:#fee2e2;color:#991b1b}.term-chat-panel{flex:1;display:flex;flex-direction:column;background-color:#fff}.chat-header{padding:1rem 1.25rem;border-bottom:1px solid #e2e8f0;background-color:#f8fafc}.chat-header h3{font-size:1rem;font-weight:600;color:var(--text-dark, #0A1414);margin:0 0 .25rem}.chat-header p{font-size:.8125rem;color:#64748b;margin:0}.chat-messages{flex:1;padding:1.25rem;overflow-y:auto;display:flex;flex-direction:column;gap:.875rem}.chat-message{display:flex;max-width:80%}.chat-message.user{align-self:flex-end}.chat-message.bot{align-self:flex-start}.message-content{padding:1rem;border-radius:1rem;font-size:.9rem;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}.message-content>*{white-space:normal}.message-content .markdown-paragraph{white-space:normal;margin:.5rem 0}.message-content .markdown-paragraph:first-child{margin-top:0}.message-content .markdown-paragraph:last-child{margin-bottom:0}.chat-message.user .message-content{background-color:var(--primary-color, #00827F);color:#fff;border-bottom-right-radius:.25rem}.chat-message.bot .message-content{background-color:#f1f5f9;color:var(--text-dark, #0A1414);border-bottom-left-radius:.25rem}.chat-input-form{display:flex;align-items:flex-end;padding:1.5rem;gap:.75rem;border-top:1px solid #e2e8f0;background-color:#f8fafc}.chat-input{flex:1;padding:.75rem 1rem;border:1px solid #d1d5db;border-radius:.75rem;font-size:.9rem;outline:none;transition:border-color .2s;font-family:inherit;line-height:1.4;overflow-y:auto;min-height:2.5rem;max-height:8rem}.chat-input:focus{border-color:var(--primary-color, #00827F)}.chat-send-button{padding:.75rem 1rem;background-color:var(--primary-color, #00827F);color:#fff;border:none;border-radius:.75rem;cursor:pointer;transition:background-color .2s;display:flex;align-items:center;justify-content:center;min-height:2.5rem;flex-shrink:0}.chat-send-button:hover{background-color:#006b68}.chat-send-button:disabled{background-color:#9ca3af;cursor:not-allowed}.chat-send-button .material-symbols-outlined{font-size:1.25rem}.markdown-paragraph{margin:.5rem 0;word-wrap:break-word;overflow-wrap:break-word;white-space:normal;line-height:1.6}.markdown-paragraph{word-break:break-word;hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto}.markdown-bold{font-weight:600;color:#1e293b}.markdown-h1{font-size:1.5rem;font-weight:700;margin:1rem 0 .5rem;color:#1e293b;border-bottom:2px solid #e2e8f0;padding-bottom:.5rem}.markdown-h2{font-size:1.25rem;font-weight:700;margin:.75rem 0 .5rem;color:#1e293b;border-bottom:1px solid #e2e8f0;padding-bottom:.25rem}.markdown-h3{font-size:1.125rem;font-weight:700;margin:.5rem 0 .25rem;color:#1e293b}.markdown-h4{font-size:1rem;font-weight:700;margin:.5rem 0 .25rem;color:#1e293b}.markdown-h5{font-size:.875rem;font-weight:700;margin:.5rem 0 .25rem;color:#1e293b}.markdown-h6{font-size:.75rem;font-weight:700;margin:.5rem 0 .25rem;color:#6b7280;text-transform:uppercase;letter-spacing:.05em}.markdown-pre{background-color:#1e293b;color:#e2e8f0;border:1px solid #334155;border-radius:.5rem;padding:1rem;margin:.75rem 0;overflow-x:auto;font-family:Fira Code,Courier New,monospace;font-size:.875rem;line-height:1.5;box-shadow:0 2px 4px #0000001a}.markdown-blockquote{border-left:4px solid var(--primary-color, #00827F);padding-left:1rem;margin:.75rem 0;color:#6b7280;font-style:italic;background-color:#f8fafc;padding:.75rem 1rem;border-radius:0 .5rem .5rem 0}.markdown-hr{border:none;height:2px;background:linear-gradient(90deg,transparent,#e2e8f0,transparent);margin:1.5rem 0}.markdown-image{max-width:100%;height:auto;border-radius:.5rem;box-shadow:0 2px 8px #0000001a;margin:.5rem 0}.markdown-table{width:100%;border-collapse:collapse;margin:.75rem 0;font-size:.875rem;box-shadow:0 1px 3px #0000001a;border-radius:.5rem;overflow:hidden}.markdown-table-header{padding:.75rem;text-align:left;font-weight:600;color:#374151;background-color:#f1f5f9}.markdown-table-cell{padding:.75rem;color:#1e293b}.markdown-checkbox{margin-right:.5rem;accent-color:var(--primary-color, #00827F)}.terminology-detail-modal .thinking-indicator{display:flex;align-items:center;gap:.5rem;color:#6b7280}.terminology-detail-modal .thinking-dots{display:flex;gap:.25rem}.terminology-detail-modal .thinking-dots .dot{width:.375rem;height:.375rem;background-color:#6b7280;border-radius:50%;animation:thinking-pulse 1.4s infinite ease-in-out}.terminology-detail-modal .thinking-text{font-size:.8rem}.term-3d-demo-section{background:#fff;border-radius:.75rem;border:1px solid #e2e8f0;overflow:hidden;box-shadow:0 2px 8px #00827f0f;margin-top:1rem}.demo-section-header{display:flex;align-items:center;gap:.5rem;padding:.875rem 1rem;background:linear-gradient(135deg,#00827f,#10b981);color:#fff}.demo-section-header .material-symbols-outlined{font-size:20px}.demo-section-header h4{margin:0;font-size:.9375rem;font-weight:600}.term-3d-container{height:300px;background:linear-gradient(to bottom,#f8f9fa,#fff);position:relative}.demo-hint{padding:.625rem 1rem;margin:0;font-size:.75rem;color:#64748b;background:#f8fafc;border-top:1px solid #e2e8f0;text-align:center}@media (max-width: 768px){.terminology-detail-modal{height:95vh;margin:.5rem}.modal-content{flex-direction:column}.term-info-panel{width:100%;height:50%;border-right:none;border-bottom:1px solid #e2e8f0}.term-chat-panel{height:50%}.term-3d-container{height:240px}}.stats-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.stat-card{background:linear-gradient(135deg,#fff,#f8fafc);border-radius:.5rem;padding:1rem;border:1px solid #e5e7eb;box-shadow:0 1px 3px #0000001a;transition:all .3s ease;display:flex;align-items:center;gap:.75rem}.stat-card:hover{transform:translateY(-1px);box-shadow:0 2px 8px #00000026;border-color:#d1d5db}.stat-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-icon .material-symbols-outlined{font-size:1.25rem;color:#fff}.stat-value{font-size:1.5rem;font-weight:700;color:var(--text-dark, #0A1414);line-height:1;margin-bottom:.125rem}.stat-title{font-size:.75rem;color:var(--text-light, #586262);font-weight:500}@media (max-width: 640px){.stats-cards{grid-template-columns:1fr;gap:.5rem}.stat-card{padding:.75rem;gap:.5rem}.stat-icon{width:2rem;height:2rem}.stat-icon .material-symbols-outlined{font-size:1rem}.stat-value{font-size:1.25rem}.stat-title{font-size:.6875rem}}.function2-container{background:linear-gradient(135deg,#f0f9ff,#e0f2fe,#f0fdf4,#fefce8,#fef7f0);background-size:400% 400%;animation:gradientShift 18s ease-in-out infinite;min-height:100vh;padding-top:4rem;width:100%;overflow-x:hidden;position:relative}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.function2-wrapper{position:relative;display:flex;min-height:100vh;width:100%;flex-direction:column;z-index:1}.function2-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 25%,rgba(0,130,127,.08) 0%,transparent 50%),radial-gradient(circle at 80% 75%,rgba(16,185,129,.08) 0%,transparent 50%),radial-gradient(circle at 45% 60%,rgba(59,130,246,.06) 0%,transparent 50%);pointer-events:none;z-index:0}.page-header{text-align:center;margin-bottom:2rem;padding:0 1rem;width:100%;box-sizing:border-box;animation:fadeInUp .8s ease-out}.module-badge{display:inline-flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding:.5rem 1rem;background:linear-gradient(135deg,#00827f1f,#00827f0a);border-radius:2rem;border:1px solid rgba(0,130,127,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;overflow:hidden}.module-badge:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);transition:left .6s ease}.module-badge:hover:before{left:100%}.page-title{color:var(--text-dark);font-size:2rem;font-weight:700;margin:0 0 .5rem;background:linear-gradient(135deg,#1e293b,#0f172a);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.page-subtitle{color:var(--text-light);font-size:1rem;max-width:600px;margin:0 auto;line-height:1.5;opacity:.9;animation:fadeInUp .8s ease-out .2s both}.filter-stats-row{display:grid;grid-template-columns:1fr 360px;gap:20px;margin-bottom:1.5rem;align-items:start}@media (max-width: 1024px){.filter-stats-row{grid-template-columns:1fr;gap:1rem}}.filter-stats-row .tag-filter{width:100%}.stats-compact{display:flex;justify-content:flex-start;width:100%}.stats-compact .stats-cards{display:flex;gap:1rem;width:100%}.stats-compact .stat-card{padding:1.125rem 1.25rem;min-width:160px;flex:1}.stats-compact .stat-icon{width:44px;height:44px}.stats-compact .stat-icon .material-symbols-outlined{font-size:24px}.stats-compact .stat-value{font-size:1.875rem;font-weight:700;line-height:1.2}.stats-compact .stat-title{font-size:.875rem;font-weight:500;margin-top:.125rem}.main-layout{display:grid;grid-template-columns:1fr;gap:2rem}@media (min-width: 1024px){.main-layout{grid-template-columns:1fr 280px}}.content-area,.sidebar-area{display:flex;flex-direction:column}.main-content-grid{display:grid;grid-template-columns:1fr;gap:2rem}@media (min-width: 1024px){.main-content-grid{grid-template-columns:2fr 1fr}}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;text-align:center}.loading-spinner{width:2rem;height:2rem;border:3px solid var(--background-light);border-top:3px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.loading-state p{color:var(--text-light);margin:0;font-size:.9rem}.pagination{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:2rem;padding:1rem 0}.pagination-button{background-color:var(--primary-color);color:#fff;border:none;padding:.5rem 1rem;border-radius:.5rem;cursor:pointer;font-size:.9rem;transition:all .2s ease}.pagination-button:hover:not(:disabled){background-color:var(--primary-dark);transform:translateY(-1px)}.pagination-button:disabled{background-color:var(--text-light);cursor:not-allowed;opacity:.6}.pagination-info{color:var(--text-light);font-size:.9rem;font-weight:500}.feedback-section{display:flex;justify-content:center;margin-top:2rem;padding:1rem 0}.terminology-layout{display:grid;grid-template-columns:40% 60%;gap:24px;margin-top:24px;height:calc(100vh - 480px);min-height:500px}.terminology-left-panel{display:flex;flex-direction:column;gap:16px;overflow-y:auto;padding-right:12px;height:100%}.recent-viewed-compact{margin-top:16px}.terminology-right-panel{background:#fff;border-radius:12px;border:1px solid #e2e8f0;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 4px 24px #00827f14,0 0 0 1px #00827f0d;transition:all .3s ease;height:100%}.terminology-right-panel:hover{box-shadow:0 8px 32px #00827f1f,0 0 0 1px #00827f1a;transform:translateY(-2px)}.robot-stage-header{padding:12px 20px;background:linear-gradient(135deg,#00827f,#10b981);position:relative;overflow:hidden}.robot-stage-header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at top right,rgba(255,255,255,.1),transparent 70%);pointer-events:none}.robot-stage-header h3{margin:0 0 4px;font-size:1rem;font-weight:600;color:#fff;display:flex;align-items:center;gap:8px;position:relative;z-index:1}.robot-stage-header h3 .material-symbols-outlined{font-size:1.25rem;color:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.robot-stage-hint{margin:0;font-size:.8125rem;color:#fffffff2;line-height:1.4;position:relative;z-index:1}.robot-stage-wrapper{flex:1;overflow:hidden;position:relative;background:linear-gradient(to bottom,#f8f9fa,#fff)}.robot-arm-stage.demonstration-mode{height:100%;min-height:550px;background:transparent;border:none;border-radius:0;display:flex;flex-direction:column}.robot-arm-stage.demonstration-mode .stage-section{flex:1;min-height:500px}.robot-arm-stage.demonstration-mode .control-panel{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(0,130,127,.2);box-shadow:0 2px 12px #00000014}.robot-arm-stage.demonstration-mode .joint-slider{accent-color:#00827F}.robot-arm-stage.demonstration-mode .slider-label{color:#2d3748;font-weight:500}@media (max-width: 1024px){.terminology-layout{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:auto}.terminology-left-panel{height:auto;max-height:500px}.terminology-right-panel{height:600px}}@media (max-width: 768px){.terminology-layout{gap:16px}.terminology-right-panel{height:500px}.robot-stage-header{padding:12px 16px}.robot-stage-header h3{font-size:1rem}.robot-stage-hint{font-size:.8125rem}}.terminology-single-column-layout{display:block;margin-top:12px;width:100%}.terminology-main-column{display:flex;flex-direction:column;gap:20px;width:100%}.pagination-external{display:flex;align-items:center;justify-content:center;gap:16px;padding:16px;background:transparent;border-radius:0;border:none;box-shadow:none}.pagination-button{padding:8px 20px;background:#00827f;color:#fff;border:none;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.pagination-button:hover:not(:disabled){background:#006b68;transform:translateY(-2px);box-shadow:0 4px 12px #00827f40}.pagination-button:active:not(:disabled){transform:translateY(0)}.pagination-button:disabled{background:#cbd5e0;cursor:not-allowed;opacity:.6}.pagination-info{font-size:.9375rem;color:#475569;font-weight:500;min-width:140px;text-align:center}.knowledge-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.knowledge-modal-content{width:90%;max-width:900px;max-height:85vh;background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;overflow:hidden;animation:slideUpScale .4s cubic-bezier(.4,0,.2,1)}@keyframes slideUpScale{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.recent-viewed-sidebar{background:#fff;border-radius:12px;border:1px solid #e2e8f0;box-shadow:0 2px 8px #00827f0f;max-height:280px;overflow:hidden;display:flex;flex-direction:column;transition:all .3s cubic-bezier(.4,0,.2,1)}.recent-viewed-sidebar:hover{box-shadow:0 4px 16px #00827f1f;transform:translateY(-2px)}.robot-3d-sidebar{background:#fff;border-radius:12px;border:1px solid #e2e8f0;box-shadow:0 2px 8px #00827f0f;overflow:hidden;display:flex;flex-direction:column;height:100%;min-height:600px;transition:all .3s cubic-bezier(.4,0,.2,1)}.robot-3d-sidebar:hover{box-shadow:0 4px 16px #00827f1f;transform:translateY(-2px)}.sidebar-header{padding:14px 18px;background:linear-gradient(135deg,#00827f,#10b981);position:relative;overflow:hidden}.sidebar-header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at top right,rgba(255,255,255,.15),transparent 70%);pointer-events:none}.sidebar-title{display:flex;align-items:center;gap:10px;color:#fff;position:relative;z-index:1}.sidebar-title .material-symbols-outlined{font-size:22px}.sidebar-title h3{margin:0;font-size:1rem;font-weight:600}.sidebar-hint{padding:10px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.demo-active{display:flex;align-items:center;gap:8px;font-size:.8125rem;color:#059669}.demo-active .pulse-dot{width:8px;height:8px;background:#10b981;border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.demo-active strong{color:#00827f;font-weight:600}.demo-idle{display:flex;align-items:center;gap:8px;font-size:.8125rem;color:#64748b}.demo-idle .material-symbols-outlined{font-size:18px;color:#94a3b8}.sidebar-3d-container{flex:1;min-height:600px;overflow:hidden;position:relative;background:linear-gradient(to bottom,#f8f9fa,#fff);display:flex;flex-direction:column}@media (max-width: 768px){.terminology-main-column{gap:16px}.knowledge-modal-content{width:95%;max-height:90vh}.pagination-external{padding:12px;gap:12px}.pagination-button{padding:6px 16px;font-size:.8125rem}.pagination-info{font-size:.875rem;min-width:120px}}.resizable-panel-container{display:flex;width:100%;height:100%;overflow:visible;position:relative}.resizable-panel{overflow:hidden;display:flex;flex-direction:column;transition:background .3s ease}.dark-mode .resizable-panel{background:#252526}.light-mode .resizable-panel{background:#f5f5f5}.left-panel,.right-panel{flex-shrink:0;overflow:visible}.center-panel{flex-grow:1;min-width:0;overflow:hidden}.resizable-panel-container.dragging{-webkit-user-select:none!important;-moz-user-select:none!important;user-select:none!important}.resizable-panel-container.dragging .resizable-panel *{-webkit-user-select:none!important;-moz-user-select:none!important;user-select:none!important;pointer-events:none!important}.resizable-panel-container.dragging .resizable-divider{pointer-events:auto!important}@media (max-width: 1024px){.resizable-divider{display:none}.resizable-panel-container{flex-direction:column}.resizable-panel{width:100%!important}}.ide-toolbox{height:100%;display:flex;flex-direction:column;overflow:hidden;transition:all .3s ease}.dark-mode .ide-toolbox{background:#252526}.light-mode .ide-toolbox{background:#f5f5f5}.toolbox-header{padding:16px;display:flex;align-items:center;gap:10px;flex-shrink:0;transition:all .3s ease}.dark-mode .toolbox-header{background:#2d2d30;border-bottom:1px solid #3e3e42}.light-mode .toolbox-header{background:#e8e8e8;border-bottom:1px solid #d0d0d0}.toolbox-header .material-symbols-outlined{color:#00827f;font-size:1.5rem}.toolbox-header h3{margin:0;font-size:.9375rem;font-weight:600;letter-spacing:.3px;transition:color .3s ease}.dark-mode .toolbox-header h3{color:#ccc}.light-mode .toolbox-header h3{color:#333}.accordion-menu{flex:1;overflow-y:auto;overflow-x:hidden}.accordion-section{transition:border-bottom .3s ease}.dark-mode .accordion-section{border-bottom:1px solid #3e3e42}.light-mode .accordion-section{border-bottom:1px solid #d0d0d0}.accordion-header{width:100%;padding:14px 16px;background:transparent;border:none;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all .2s ease;text-align:left}.dark-mode .accordion-header{color:#ccc}.light-mode .accordion-header{color:#333}.dark-mode .accordion-header:hover{background:#2d2d30}.light-mode .accordion-header:hover{background:#e8e8e8}.dark-mode .accordion-section.active .accordion-header{background:#2d2d30;color:#fff}.light-mode .accordion-section.active .accordion-header{background:#e8e8e8;color:#000}.accordion-title{display:flex;align-items:center;gap:10px;font-size:.875rem;font-weight:500}.accordion-title .material-symbols-outlined{color:#00827f;font-size:1.25rem}.accordion-arrow{color:#858585;font-size:1.25rem;transition:transform .3s ease}.accordion-section.active .accordion-arrow{color:#00827f}.accordion-content{max-height:0;overflow:hidden;transition:all .3s ease}.dark-mode .accordion-content{background:#1e1e1e}.light-mode .accordion-content{background:#fafafa}.accordion-section.active .accordion-content{max-height:1000px;padding:16px}.dark-mode .accordion-section.active .accordion-content{border-top:1px solid #3e3e42}.light-mode .accordion-section.active .accordion-content{border-top:1px solid #d0d0d0}.tool-description{margin:0 0 12px;font-size:.75rem;line-height:1.4;transition:color .3s ease}.dark-mode .tool-description{color:#858585}.light-mode .tool-description{color:#666}.search-group{display:flex;gap:8px;margin-bottom:12px}.fault-search-input{flex:1;padding:8px 12px;border-radius:4px;font-size:.8125rem;font-family:Consolas,Monaco,monospace;transition:all .2s ease}.dark-mode .fault-search-input{background:#2d2d30;border:1px solid #3e3e42;color:#ccc}.light-mode .fault-search-input{background:#fff;border:1px solid #d0d0d0;color:#333}.fault-search-input:focus{outline:none;border-color:#00827f}.dark-mode .fault-search-input:focus{background:#37373d}.light-mode .fault-search-input:focus{background:#f8f8f8;box-shadow:0 0 0 2px #00827f1a}.dark-mode .fault-search-input::-moz-placeholder{color:#6a6a6a}.dark-mode .fault-search-input::placeholder{color:#6a6a6a}.light-mode .fault-search-input::-moz-placeholder{color:#999}.light-mode .fault-search-input::placeholder{color:#999}.search-button{width:36px;height:36px;padding:0;background:#00827f;border:none;border-radius:4px;color:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.search-button:hover:not(:disabled){background:#10b981;transform:scale(1.05)}.search-button:disabled{opacity:.4;cursor:not-allowed}.search-button .material-symbols-outlined{font-size:1.25rem}.example-button{width:100%;padding:10px 14px;margin-top:10px;border:1px dashed rgba(0,130,127,.4);border-radius:6px;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-size:.8125rem;font-weight:500;transition:all .2s ease}.dark-mode .example-button{color:#00a89f}.light-mode .example-button{color:#00827f}.example-button:hover{border-style:solid;background:#00827f1a}.dark-mode .example-button:hover{border-color:#00a89f}.light-mode .example-button:hover{border-color:#00827f}.example-button .material-symbols-outlined{font-size:1.125rem}.conversion-group{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}.conversion-group label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin:0;transition:color .3s ease}.dark-mode .conversion-group label{color:#858585}.light-mode .conversion-group label{color:#666}.language-select{width:100%;padding:8px 12px;border-radius:4px;font-size:.8125rem;cursor:pointer;transition:all .2s ease}.dark-mode .language-select{background:#2d2d30;border:1px solid #3e3e42;color:#ccc}.light-mode .language-select{background:#fff;border:1px solid #d0d0d0;color:#333}.language-select:hover{border-color:#00827f}.dark-mode .language-select:focus{outline:none;border-color:#00827f;background:#37373d}.light-mode .language-select:focus{outline:none;border-color:#00827f;background:#f8f8f8;box-shadow:0 0 0 2px #00827f1a}.conversion-arrow{text-align:center;color:#00827f}.conversion-arrow .material-symbols-outlined{font-size:1.5rem}.convert-button{width:100%;padding:10px 16px;background:linear-gradient(135deg,#00827f,#10b981);border:none;border-radius:4px;color:#fff;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:4px}.convert-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #00827f4d}.convert-button .material-symbols-outlined{font-size:1.25rem}.syntax-group{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}.syntax-group label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin:0;transition:color .3s ease}.dark-mode .syntax-group label{color:#858585}.light-mode .syntax-group label{color:#666}.syntax-items{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.syntax-item{padding:10px 8px;border-radius:4px;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:.75rem;font-weight:500}.dark-mode .syntax-item{background:#2d2d30;border:1px solid #3e3e42;color:#ccc}.light-mode .syntax-item{background:#fff;border:1px solid #d0d0d0;color:#333}.dark-mode .syntax-item:hover{background:#37373d;border-color:#00827f;transform:translateY(-2px);box-shadow:0 4px 8px #00827f33}.light-mode .syntax-item:hover{background:#f8f8f8;border-color:#00827f;transform:translateY(-2px);box-shadow:0 4px 12px #00827f26}.syntax-item .material-symbols-outlined{color:#00827f;font-size:1.5rem}.syntax-item-text{line-height:1.3;word-break:keep-all}.template-list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.template-item{width:100%;padding:12px;border-radius:4px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:12px;text-align:left}.dark-mode .template-item{background:#2d2d30;border:1px solid #3e3e42;color:#ccc}.light-mode .template-item{background:#fff;border:1px solid #d0d0d0;color:#333}.dark-mode .template-item:hover{background:#37373d;border-color:#00827f;transform:translate(4px)}.light-mode .template-item:hover{background:#f8f8f8;border-color:#00827f;transform:translate(4px);box-shadow:0 2px 8px #00827f1a}.template-item .material-symbols-outlined{color:#00827f;font-size:1.5rem;flex-shrink:0}.template-info{flex:1}.template-name{font-size:.8125rem;font-weight:600;margin-bottom:2px;transition:color .3s ease}.dark-mode .template-name{color:#ccc}.light-mode .template-name{color:#333}.template-desc{font-size:.6875rem;transition:color .3s ease}.dark-mode .template-desc{color:#858585}.light-mode .template-desc{color:#666}.hint-text{font-size:.6875rem;font-style:italic;padding:8px 10px;border-left:2px solid #00827F;border-radius:2px;transition:all .3s ease}.dark-mode .hint-text{color:#6a6a6a;background:#00827f0d}.light-mode .hint-text{color:#666;background:#00827f14}.toolbox-footer{padding:12px 16px;flex-shrink:0;transition:all .3s ease}.dark-mode .toolbox-footer{background:#2d2d30;border-top:1px solid #3e3e42}.light-mode .toolbox-footer{background:#e8e8e8;border-top:1px solid #d0d0d0}.help-tip{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;background:#00827f1a;border:1px solid rgba(0,130,127,.3);border-radius:4px}.help-tip .material-symbols-outlined{color:#00827f;font-size:1.125rem;flex-shrink:0}.help-tip p{margin:0;font-size:.6875rem;line-height:1.4;transition:color .3s ease}.dark-mode .help-tip p{color:#ccc}.light-mode .help-tip p{color:#333}.accordion-menu::-webkit-scrollbar{width:6px}.dark-mode .accordion-menu::-webkit-scrollbar-track{background:#1e1e1e}.light-mode .accordion-menu::-webkit-scrollbar-track{background:#f5f5f5}.dark-mode .accordion-menu::-webkit-scrollbar-thumb{background:#3e3e42;border-radius:3px}.light-mode .accordion-menu::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:3px}.accordion-menu::-webkit-scrollbar-thumb:hover{background:#00827f}@media (max-width: 1024px){.toolbox-header,.accordion-header,.accordion-section.active .accordion-content{padding:12px}.template-item{padding:10px}}.ide-workspace{height:100%;display:flex;flex-direction:column;overflow:hidden;transition:all .3s ease}.dark-mode .ide-workspace{background:#1e1e1e}.light-mode .ide-workspace{background:#fff}.workspace-tabs{display:flex;gap:2px;overflow-x:auto;overflow-y:hidden;flex-shrink:0;transition:all .3s ease}.dark-mode .workspace-tabs{background:#2d2d30;border-bottom:1px solid #3e3e42}.light-mode .workspace-tabs{background:#f0f0f0;border-bottom:1px solid #d0d0d0}.workspace-tabs::-webkit-scrollbar{height:0}.tab-button{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:10px 16px;background:transparent;border:none;border-bottom:2px solid transparent;font-size:.8125rem;cursor:pointer;transition:all .2s ease;position:relative}.dark-mode .tab-button{color:#858585}.light-mode .tab-button{color:#666}.dark-mode .tab-button:hover{background:#2a2d2e;color:#ccc}.light-mode .tab-button:hover{background:#e8e8e8;color:#333}.dark-mode .tab-button.active{background:#1e1e1e;color:#fff;border-bottom-color:#00827f}.light-mode .tab-button.active{background:#fff;color:#000;border-bottom-color:#00827f}.tab-button .material-symbols-outlined{font-size:1.125rem}.tab-name{font-weight:500;font-family:Consolas,Monaco,monospace}.tab-close{padding:2px;background:transparent;border:none;color:#858585;cursor:pointer;border-radius:3px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.tab-close:hover{background:#3e3e42;color:#fff}.tab-close .material-symbols-outlined{font-size:1rem}.workspace-content{flex:1;overflow:hidden;display:flex;flex-direction:column}.tab-pane{flex:1;display:flex;flex-direction:column;overflow:hidden;animation:fadeIn .3s ease}.editor-toolbar,.flowchart-toolbar,.comparison-toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #3e3e42;flex-shrink:0;transition:all .3s ease}.dark-mode .editor-toolbar,.dark-mode .flowchart-toolbar,.dark-mode .comparison-toolbar{background:#2d2d30;border-bottom-color:#3e3e42}.light-mode .editor-toolbar,.light-mode .flowchart-toolbar,.light-mode .comparison-toolbar{background:#f0f0f0;border-bottom-color:#d0d0d0}.editor-info,.toolbar-info{display:flex;align-items:center;gap:8px;font-size:.8125rem;font-weight:500;transition:color .3s ease}.dark-mode .editor-info,.dark-mode .toolbar-info{color:#ccc}.light-mode .editor-info,.light-mode .toolbar-info{color:#333}.editor-info .material-symbols-outlined,.toolbar-info .material-symbols-outlined{color:#00827f;font-size:1.25rem}.editor-actions,.toolbar-actions{display:flex;gap:6px}.toolbar-btn{padding:6px;background:transparent;border-radius:4px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.dark-mode .toolbar-btn{border:1px solid #3e3e42;color:#858585}.light-mode .toolbar-btn{border:1px solid #d0d0d0;color:#666}.dark-mode .toolbar-btn:hover{background:#37373d;border-color:#00827f;color:#00827f}.light-mode .toolbar-btn:hover{background:#00827f1a;border-color:#00827f;color:#00827f}.toolbar-btn .material-symbols-outlined{font-size:1.125rem}.editor-pane{display:flex;flex-direction:column;height:100%}.monaco-editor-container{flex:1;overflow:hidden;min-height:0}.code-editor{flex:1;padding:20px;border:none;font-family:Consolas,Monaco,Courier New,monospace;font-size:.875rem;line-height:1.6;resize:none;overflow:auto;transition:all .3s ease}.dark-mode .code-editor{background:#1e1e1e;color:#d4d4d4}.light-mode .code-editor{background:#fff;color:#333;border:1px solid #e0e0e0}.code-editor:focus{outline:none}.dark-mode .code-editor:focus{box-shadow:inset 0 0 0 1px #00827f}.light-mode .code-editor:focus{box-shadow:inset 0 0 0 2px #00827f}.dark-mode .code-editor::-moz-placeholder{color:#6a6a6a;line-height:1.8}.dark-mode .code-editor::placeholder{color:#6a6a6a;line-height:1.8}.light-mode .code-editor::-moz-placeholder{color:#999;line-height:1.8}.light-mode .code-editor::placeholder{color:#999;line-height:1.8}.editor-footer{display:flex;align-items:center;justify-content:space-between;padding:6px 16px;font-size:.75rem;flex-shrink:0;transition:all .3s ease}.dark-mode .editor-footer{background:#007acc;color:#fff}.light-mode .editor-footer{background:#00827f;color:#fff}.footer-info{display:flex;gap:8px}.footer-lang{display:flex;align-items:center;gap:6px;font-weight:600}.footer-lang .material-symbols-outlined{font-size:1rem}.flowchart-container{flex:1;overflow:auto;padding:20px;transition:background .3s ease}.dark-mode .flowchart-container{background:#1e1e1e}.light-mode .flowchart-container{background:#fff}.flowchart-preview{max-width:1200px;margin:0 auto}.mermaid-code{border-radius:6px;padding:20px;margin-bottom:20px;transition:all .3s ease}.dark-mode .mermaid-code{background:#2d2d30;border:1px solid #3e3e42}.light-mode .mermaid-code{background:#f8f8f8;border:1px solid #d0d0d0}.mermaid-code pre{margin:0;font-family:Consolas,Monaco,monospace;font-size:.8125rem;line-height:1.6;white-space:pre-wrap;word-break:break-all;transition:color .3s ease}.dark-mode .mermaid-code pre{color:#d4d4d4}.light-mode .mermaid-code pre{color:#333}.flowchart-note{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;background:#00827f1a;border:1px solid rgba(0,130,127,.3);border-radius:6px;font-size:.8125rem;transition:all .3s ease}.dark-mode .flowchart-note{color:#ccc}.light-mode .flowchart-note{color:#333;background:#00827f14}.flowchart-note .material-symbols-outlined{color:#00827f;font-size:1.25rem;flex-shrink:0}.flowchart-note p{margin:0}.comparison-legend{display:flex;gap:20px;font-size:.75rem;transition:color .3s ease}.dark-mode .comparison-legend{color:#ccc}.light-mode .comparison-legend{color:#666}.legend-item{display:flex;align-items:center;gap:6px}.legend-box{width:12px;height:12px;border-radius:2px}.legend-box.source{background:#ff6b6b4d;border:1px solid rgba(255,107,107,.6)}.legend-box.target{background:#10b9814d;border:1px solid rgba(16,185,129,.6)}.comparison-container{flex:1;overflow:auto;padding:20px;transition:background .3s ease}.dark-mode .comparison-container{background:#1e1e1e}.light-mode .comparison-container{background:#fff}.side-by-side-diff{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;max-width:1400px;margin:0 auto;height:100%}.diff-column{display:flex;flex-direction:column;border-radius:6px;overflow:hidden;transition:border .3s ease}.dark-mode .diff-column{border:1px solid #3e3e42}.light-mode .diff-column{border:1px solid #d0d0d0}.diff-column.source{background:#ff6b6b0d}.diff-column.target{background:#10b9810d}.diff-header{display:flex;align-items:center;gap:8px;padding:12px 16px;font-size:.875rem;font-weight:600;transition:all .3s ease}.dark-mode .diff-header{background:#2d2d30;border-bottom:1px solid #3e3e42;color:#ccc}.light-mode .diff-header{background:#f0f0f0;border-bottom:1px solid #d0d0d0;color:#333}.diff-column.source .diff-header{border-left:3px solid rgba(255,107,107,.8)}.diff-column.target .diff-header{border-left:3px solid rgba(16,185,129,.8)}.diff-code{flex:1;margin:0;padding:20px;font-family:Consolas,Monaco,monospace;font-size:.8125rem;line-height:1.6;overflow:auto;white-space:pre-wrap;word-break:break-all;transition:color .3s ease}.dark-mode .diff-code{color:#d4d4d4}.light-mode .diff-code{color:#333}.diff-divider{display:flex;align-items:center;justify-content:center;color:#00827f}.diff-divider .material-symbols-outlined{font-size:2rem}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;gap:12px;transition:color .3s ease}.dark-mode .empty-state{color:#6a6a6a}.light-mode .empty-state{color:#999}.dark-mode .empty-state .material-symbols-outlined{font-size:4rem;color:#3e3e42}.light-mode .empty-state .material-symbols-outlined{font-size:4rem;color:#d0d0d0}.empty-state p{margin:0;font-size:1.125rem;font-weight:500;transition:color .3s ease}.dark-mode .empty-state p{color:#858585}.light-mode .empty-state p{color:#666}.empty-hint{font-size:.8125rem;max-width:400px;transition:color .3s ease}.dark-mode .empty-hint{color:#6a6a6a}.light-mode .empty-hint{color:#999}@media (max-width: 1200px){.side-by-side-diff{grid-template-columns:1fr;grid-template-rows:auto auto}.diff-divider{transform:rotate(90deg);margin:10px 0}}@media (max-width: 768px){.workspace-tabs{gap:0}.tab-button{padding:8px 12px;font-size:.75rem}.tab-name{display:none}.code-editor{padding:16px;font-size:.8125rem}}code[class*=language-],pre[class*=language-]{color:#ccc;background:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.comment,.token.block-comment,.token.prolog,.token.doctype,.token.cdata{color:#999}.token.punctuation{color:#ccc}.token.tag,.token.attr-name,.token.namespace,.token.deleted{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.number,.token.function{color:#f08d49}.token.property,.token.class-name,.token.constant,.token.symbol{color:#f8c555}.token.selector,.token.important,.token.atrule,.token.keyword,.token.builtin{color:#cc99cd}.token.string,.token.char,.token.attr-value,.token.regex,.token.variable{color:#7ec699}.token.operator,.token.entity,.token.url{color:#67cdcc}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}.message-renderer{width:100%;line-height:1.6}.thinking-section{margin-bottom:1rem;border-radius:8px;overflow:hidden;transition:all .3s ease}.message-renderer.dark .thinking-section{background:#00827f0d;border:1px solid rgba(0,130,127,.2)}.message-renderer.light .thinking-section{background:#00827f08;border:1px solid rgba(0,130,127,.15)}.thinking-toggle{width:100%;display:flex;align-items:center;gap:8px;padding:10px 12px;background:transparent;border:none;cursor:pointer;font-size:.875rem;transition:all .2s ease}.message-renderer.dark .thinking-toggle{color:#00a89f}.message-renderer.light .thinking-toggle{color:#00827f}.thinking-toggle:hover{background:#00827f1a}.thinking-toggle .material-symbols-outlined{font-size:1.25rem}.thinking-label{font-weight:600;flex-grow:1;text-align:left}.thinking-hint{font-size:.75rem;opacity:.7}.thinking-content{padding:12px;max-height:300px;overflow-y:auto;transition:all .3s ease}.message-renderer.dark .thinking-content{background:#0003;border-top:1px solid rgba(0,130,127,.2)}.message-renderer.light .thinking-content{background:#ffffff80;border-top:1px solid rgba(0,130,127,.15)}.thinking-text{font-size:.875rem;line-height:1.6;opacity:.85}.message-renderer.dark .thinking-text{color:#b0b0b0}.message-renderer.light .thinking-text{color:#666}.thinking-content::-webkit-scrollbar{width:6px}.message-renderer.dark .thinking-content::-webkit-scrollbar-track{background:#0000001a}.message-renderer.light .thinking-content::-webkit-scrollbar-track{background:#0000000d}.thinking-content::-webkit-scrollbar-thumb{background:#00827f4d;border-radius:3px}.thinking-content::-webkit-scrollbar-thumb:hover{background:#00827f80}.markdown-content{font-size:.9375rem;line-height:1.7;word-wrap:break-word}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{margin-top:1.5rem;margin-bottom:1rem;font-weight:600;line-height:1.3}.markdown-content h1{font-size:1.75rem;border-bottom:2px solid rgba(0,130,127,.3);padding-bottom:.5rem}.markdown-content h2{font-size:1.5rem;border-bottom:1px solid rgba(0,130,127,.2);padding-bottom:.4rem}.markdown-content h3{font-size:1.25rem}.markdown-content h4{font-size:1.1rem}.markdown-content h5,.markdown-content h6{font-size:1rem}.message-renderer.dark .markdown-content h1,.message-renderer.dark .markdown-content h2,.message-renderer.dark .markdown-content h3,.message-renderer.dark .markdown-content h4,.message-renderer.dark .markdown-content h5,.message-renderer.dark .markdown-content h6{color:#00a89f}.message-renderer.light .markdown-content h1,.message-renderer.light .markdown-content h2,.message-renderer.light .markdown-content h3,.message-renderer.light .markdown-content h4,.message-renderer.light .markdown-content h5,.message-renderer.light .markdown-content h6{color:#00827f}.markdown-content p{margin:.75rem 0}.markdown-content p:first-child{margin-top:0}.markdown-content p:last-child{margin-bottom:0}.markdown-content ul,.markdown-content ol{margin:.75rem 0;padding-left:2rem}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content li{margin:.5rem 0;line-height:1.6}.markdown-content li>p{margin:.25rem 0}.markdown-content ul ul,.markdown-content ul ol,.markdown-content ol ul,.markdown-content ol ol{margin:.25rem 0}.markdown-content code:not([class*=language-]){padding:.2em .4em;margin:0;font-size:.875em;border-radius:3px;font-family:Consolas,Monaco,Courier New,monospace}.message-renderer.dark .markdown-content code:not([class*=language-]){background:#00ff9f26;color:#0fa;font-weight:700;border:1px solid rgba(0,255,159,.4);text-shadow:0 0 2px rgba(0,255,159,.3)}.message-renderer.light .markdown-content code:not([class*=language-]){background:#00827f33;color:#006b68;font-weight:700;border:1px solid rgba(0,130,127,.5)}.markdown-content blockquote{margin:1rem 0;padding:.5rem 1rem;border-left:4px solid #00827F;font-style:italic}.message-renderer.dark .markdown-content blockquote{background:#00827f1a;color:#b0b0b0}.message-renderer.light .markdown-content blockquote{background:#00827f0d;color:#666}.markdown-content blockquote p{margin:.5rem 0}.markdown-content table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.875rem}.markdown-content table th,.markdown-content table td{padding:.75rem;text-align:left;border:1px solid rgba(0,130,127,.2)}.markdown-content table th{font-weight:600}.message-renderer.dark .markdown-content table th{background:#00827f26;color:#00a89f}.message-renderer.light .markdown-content table th{background:#00827f14;color:#00827f}.message-renderer.dark .markdown-content table tr:hover{background:#00827f0d}.message-renderer.light .markdown-content table tr:hover{background:#00827f08}.markdown-content hr{border:none;height:1px;background:#00827f4d;margin:1.5rem 0}.markdown-content a{color:#00827f;text-decoration:none;border-bottom:1px solid transparent;transition:all .2s ease}.markdown-content a:hover{border-bottom-color:#00827f}.message-renderer.dark .markdown-content a{color:#00a89f}.message-renderer.dark .markdown-content a:hover{border-bottom-color:#00a89f}.markdown-content del{opacity:.6}.markdown-content strong{font-weight:700;color:inherit}.markdown-content em{font-style:italic}.markdown-content input[type=checkbox]{margin-right:.5rem;cursor:pointer}.text-content{margin-bottom:.5rem;word-wrap:break-word;white-space:pre-wrap}.text-content:last-child{margin-bottom:0}.code-block-container{margin:1rem 0;border-radius:8px;overflow:hidden;transition:all .3s ease}.message-renderer.dark .code-block-container{background:#1e1e1e;border:1px solid #3e3e42}.message-renderer.light .code-block-container{background:#f8f9fa;border:1px solid #dee2e6}.code-block-container:hover{box-shadow:0 4px 12px #00827f26}.code-block-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid rgba(0,130,127,.2)}.message-renderer.dark .code-block-header{background:#2d2d30}.message-renderer.light .code-block-header{background:#e9ecef}.code-language{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#00827f}.copy-button{padding:4px 8px;background:transparent;border:none;cursor:pointer;border-radius:4px;display:flex;align-items:center;gap:4px;font-size:.75rem;transition:all .2s ease;color:#858585}.copy-button:hover{background:#00827f1a;color:#00827f}.copy-button .material-symbols-outlined{font-size:1rem}.code-block-container pre{margin:0;padding:1rem;overflow-x:auto;font-size:.875rem;line-height:1.6;font-family:Consolas,Monaco,Courier New,monospace}.message-renderer.dark .code-block-container pre{background:#1a1a1a!important}.message-renderer.light .code-block-container pre{background:#f5f5f5!important}.code-block-container code{font-family:inherit;font-size:inherit;font-weight:500!important}.message-renderer.dark .code-block-container code{color:#f0f0f0!important}.message-renderer.light .code-block-container code{color:#1a1a1a!important}.code-block-container pre::-webkit-scrollbar{height:8px}.message-renderer.dark .code-block-container pre::-webkit-scrollbar-track{background:#1e1e1e}.message-renderer.light .code-block-container pre::-webkit-scrollbar-track{background:#f8f9fa}.code-block-container pre::-webkit-scrollbar-thumb{background:#00827f;border-radius:4px}.code-block-container pre::-webkit-scrollbar-thumb:hover{background:#00a89f}.mermaid-container{background:transparent!important;border:1px solid rgba(0,130,127,.3)!important}.mermaid-diagram{padding:1.5rem;display:flex;align-items:center;justify-content:center;min-height:200px;overflow-x:auto}.message-renderer.dark .mermaid-diagram{background:#1e1e1e}.message-renderer.light .mermaid-diagram{background:#fff}.mermaid-diagram svg{max-width:100%;height:auto}.mermaid-error{padding:1rem;color:#ef4444;font-size:.875rem;text-align:center;font-style:italic}.message-renderer.dark pre[class*=language-]{background:#1a1a1a!important;color:#f0f0f0!important;font-weight:500}.message-renderer.light pre[class*=language-]{background:#f5f5f5!important;color:#0a0a0a!important;font-weight:500}.message-renderer.dark .token.keyword,.message-renderer.dark .token.control,.message-renderer.dark .token.directive{color:#4fc3f7!important;font-weight:700!important}.message-renderer.light .token.keyword,.message-renderer.light .token.control,.message-renderer.light .token.directive{color:#c7254e!important;font-weight:700!important}.message-renderer.dark .token.string{color:#ffa657!important;font-weight:600!important}.message-renderer.light .token.string{color:#00665f!important;font-weight:600!important}.message-renderer.dark .token.comment{color:#7cb668!important;font-style:italic;font-weight:500!important}.message-renderer.light .token.comment{color:#5a6269!important;font-style:italic;font-weight:600!important}.message-renderer.dark .token.function{color:#00ff9f!important;font-weight:700!important}.message-renderer.light .token.function{color:#005c59!important;font-weight:700!important}.message-renderer.dark .token.number{color:#90cdf4!important;font-weight:600!important}.message-renderer.light .token.number{color:#06c!important;font-weight:600!important}.message-renderer.dark .token.operator,.message-renderer.dark .token.punctuation{color:#f0f0f0!important;font-weight:600!important}.message-renderer.light .token.operator,.message-renderer.light .token.punctuation{color:#0a0a0a!important;font-weight:600!important}.message-renderer.dark .token.class-name{color:#4ec9b0!important;font-weight:700!important}.message-renderer.light .token.class-name{color:#005c59!important;font-weight:700!important}.message-renderer.dark .token.variable{color:#9cdcfe!important;font-weight:600!important}.message-renderer.light .token.variable{color:#0066b3!important;font-weight:600!important}.message-renderer.dark .token.property,.message-renderer.dark .token.tag,.message-renderer.dark .token.boolean,.message-renderer.dark .token.constant,.message-renderer.dark .token.symbol{color:#61dafb!important;font-weight:600!important}.message-renderer.light .token.property,.message-renderer.light .token.tag,.message-renderer.light .token.boolean,.message-renderer.light .token.constant,.message-renderer.light .token.symbol{color:#005c59!important;font-weight:600!important}@media (max-width: 768px){.code-block-container pre{font-size:.8125rem;padding:.75rem}.mermaid-diagram{padding:1rem}.code-block-header{padding:6px 10px}}.ide-ai-assistant{height:100%;display:flex;flex-direction:column;overflow:hidden;transition:all .3s ease}.dark-mode .ide-ai-assistant{background:#252526}.light-mode .ide-ai-assistant{background:#f5f5f5}.assistant-header{padding:16px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;transition:all .3s ease}.dark-mode .assistant-header{background:#2d2d30;border-bottom:1px solid #3e3e42}.light-mode .assistant-header{background:#e8e8e8;border-bottom:1px solid #d0d0d0}.header-title{display:flex;align-items:center;gap:10px}.header-title .material-symbols-outlined{color:#00827f;font-size:1.5rem}.header-title h3{margin:0;font-size:.9375rem;font-weight:600;transition:color .3s ease}.dark-mode .header-title h3{color:#ccc}.light-mode .header-title h3{color:#333}.online-indicator{width:8px;height:8px;background:#10b981;border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.header-action{padding:6px;background:transparent;border:none;cursor:pointer;border-radius:4px;transition:all .2s ease}.dark-mode .header-action{color:#858585}.light-mode .header-action{color:#666}.dark-mode .header-action:hover{background:#37373d;color:#ccc}.light-mode .header-action:hover{background:#0000000d;color:#333}.header-action .material-symbols-outlined{font-size:1.125rem}.assistant-messages{flex:1;overflow-y:auto;overflow-x:hidden;padding:16px 12px;display:flex;flex-direction:column;gap:16px}.assistant-messages::-webkit-scrollbar{width:6px}.dark-mode .assistant-messages::-webkit-scrollbar-track{background:#1e1e1e}.light-mode .assistant-messages::-webkit-scrollbar-track{background:#f5f5f5}.dark-mode .assistant-messages::-webkit-scrollbar-thumb{background:#3e3e42;border-radius:3px}.light-mode .assistant-messages::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:3px}.assistant-messages::-webkit-scrollbar-thumb:hover{background:#00827f}.message{display:flex;gap:12px;animation:slideIn .3s ease}.message.user{flex-direction:row-reverse;justify-content:flex-start}.message.user .message-content{align-items:flex-end}.message.user .message-text{text-align:left}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-avatar{flex-shrink:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.dark-mode .message-avatar{background:#2d2d30;border:1px solid #3e3e42}.light-mode .message-avatar{background:#e8e8e8;border:1px solid #d0d0d0}.message.user .message-avatar{background:#00827f!important;border-color:#00827f!important}.message.assistant .message-avatar{background:linear-gradient(135deg,#00827f,#10b981)!important;border-color:#00827f!important}.message-avatar .material-symbols-outlined{font-size:1.125rem;color:#fff}.message-content{flex:1;display:flex;flex-direction:column;gap:6px}.message-header{display:flex;align-items:center;gap:8px}.message-role{font-size:.75rem;font-weight:600;transition:color .3s ease}.dark-mode .message-role{color:#ccc}.light-mode .message-role{color:#333}.message-time{font-size:.6875rem;transition:color .3s ease}.dark-mode .message-time{color:#6a6a6a}.light-mode .message-time{color:#999}.message-text{padding:12px 14px;border-radius:8px;font-size:.8125rem;line-height:1.6;word-break:break-word;transition:all .3s ease;max-width:100%;overflow:visible;box-sizing:border-box}.dark-mode .message-text{background:#2d2d30;color:#d4d4d4}.light-mode .message-text{background:#fff;color:#333;border:1px solid #e0e0e0}.message.user .message-text{background:linear-gradient(135deg,#00827f,#00a89f)!important;color:#fff!important;border:2px solid #00827F!important;box-shadow:0 2px 8px #00827f33}.dark-mode .message.assistant .message-text{background:#2d2d30;border:2px solid #4a4a4f}.light-mode .message.assistant .message-text{background:#fff;border:2px solid #c0c0c0}.comparison-button{margin-top:12px;padding:10px 16px;border:2px solid #00827F;border-radius:8px;background:transparent;color:#00827f;cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-size:.875rem;font-weight:600;transition:all .2s ease;width:auto}.comparison-button:hover{background:#00827f;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #00827f4d}.comparison-button .material-symbols-outlined{font-size:1.25rem}.dark-mode .comparison-button{border-color:#00a89f;color:#00a89f}.dark-mode .comparison-button:hover{background:#00a89f;color:#fff}.light-mode .comparison-button{border-color:#00827f;color:#00827f}.light-mode .comparison-button:hover{background:#00827f;color:#fff}.typing-indicator{display:flex;gap:4px;padding:10px 14px;border-radius:8px;width:-moz-fit-content;width:fit-content;transition:all .3s ease}.dark-mode .typing-indicator{background:#2d2d30;border:1px solid #3e3e42}.light-mode .typing-indicator{background:#fff;border:1px solid #d0d0d0}.typing-indicator span{width:6px;height:6px;background:#00827f;border-radius:50%;animation:typing 1.4s infinite}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-8px);opacity:1}}.quick-actions{padding:0 12px 12px;flex-shrink:0}.quick-actions-title{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;transition:color .3s ease}.dark-mode .quick-actions-title{color:#858585}.light-mode .quick-actions-title{color:#666}.quick-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.quick-action-btn{padding:10px 12px;border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:.75rem}.dark-mode .quick-action-btn{background:#2d2d30;border:1px solid #3e3e42;color:#ccc}.light-mode .quick-action-btn{background:#fff;border:1px solid #d0d0d0;color:#333}.dark-mode .quick-action-btn:hover{background:#37373d;border-color:#00827f;transform:translateY(-2px);box-shadow:0 4px 12px #00827f33}.light-mode .quick-action-btn:hover{background:#f8f8f8;border-color:#00827f;transform:translateY(-2px);box-shadow:0 4px 12px #00827f26}.quick-action-btn .material-symbols-outlined{font-size:1.5rem;color:#00827f}.assistant-input{display:flex;flex-direction:column;gap:8px;padding:12px;flex-shrink:0;transition:all .3s ease}.dark-mode .assistant-input{background:#2d2d30;border-top:1px solid #3e3e42}.light-mode .assistant-input{background:#f0f0f0;border-top:1px solid #d0d0d0}.input-field{flex:1;padding:8px 12px;border-radius:6px;font-size:.8125rem;font-family:inherit;resize:none;min-height:36px;max-height:120px;transition:all .2s ease}.dark-mode .input-field{background:#1e1e1e;border:1px solid #3e3e42;color:#d4d4d4}.light-mode .input-field{background:#fff;border:1px solid #d0d0d0;color:#333}.input-field:focus{outline:none;border-color:#00827f}.dark-mode .input-field:focus{box-shadow:0 0 0 2px #00827f33}.light-mode .input-field:focus{box-shadow:0 0 0 2px #00827f26}.input-field::-moz-placeholder{color:#6a6a6a}.input-field::placeholder{color:#6a6a6a}.send-button{width:36px;height:36px;padding:0;background:linear-gradient(135deg,#00827f,#10b981);border:none;border-radius:6px;color:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.send-button:hover:not(:disabled){transform:scale(1.05);box-shadow:0 4px 12px #00827f66}.send-button:disabled{opacity:.4;cursor:not-allowed}.input-row{display:flex;gap:6px;align-items:flex-end;width:100%;box-sizing:border-box}.upload-button{width:36px;height:36px;padding:0;background:transparent;border:1px solid #3e3e42;border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.dark-mode .upload-button{border-color:#3e3e42;color:#00827f}.light-mode .upload-button{border-color:#d0d0d0;color:#00827f}.upload-button:hover{background:#00827f1a;border-color:#00827f;transform:scale(1.05)}.upload-button .material-symbols-outlined{font-size:1.25rem}.image-preview{position:relative;max-width:200px;border-radius:8px;overflow:hidden;transition:all .3s ease;animation:fadeIn .3s ease}.image-preview img{width:100%;height:auto;display:block;border-radius:8px}.dark-mode .image-preview{border:2px solid #3e3e42;background:#1e1e1e}.light-mode .image-preview{border:2px solid #d0d0d0;background:#f8f8f8}.remove-image{position:absolute;top:6px;right:6px;width:24px;height:24px;padding:0;background:#000000b3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.remove-image:hover{background:#ef4444;transform:scale(1.1)}.remove-image .material-symbols-outlined{font-size:1rem}.message-image{margin-bottom:12px;border-radius:8px;overflow:hidden;max-width:400px;transition:all .3s ease;animation:fadeIn .5s ease}.message-image img{width:100%;height:auto;display:block;cursor:pointer;transition:transform .3s ease}.message-image img:hover{transform:scale(1.02)}.dark-mode .message-image{border:1px solid #3e3e42;background:#1e1e1e}.light-mode .message-image{border:1px solid #d0d0d0;background:#f8f8f8}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.send-button .material-symbols-outlined{font-size:1.25rem}.assistant-footer{padding:8px 16px;display:flex;align-items:center;gap:6px;flex-shrink:0;transition:all .3s ease}.dark-mode .assistant-footer{background:#2d2d30;border-top:1px solid #3e3e42}.light-mode .assistant-footer{background:#e8e8e8;border-top:1px solid #d0d0d0}.assistant-footer .material-symbols-outlined{font-size:1rem;transition:color .3s ease}.dark-mode .assistant-footer .material-symbols-outlined{color:#858585}.light-mode .assistant-footer .material-symbols-outlined{color:#666}.assistant-footer p{margin:0;font-size:.6875rem;transition:color .3s ease}.dark-mode .assistant-footer p{color:#6a6a6a}.light-mode .assistant-footer p{color:#666}@media (max-width: 1024px){.quick-actions-grid{grid-template-columns:1fr}.message{gap:10px}.message-avatar{width:28px;height:28px}.message-text{font-size:.75rem;padding:8px 12px}}.function3-container{background:linear-gradient(180deg,#f5f8f8,#f0fafa,#f5f8f8);min-height:100vh;height:100vh;padding-top:4rem;width:100%;overflow:hidden}.function3-wrapper{position:relative;display:flex;width:100%;height:calc(100vh - 4rem);flex-direction:column;overflow:hidden}.page-header{text-align:center;margin-bottom:1.5rem;padding:1rem 1rem 0;flex-shrink:0}.module-badge{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:.75rem;padding:.375rem 1rem;background:linear-gradient(135deg,#00827f1a,#00827f0d);border-radius:2rem;border:1px solid rgba(0,130,127,.2);box-shadow:0 2px 8px #00827f1a}.module-icon{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary-color),#00a89f);border-radius:50%;width:2rem;height:2rem;box-shadow:0 2px 6px #00827f4d}.page-title{color:var(--text-dark);font-size:1.5rem;font-weight:800;margin:0 0 .5rem;letter-spacing:-.5px}@media (min-width: 768px){.page-title{font-size:1.75rem}}.page-subtitle{color:var(--text-light);margin:0 0 1rem;font-size:.875rem;max-width:600px;margin-left:auto;margin-right:auto;line-height:1.5}.theme-toggle-btn{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;padding:.625rem 1.25rem;background:linear-gradient(135deg,#00827f1a,#00827f0d);border:1px solid rgba(0,130,127,.3);border-radius:2rem;color:var(--primary-color);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #00827f1a}.theme-toggle-btn:hover{background:linear-gradient(135deg,#00827f33,#00827f1a);border-color:#00827f80;transform:translateY(-2px);box-shadow:0 4px 12px #00827f33}.theme-toggle-btn .material-symbols-outlined{font-size:1.25rem}.content-grid{display:grid;grid-template-columns:1fr;gap:1.25rem;padding:0;margin:0 auto;width:100%}@media (min-width: 1280px){.content-grid{grid-template-columns:1.6fr 3.5fr 1.6fr;gap:1.5rem;height:680px}.content-grid.content-grid-two-col{grid-template-columns:1.5fr 3fr;gap:1.5rem;height:750px}}@media (min-width: 1600px){.content-grid{grid-template-columns:1.8fr 3.5fr 1.8fr;gap:1.8rem;height:750px}.content-grid.content-grid-two-col{grid-template-columns:1.6fr 3.2fr;gap:1.8rem;height:820px}}@media (min-width: 1024px) and (max-width: 1279px){.content-grid{grid-template-columns:1fr;gap:1.5rem}.left-split-panel,.robot-stage-panel,.ai-panel{height:600px}.content-grid.content-grid-two-col .left-split-panel,.content-grid.content-grid-two-col .robot-stage-panel{height:650px}}@media (max-width: 1023px){.left-split-panel,.robot-stage-panel,.ai-panel{min-height:400px;height:auto}.resizable-divider{display:none}.left-split-panel{gap:1rem}.code-flowchart-container,.diagnostic-container{flex:1 1 300px;min-height:300px}}.left-split-panel{width:100%;height:100%;display:flex;flex-direction:column;gap:0;background:#fff;border-radius:16px;border:1px solid rgba(0,130,127,.1);box-shadow:0 4px 20px #00000014,0 0 0 1px #ffffff80 inset;overflow:hidden;transition:all .3s ease}.left-split-panel:hover{border-color:#00827f33;box-shadow:0 8px 30px #0000001f,0 0 0 1px #00827f1a inset}.code-flowchart-container{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.resizable-divider{display:none}.diagnostic-container{flex:0 0 60px;min-height:60px;max-height:60px;overflow:hidden;display:flex;flex-direction:column;border-top:1px solid rgba(0,130,127,.1)}@media (max-width: 1279px){.diagnostic-container{flex:0 0 55px;min-height:55px;max-height:55px}}@media (max-width: 768px){.diagnostic-container{flex:0 0 50px;min-height:50px;max-height:50px}}.workspace-panel-container{width:100%;height:100%;position:relative}.robot-stage-panel{width:100%;height:100%;background:linear-gradient(135deg,#e0f2f1,#b2dfdb,#e0f2f1);border-radius:16px;padding:0;box-shadow:0 10px 40px #00827f33,0 0 0 1px #00827f1a;overflow:hidden;position:relative;border:1px solid rgba(0,130,127,.15)}.robot-stage-panel:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,130,127,.3) 50%,transparent);pointer-events:none}.robot-stage-panel>div{width:100%!important;height:100%!important}.robot-stage-panel.robot-stage-expanded{box-shadow:0 12px 45px #00827f40,0 0 0 1px #00827f26}.ai-panel{width:100%;height:100%;position:relative;background:#fff;border-radius:16px;border:1px solid rgba(0,130,127,.1);box-shadow:0 4px 20px #00000014,0 0 0 1px #ffffff80 inset;overflow:hidden;transition:all .3s ease;display:flex;flex-direction:column}.ai-panel:hover{border-color:#00827f33;box-shadow:0 8px 30px #0000001f,0 0 0 1px #00827f1a inset}.ai-panel .panel-header{flex-shrink:0}.ai-panel .panel-content{flex:1;min-height:0;overflow:hidden}@media (min-width: 768px) and (max-width: 1023px){.content-grid{grid-template-columns:1fr;gap:1rem}.panel-header{padding:.75rem 1rem}.panel-title{font-size:.85rem}.panel-action-btn{width:26px;height:26px}}.main-content{flex:1;padding:0;width:100%;display:flex;flex-direction:column;min-height:0;overflow:hidden}.content-container{flex:1;max-width:100%;width:100%;margin:0 auto;padding:0 1rem 1rem;display:flex;flex-direction:column;min-height:0;overflow:hidden}@media (min-width: 1280px){.content-container{padding:0 1.5rem 1rem;max-width:1600px}}@media (min-width: 1440px){.content-container{padding:0 2rem 1rem;max-width:1800px}}@media (min-width: 1920px){.content-container{max-width:2000px;padding:0 2.5rem 1rem}}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:.875rem 1.25rem;background:linear-gradient(135deg,#00827f0a,#00827f05);border-bottom:1px solid rgba(0,130,127,.1);flex-shrink:0}.panel-title{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.9rem;color:var(--text-dark)}.panel-title .material-symbols-outlined{font-size:1.25rem;color:var(--primary-color)}.panel-actions{display:flex;gap:.375rem}.panel-action-btn{width:28px;height:28px;border-radius:6px;background:transparent;border:1px solid rgba(0,130,127,.15);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;padding:0}.panel-action-btn .material-symbols-outlined{font-size:1rem;color:var(--text-light);transition:color .2s ease}.panel-action-btn:hover{background:#00827f1a;border-color:#00827f4d}.panel-action-btn:hover .material-symbols-outlined{color:var(--primary-color)}.panel-action-btn:active{transform:scale(.95)}.panel-content{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.panel-content>*{flex:1;min-height:0}.ai-assistant-notice{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-top:1.5rem;margin-bottom:.5rem;padding:.875rem 1.5rem;background:linear-gradient(135deg,#00827f0d,#00827f05);border:1px solid rgba(0,130,127,.15);border-radius:12px;color:var(--text-dark);font-size:.875rem;box-shadow:0 2px 8px #00827f1a;transition:all .3s ease}.ai-assistant-notice:hover{background:linear-gradient(135deg,#00827f14,#00827f0a);border-color:#00827f40;box-shadow:0 4px 12px #00827f26}.ai-assistant-notice .material-symbols-outlined{font-size:1.5rem;color:var(--primary-color);flex-shrink:0}.ai-assistant-notice p{margin:0;font-weight:500;color:var(--text-light)}@media (max-width: 768px){.ai-assistant-notice{flex-direction:column;text-align:center;padding:.875rem 1rem;font-size:.85rem}.ai-assistant-notice .material-symbols-outlined{font-size:1.25rem}}.ide-layout{flex:1;margin-top:16px;min-height:500px;height:calc(100vh - 260px);border-radius:8px;overflow:visible;transition:all .3s ease;position:relative}.ide-layout.dark-mode{background:#1e1e1e;border:1px solid #3e3e42;box-shadow:0 8px 32px #0000001f}.ide-layout.light-mode{background:#fff;border:1px solid #e0e0e0;box-shadow:0 4px 24px #00000014}.ide-left-panel{height:100%;overflow-y:auto;transition:all .3s ease}.dark-mode .ide-left-panel{background:#252526;color:#ccc}.light-mode .ide-left-panel{background:#f5f5f5;color:#333}.ide-center-panel{height:100%;display:flex;flex-direction:column;overflow:hidden;transition:all .3s ease}.dark-mode .ide-center-panel{background:#1e1e1e}.light-mode .ide-center-panel{background:#fff}.diagnostic-compact{flex-shrink:0;transition:all .3s ease}.dark-mode .diagnostic-compact{background:#2d2d30;border-bottom:1px solid #3e3e42}.light-mode .diagnostic-compact{background:#f0f0f0;border-bottom:1px solid #d0d0d0}.code-workspace{flex:1;overflow:hidden;display:flex;flex-direction:column;transition:all .3s ease}.dark-mode .code-workspace{background:#1e1e1e}.light-mode .code-workspace{background:#fff}.ide-right-panel{height:100%;overflow-y:auto;transition:all .3s ease}.dark-mode .ide-right-panel{background:#252526;color:#ccc}.light-mode .ide-right-panel{background:#f5f5f5;color:#333}@media (max-height: 800px){.ide-layout{min-height:450px;height:calc(100vh - 180px)}}@media (max-height: 700px){.ide-layout{min-height:400px;height:calc(100vh - 160px)}}@media (min-height: 900px){.ide-layout{height:calc(100vh - 240px)}}@media (min-height: 1080px){.ide-layout{height:calc(100vh - 260px)}}@media (max-width: 1024px){.ide-layout{height:auto;min-height:600px}}@media (max-width: 768px){.ide-layout{margin-top:12px;border-radius:8px;min-height:500px}}.tab-navigation{border-bottom:1px solid #e5e7eb;margin-bottom:1.5rem}.tab-nav{display:flex;gap:1.5rem;margin-bottom:-1px}.tab-button{white-space:nowrap;padding:1rem .25rem;border-bottom:2px solid transparent;font-weight:500;font-size:.875rem;color:#6b7280;background:none;border:none;cursor:pointer;transition:all .2s}.tab-button:hover{color:#374151;border-bottom-color:#d1d5db}.tab-button.active{color:var(--primary-color, #00827F);border-bottom-color:var(--primary-color, #00827F);background-color:#00827f0d}.project-selector{width:100%;padding:0}.project-selector-header{text-align:left;margin-bottom:24px}.project-selector-header h2{font-size:24px;color:#1f2937;margin:0 0 8px;font-weight:600}.project-selector-header p{font-size:15px;color:#6b7280;margin:0}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:0}.project-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 2px 8px #0000000f;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;display:flex;flex-direction:column;border:1px solid #f3f4f6;position:relative}.project-card:hover{transform:translateY(-6px);box-shadow:0 12px 32px #00827f26;border-color:#00827f}.project-icon-section{padding:40px 32px;display:flex;align-items:center;justify-content:center;position:relative;min-height:140px}.project-icon{font-size:72px;font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 48;opacity:.9}.project-content{flex:1;padding:24px 28px;display:flex;flex-direction:column;gap:12px}.project-label{font-size:12px;font-weight:600;color:#00827f;text-transform:uppercase;letter-spacing:.8px;opacity:.9}.project-title{font-size:19px;font-weight:600;color:#1f2937;margin:0;line-height:1.4}.project-description{font-size:14px;color:#6b7280;line-height:1.7;margin:0;flex:1;min-height:60px}.project-meta{display:flex;align-items:center;gap:12px;padding-top:16px;margin-top:8px}.meta-item{display:flex;align-items:center;gap:6px;font-size:13px;color:#6b7280;background:#f9fafb;padding:6px 12px;border-radius:6px}.meta-item .material-symbols-outlined{font-size:16px;color:#00827f}.project-action{padding:20px 28px 28px;background:linear-gradient(to bottom,transparent,rgba(249,250,251,.5))}.btn-start-project{width:100%;padding:14px 24px;background:linear-gradient(135deg,#00827f,#00a89f);color:#fff;border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 2px 8px #00827f33}.btn-start-project .material-symbols-outlined{font-size:20px}.btn-start-project:hover{background:linear-gradient(135deg,#006b68,#008a81);box-shadow:0 4px 16px #00827f4d;transform:translateY(-1px)}.project-card:hover .btn-start-project{transform:translateY(-1px) scale(1.02)}@media (max-width: 1200px){.projects-grid{grid-template-columns:repeat(2,1fr);gap:20px}}@media (max-width: 768px){.projects-grid{grid-template-columns:1fr;gap:16px}.project-icon-section{padding:32px 24px;min-height:120px}.project-icon{font-size:56px}.project-content{padding:20px 24px}.project-title{font-size:18px}.project-description{font-size:13px;min-height:50px}.project-action{padding:16px 24px 24px}}.exam-panel{width:100%;min-height:600px;display:flex;flex-direction:column}.exam-loading,.exam-submitting{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;gap:20px}.loading-spinner{width:48px;height:48px;border:4px solid #e5e7eb;border-top-color:#00827f;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.exam-submitting h3{font-size:24px;color:#1f2937;margin:0}.exam-submitting p{font-size:16px;color:#6b7280;margin:8px 0}.submitting-tips{margin-top:20px;padding:16px;background:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;color:#0369a1;font-size:14px;line-height:1.6;max-width:500px;text-align:center}.exam-error{display:flex;flex-direction:column;align-items:center;padding:60px 20px;gap:16px}.error-icon{font-size:64px;color:#ef4444}.exam-error h3{font-size:24px;color:#1f2937;margin:0}.exam-error p{font-size:16px;color:#6b7280;text-align:center}.error-actions{display:flex;gap:12px;margin-top:16px}.btn-retry,.btn-back{padding:10px 24px;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px}.btn-retry{background:#00827f;color:#fff;border:none}.btn-retry:hover{background:#006b68}.btn-back{background:#fff;color:#374151;border:1px solid #d1d5db}.btn-back:hover{background:#f9fafb}.exam-ready{max-width:600px;margin:40px auto;padding:32px;background:#fff;border-radius:16px;box-shadow:0 1px 3px #0000001a}.ready-header{display:flex;align-items:center;gap:16px;margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid #e5e7eb}.ready-icon{font-size:48px;color:#00827f}.ready-header h2{font-size:24px;color:#1f2937;margin:0}.ready-info{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}.info-item{display:flex;align-items:center;gap:12px;padding:12px;background:#f9fafb;border-radius:8px}.info-item .material-symbols-outlined{font-size:24px;color:#00827f}.info-item span:last-child{font-size:16px;color:#374151}.ready-actions{display:flex;gap:12px;justify-content:center}.btn-start-exam{padding:14px 32px;background:#00827f;color:#fff;border:none;border-radius:8px;font-size:18px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px}.btn-start-exam:hover{background:#006b68;transform:translateY(-2px);box-shadow:0 4px 12px #00827f4d}.btn-cancel{padding:14px 32px;background:#fff;color:#374151;border:1px solid #d1d5db;border-radius:8px;font-size:18px;font-weight:500;cursor:pointer;transition:all .2s}.btn-cancel:hover{background:#f9fafb}.exam-header{background:#fff;border-bottom:1px solid #e5e7eb;padding:16px 24px}.exam-progress-bar{width:100%;height:6px;background:#e5e7eb;border-radius:3px;margin-bottom:12px;overflow:hidden}.exam-progress-fill{height:100%;background:linear-gradient(90deg,#00827f,#00a89f);transition:width .3s ease}.exam-info{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.exam-project-name{font-size:16px;font-weight:600;color:#1f2937}.exam-question-counter,.exam-answered-counter{font-size:14px;color:#6b7280}.exam-question-container{flex:1;padding:32px;overflow-y:auto;background:#f9fafb}.question-header{display:flex;align-items:center;gap:12px;margin-bottom:24px;flex-wrap:wrap}.question-number{font-size:18px;font-weight:600;color:#1f2937}.question-difficulty{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500}.difficulty-easy{background:#d1fae5;color:#065f46}.difficulty-medium{background:#fef3c7;color:#92400e}.difficulty-hard{background:#fee2e2;color:#991b1b}.question-knowledge{padding:4px 12px;background:#dbeafe;color:#1e40af;border-radius:12px;font-size:12px;font-weight:500}.question-stem{font-size:18px;line-height:1.8;color:#1f2937;margin-bottom:32px;padding:24px;background:#fff;border-radius:12px;border-left:4px solid #00827F}.question-options{display:flex;flex-direction:column;gap:16px}.option-card{display:flex;align-items:center;gap:16px;padding:20px;background:#fff;border:2px solid #e5e7eb;border-radius:12px;cursor:pointer;transition:all .2s}.option-card:hover{border-color:#00827f;transform:translate(4px);box-shadow:0 4px 12px #00827f1a}.option-card.selected{border-color:#00827f;background:#f0fdfa}.option-marker{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#f3f4f6;border-radius:50%;font-size:16px;font-weight:600;color:#6b7280;flex-shrink:0}.option-card.selected .option-marker{background:#00827f;color:#fff}.option-text{flex:1;font-size:16px;line-height:1.6;color:#374151}.option-check{font-size:24px;color:#00827f;flex-shrink:0}.exam-navigation{display:flex;justify-content:space-between;align-items:center;padding:20px 32px;background:#fff;border-top:1px solid #e5e7eb;gap:16px}.nav-actions{display:flex;gap:12px}.btn-nav{padding:10px 20px;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px;border:1px solid #d1d5db;background:#fff;color:#374151}.btn-nav:hover:not(:disabled){background:#f9fafb;border-color:#00827f;color:#00827f}.btn-nav:disabled{opacity:.5;cursor:not-allowed}.btn-exit{padding:10px 20px;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s;border:1px solid #d1d5db;background:#fff;color:#6b7280}.btn-exit:hover{background:#f9fafb}.btn-submit{padding:10px 24px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px;border:none;background:#00827f;color:#fff}.btn-submit:hover:not(:disabled){background:#006b68;transform:translateY(-2px);box-shadow:0 4px 12px #00827f4d}.btn-submit:disabled{opacity:.5;cursor:not-allowed}.exam-completed{max-width:900px;margin:40px auto;padding:32px}.completed-header{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:32px}.success-icon{font-size:64px;color:#10b981}.completed-header h2{font-size:32px;color:#1f2937;margin:0}.exam-report{background:#fff;padding:32px;border-radius:12px;margin-bottom:24px;box-shadow:0 1px 3px #0000001a;max-height:600px;overflow-y:auto}.report-h1{font-size:28px;color:#1f2937;margin:24px 0 16px;padding-bottom:12px;border-bottom:2px solid #e5e7eb}.report-h2{font-size:24px;color:#374151;margin:20px 0 12px}.report-h3{font-size:20px;color:#4b5563;margin:16px 0 10px}.report-p{font-size:16px;line-height:1.8;color:#4b5563;margin:12px 0}.report-li{font-size:16px;line-height:1.8;color:#4b5563;margin:8px 0}.report-code-inline{background:#f3f4f6;padding:2px 6px;border-radius:4px;font-family:Courier New,monospace;font-size:14px;color:#d97706}.report-code{display:block;background:#1f2937;color:#e5e7eb;padding:16px;border-radius:8px;font-family:Courier New,monospace;font-size:14px;overflow-x:auto}.feishu-link{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px;background:#eff6ff;border-radius:8px;margin-bottom:24px}.feishu-link .material-symbols-outlined{font-size:24px;color:#3b82f6}.feishu-link a{color:#3b82f6;text-decoration:none;font-weight:500;font-size:16px}.feishu-link a:hover{text-decoration:underline}.completed-actions{display:flex;gap:12px;justify-content:center}.btn-restart,.btn-back-to-projects{padding:14px 32px;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px}.btn-restart{background:#00827f;color:#fff;border:none}.btn-restart:hover{background:#006b68;transform:translateY(-2px);box-shadow:0 4px 12px #00827f4d}.btn-back-to-projects{background:#fff;color:#374151;border:1px solid #d1d5db}.btn-back-to-projects:hover{background:#f9fafb}.exam-error-toast{position:fixed;bottom:32px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:12px;padding:16px 24px;background:#fee2e2;color:#991b1b;border-radius:8px;box-shadow:0 4px 12px #0000001a;z-index:1000;animation:slideUp .3s ease}@keyframes slideUp{0%{bottom:-100px;opacity:0}to{bottom:32px;opacity:1}}@media (max-width: 768px){.exam-question-container{padding:20px}.question-stem{font-size:16px;padding:16px}.option-card{padding:16px}.option-text{font-size:15px}.exam-navigation{flex-direction:column;padding:16px}.nav-actions{width:100%;flex-direction:column}.btn-nav,.btn-exit,.btn-submit{width:100%;justify-content:center}.exam-report{padding:20px}}.exam-score-display{max-width:800px;margin:40px auto;padding:32px}.score-header{display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:32px}.score-header h2{font-size:32px;color:#1f2937;margin:0}.score-content{background:#fff;border-radius:16px;padding:32px;box-shadow:0 4px 6px -1px #0000001a}.score-main{text-align:center;padding-bottom:24px;border-bottom:2px solid #e5e7eb;margin-bottom:24px}.score-accuracy{font-size:72px;font-weight:700;line-height:1;margin-bottom:8px}.score-unit{font-size:32px;font-weight:600;margin-left:4px}.score-level{font-size:24px;font-weight:600;margin-top:8px}.score-details{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}.score-detail-item{display:flex;flex-direction:column;align-items:center;padding:16px;background:#f9fafb;border-radius:12px}.detail-label{font-size:14px;color:#6b7280;margin-bottom:8px}.detail-value{font-size:24px;font-weight:600;color:#1f2937}.detail-value.correct{color:#10b981}.detail-value.wrong{color:#ef4444}.report-status-box{display:flex;gap:16px;padding:20px;background:#f0f9ff;border:2px dashed #0ea5e9;border-radius:12px;margin-top:24px}.report-status-icon{flex-shrink:0}.loading-spinner.small{width:32px;height:32px;border-width:3px}.report-status-text h4{font-size:16px;color:#0369a1;margin:0 0 8px}.report-status-text p{font-size:14px;color:#075985;margin:0 0 8px}.report-status-text ul{margin:0;padding-left:20px;font-size:14px;color:#0c4a6e}.report-status-text li{margin:4px 0}.score-actions{display:flex;gap:12px;justify-content:center;margin-top:32px}.btn-view-history{padding:12px 24px;background:#0ea5e9;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px}.btn-view-history:hover{background:#0284c7;transform:translateY(-1px);box-shadow:0 4px 6px -1px #0003}@media (max-width: 768px){.exam-score-display{padding:16px;margin:20px auto}.score-content{padding:20px}.score-accuracy{font-size:56px}.score-unit{font-size:24px}.score-level{font-size:20px}.score-details{grid-template-columns:1fr}.report-status-box{flex-direction:column;text-align:center}.score-actions{flex-direction:column;gap:8px}.btn-restart,.btn-back-to-projects,.btn-view-history{width:100%;justify-content:center}}.report-history-panel{width:100%;min-height:600px;padding:24px}.report-history-header{margin-bottom:24px}.report-history-header h2{display:flex;align-items:center;gap:12px;font-size:24px;font-weight:600;color:#1f2937;margin:0 0 8px}.report-history-header h2 .material-symbols-outlined{font-size:28px;color:#00827f}.history-count{color:#6b7280;font-size:14px;margin:0}.report-history-content{display:flex;gap:24px;align-items:flex-start}.history-list{flex:1;display:flex;flex-direction:column;gap:16px;max-width:600px}.history-item{background:#fff;border:2px solid #e5e7eb;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease}.history-item:hover{border-color:#00827f;box-shadow:0 4px 12px #00827f1a;transform:translateY(-2px)}.history-item.active{border-color:#00827f;background:#f0fdfa;box-shadow:0 4px 12px #00827f26}.history-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #e5e7eb}.history-project{display:flex;align-items:center;gap:8px;font-weight:600;color:#1f2937;font-size:16px}.history-project .material-symbols-outlined{font-size:20px;color:#00827f}.history-time{display:flex;align-items:center;gap:6px;color:#6b7280;font-size:14px}.history-time .material-symbols-outlined{font-size:16px}.history-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat-item{display:flex;flex-direction:column;align-items:center;gap:4px}.stat-label{font-size:12px;color:#6b7280;text-align:center}.stat-value{font-size:18px;font-weight:600;color:#1f2937}.stat-value.accuracy{font-size:20px}.stat-value.level{font-size:14px;padding:2px 8px;border-radius:4px;background:#00827f1a}.report-history-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;text-align:center}.report-history-empty .material-symbols-outlined{font-size:64px;color:#d1d5db;margin-bottom:16px}.report-history-empty h3{font-size:20px;color:#6b7280;margin:0 0 8px}.report-history-empty p{font-size:14px;color:#9ca3af;margin:0}.report-detail{flex:1;background:#fff;border:2px solid #e5e7eb;border-radius:12px;padding:24px;max-height:80vh;overflow-y:auto}.report-detail-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid #e5e7eb}.report-detail-header h3{font-size:20px;font-weight:600;color:#1f2937;margin:0}.close-btn{background:none;border:none;cursor:pointer;padding:8px;border-radius:6px;color:#6b7280;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.close-btn:hover{background:#f3f4f6;color:#1f2937}.report-detail-content{line-height:1.8;color:#374151}.report-detail-placeholder{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;background:#f9fafb;border-radius:12px;text-align:center}.report-detail-placeholder .material-symbols-outlined{font-size:48px;color:#9ca3af;margin-bottom:16px}.report-detail-placeholder p{color:#6b7280;font-size:14px;margin:0 0 16px;max-width:400px}.feishu-link-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:#00827f;color:#fff;text-decoration:none;border-radius:8px;font-weight:500;transition:all .2s ease;margin-top:8px}.feishu-link-btn:hover{background:#006b68;transform:translateY(-2px);box-shadow:0 4px 12px #00827f4d}.feishu-link-btn .material-symbols-outlined{font-size:18px}.report-h1{font-size:28px;font-weight:700;color:#1f2937;margin:24px 0 16px;padding-bottom:8px;border-bottom:2px solid #e5e7eb}.report-h2{font-size:22px;font-weight:600;color:#1f2937;margin:20px 0 12px}.report-h3{font-size:18px;font-weight:600;color:#374151;margin:16px 0 8px}.report-p{margin:12px 0;line-height:1.8;color:#374151}.report-ul,.report-ol{margin:12px 0;padding-left:24px}.report-li{margin:8px 0;line-height:1.8;color:#374151}.report-code{background:#f3f4f6;padding:2px 6px;border-radius:4px;font-family:Courier New,monospace;font-size:14px;color:#dc2626}.report-blockquote{border-left:4px solid #00827F;padding-left:16px;margin:16px 0;color:#6b7280;font-style:italic}@media (max-width: 1024px){.report-history-content{flex-direction:column}.history-list{max-width:100%}.report-detail{max-height:none}}@media (max-width: 768px){.history-stats{grid-template-columns:repeat(2,1fr)}.report-history-panel{padding:16px}}.history-status{display:flex;align-items:center}.status-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border-radius:12px;font-size:13px;font-weight:500;color:#fff}.status-badge .material-symbols-outlined{font-size:16px}.processing-hint{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px;background:#fef3c7;border-radius:8px;font-size:14px;color:#92400e}.processing-spinner{width:20px;height:20px;border:3px solid #fbbf24;border-top-color:#f59e0b;border-radius:50%;animation:spin 1s linear infinite}.history-item.processing{border-color:#fbbf24;background:linear-gradient(to right,#fffbeb,#fff)}.error-hint{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px;background:#fee2e2;border-radius:8px;font-size:14px;color:#991b1b}.error-hint .material-symbols-outlined{font-size:20px;color:#dc2626}.error-book-panel-modern{width:100%}.error-book-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;margin-bottom:2rem;flex-wrap:wrap}.header-title-group{flex:1;min-width:250px}.error-book-title{display:flex;align-items:center;gap:.75rem;font-size:1.75rem;font-weight:700;color:var(--text-dark, #0A1414);margin:0 0 .5rem}.error-book-title .material-symbols-outlined{font-size:2rem;color:var(--primary-color, #00827F)}.error-book-subtitle{font-size:.875rem;color:var(--text-light, #6B7280);margin:0}.filter-buttons{display:flex;gap:.5rem;background:#00827f0d;padding:.375rem;border-radius:10px}.filter-btn{padding:.5rem 1rem;border:none;background:transparent;color:var(--text-light, #6B7280);font-size:.875rem;font-weight:600;border-radius:7px;cursor:pointer;transition:all .2s ease}.filter-btn:hover{background:#00827f14;color:var(--text-dark, #0A1414)}.filter-btn.active{background:var(--primary-color, #00827F);color:#fff;box-shadow:0 2px 6px #00827f40}.error-empty-state{text-align:center;padding:4rem 2rem;color:var(--text-light, #6B7280)}.error-empty-state .material-symbols-outlined{font-size:5rem;color:#d1d5db;margin-bottom:1rem}.error-empty-state h3{font-size:1.25rem;font-weight:600;color:var(--text-dark, #0A1414);margin:0 0 .5rem}.error-empty-state p{margin:0}.errors-list-modern{display:flex;flex-direction:column;gap:1rem}.error-card-modern{background:#fff;border-radius:12px;border:2px solid rgba(0,130,127,.1);overflow:hidden;transition:all .3s ease}.error-card-modern:hover{border-color:#00827f40;box-shadow:0 4px 12px #00827f1a}.error-card-modern.reviewed{opacity:.85;border-color:#10b98133}.error-card-modern.expanded{border-color:var(--primary-color, #00827F)}.error-card-header{display:flex;align-items:center;gap:1rem;padding:1.25rem;cursor:pointer;transition:background .2s ease}.error-card-header:hover{background:#00827f05}.error-status-icon{width:2.5rem;height:2.5rem;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.error-card-modern:not(.reviewed) .error-status-icon{background:#ef44441a}.error-card-modern:not(.reviewed) .error-status-icon .material-symbols-outlined{color:#ef4444;font-size:1.5rem}.error-card-modern.reviewed .error-status-icon{background:#10b9811a}.error-card-modern.reviewed .error-status-icon .material-symbols-outlined{color:#10b981;font-size:1.5rem}.error-header-content{flex:1;min-width:0}.error-project-tag{display:inline-block;margin-left:8px;padding:2px 8px;background:#00827f1a;color:#00827f;border-radius:4px;font-size:12px;font-weight:500}.error-number{font-size:.75rem;color:var(--text-light, #6B7280);font-weight:600;margin-bottom:.375rem}.error-question-preview{font-size:.9375rem;font-weight:500;color:var(--text-dark, #0A1414);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.expand-btn{width:2.5rem;height:2.5rem;border-radius:8px;border:none;background:#00827f14;color:var(--primary-color, #00827F);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s ease}.expand-btn:hover{background:#00827f26}.expand-btn .material-symbols-outlined{font-size:1.5rem}.error-card-body{padding:1.25rem;display:flex;flex-direction:column;gap:1.5rem;border-top:1px solid rgba(0,130,127,.1);animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.section-label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;color:var(--text-dark, #0A1414);margin-bottom:.75rem}.section-label .material-symbols-outlined{font-size:1.125rem;color:var(--primary-color, #00827F)}.error-question-full .question-text{font-size:1rem;color:var(--text-dark, #0A1414);line-height:1.6;padding:1rem;background:#00827f08;border-radius:8px;border-left:3px solid var(--primary-color, #00827F)}.answer-comparison{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:stretch}.answer-block{border-radius:8px;padding:1rem;display:flex;flex-direction:column;gap:.75rem}.answer-wrong{background:#ef44440d;border:2px solid rgba(239,68,68,.2)}.answer-correct{background:#10b9810d;border:2px solid rgba(16,185,129,.2)}.answer-header{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;font-weight:600}.answer-wrong .answer-header{color:#dc2626}.answer-correct .answer-header{color:#10b981}.answer-header .material-symbols-outlined{font-size:1rem}.answer-text{font-size:.9375rem;line-height:1.5;color:var(--text-dark, #0A1414)}.vs-divider{display:flex;align-items:center;justify-content:center;color:var(--text-light, #6B7280);font-weight:700;font-size:.75rem}.error-explanation-section{background:linear-gradient(135deg,#00827f08,#00827f03);padding:1.25rem;border-radius:8px;border:1px solid rgba(0,130,127,.1)}.explanation-content{font-size:.9375rem;line-height:1.7;color:var(--text-dark, #0A1414)}.error-actions{display:flex;gap:.75rem;flex-wrap:wrap}.action-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;border-radius:8px;border:none;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease}.review-btn{background:var(--primary-color, #00827F);color:#fff;box-shadow:0 2px 6px #00827f40}.review-btn:hover{background:#006b68;box-shadow:0 4px 12px #00827f59;transform:translateY(-1px)}.redo-btn{background:#00827f14;color:var(--primary-color, #00827F)}.redo-btn:hover{background:#00827f26}.action-btn .material-symbols-outlined{font-size:1.125rem}@media (max-width: 768px){.error-book-header{flex-direction:column}.filter-buttons{width:100%;justify-content:stretch}.filter-btn{flex:1}.answer-comparison{grid-template-columns:1fr;gap:1rem}.vs-divider{transform:rotate(90deg)}.error-actions{flex-direction:column}.action-btn{width:100%;justify-content:center}}@media (max-width: 480px){.error-card-header,.error-card-body{padding:1rem}.error-question-preview{font-size:.875rem}}.progress-overview{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:2rem}.user-info-card{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;background:linear-gradient(135deg,var(--primary-color, #00827F) 0%,#00a89f 100%);border-radius:12px;color:#fff;box-shadow:0 4px 12px #00827f33}.user-avatar{width:3.5rem;height:3.5rem;border-radius:50%;background:#fff3;display:flex;align-items:center;justify-content:center;flex-shrink:0}.user-avatar .material-symbols-outlined{font-size:2rem;color:#fff}.user-details{flex:1}.user-name{font-size:1.125rem;font-weight:600;margin:0 0 .25rem}.user-id{font-size:.875rem;margin:0;opacity:.9}.stats-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}@media (min-width: 768px){.stats-cards-grid{grid-template-columns:repeat(4,1fr)}}.stat-card{background:#fff;border-radius:12px;padding:1.25rem;border:2px solid rgba(0,130,127,.1);transition:all .3s ease;display:flex;align-items:center;gap:1rem}.stat-card:hover{border-color:#00827f4d;box-shadow:0 4px 12px #00827f1a;transform:translateY(-2px)}.stat-card-highlight{background:linear-gradient(135deg,#00827f08,#00827f03);border-color:var(--primary-color, #00827F)}.stat-icon{width:3rem;height:3rem;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-icon .material-symbols-outlined{font-size:1.75rem}.stat-content{flex:1;min-width:0}.stat-value{font-size:1.75rem;font-weight:700;color:var(--text-dark, #0A1414);margin:0 0 .25rem;line-height:1}.stat-label{font-size:.8125rem;color:var(--text-light, #6B7280);font-weight:500}.progress-actions{display:flex;gap:1rem;flex-wrap:wrap}.action-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.export-btn{background:var(--primary-color, #00827F);color:#fff;box-shadow:0 2px 6px #00827f40}.export-btn:hover{background:#006b68;box-shadow:0 4px 12px #00827f59;transform:translateY(-2px)}.export-btn .material-symbols-outlined{font-size:1.125rem}@media (max-width: 767px){.stats-cards-grid{grid-template-columns:repeat(2,1fr)}.stat-card{flex-direction:column;text-align:center}.stat-icon{width:2.5rem;height:2.5rem}.stat-icon .material-symbols-outlined,.stat-value{font-size:1.5rem}.stat-label{font-size:.75rem}}@media (max-width: 480px){.user-info-card{flex-direction:column;text-align:center;padding:1.25rem}.user-avatar{width:4rem;height:4rem}.stats-cards-grid{grid-template-columns:1fr}.progress-actions{flex-direction:column}.action-btn{width:100%;justify-content:center}}.function4-container{background-color:var(--background-light);min-height:100vh;padding-top:4rem}.function4-wrapper{position:relative;display:flex;min-height:100vh;width:100%;flex-direction:column}.page-header{text-align:center;margin-bottom:2rem}.module-badge{display:inline-flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding:.5rem 1rem;background-color:#00827f1a;border-radius:2rem;border:1px solid rgba(0,130,127,.2)}.page-title{color:var(--text-dark);font-size:2rem;font-weight:700;margin:0 0 .5rem}@media (min-width: 768px){.page-title{font-size:2.5rem}}.page-subtitle{color:var(--text-light);font-size:1rem;max-width:600px;margin:0 auto}.tab-content{min-height:400px}.practice-content-fullwidth{width:100%;max-width:100%}.practice-content{display:grid;grid-template-columns:1fr;gap:2rem}@media (min-width: 1024px){.practice-content{grid-template-columns:1.2fr 1fr;gap:2.5rem}}@media (min-width: 1440px){.practice-content{grid-template-columns:1.3fr 1fr;gap:3rem}}.main-content{flex:1;padding:1rem}@media (min-width: 768px){.main-content{padding:2.5rem}}.student-gallery-compact{background:linear-gradient(135deg,#fff,#f8f9fa);border-radius:1rem;padding:1.5rem;box-shadow:0 4px 16px #00000014;margin-bottom:1.5rem}.gallery-header-compact{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.header-left{display:flex;align-items:center;gap:.75rem}.header-icon-compact{width:40px;height:40px;background:linear-gradient(135deg,#00827f,#006663);border-radius:.5rem;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.header-icon-compact .material-symbols-outlined{font-size:22px}.gallery-title-compact{margin:0;font-size:1.125rem;font-weight:700;color:#111827;line-height:1.3}.gallery-subtitle-compact{margin:.125rem 0 0;font-size:.8125rem;color:#6b7280;line-height:1.4}.scroll-hint{display:flex;align-items:center;gap:.25rem;font-size:.8125rem;color:#9ca3af;white-space:nowrap}.scroll-hint .material-symbols-outlined{font-size:18px}.category-tabs{display:flex;gap:.5rem;margin-bottom:1rem;overflow-x:auto;padding-bottom:.5rem;scrollbar-width:thin;scrollbar-color:#00827f #e5e7eb}.category-tabs::-webkit-scrollbar{height:6px}.category-tabs::-webkit-scrollbar-track{background:#e5e7eb;border-radius:3px}.category-tabs::-webkit-scrollbar-thumb{background:#00827f;border-radius:3px}.tab-button{flex-shrink:0;display:flex;align-items:center;gap:.375rem;padding:.5rem .875rem;border:2px solid #e5e7eb;border-radius:1.5rem;background:#fff;color:#6b7280;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none}.tab-button:hover{border-color:#00827f;background:#00827f0d;transform:translateY(-2px);box-shadow:0 2px 8px #00827f26}.tab-button.active{background:linear-gradient(135deg,#00827f,#006663);border-color:#00827f;color:#fff;box-shadow:0 4px 12px #00827f4d}.tab-button .material-symbols-outlined{font-size:18px}.tab-label{font-weight:600}.tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 .375rem;background:#0000001a;border-radius:10px;font-size:.75rem;font-weight:700}.tab-button.active .tab-count{background:#ffffff40}.gallery-scroll-container{display:flex;gap:1rem;overflow-x:auto;overflow-y:hidden;padding-bottom:.5rem;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#00827f #e5e7eb}.gallery-scroll-container::-webkit-scrollbar{height:6px}.gallery-scroll-container::-webkit-scrollbar-track{background:#e5e7eb;border-radius:3px}.gallery-scroll-container::-webkit-scrollbar-thumb{background:#00827f;border-radius:3px}.gallery-scroll-container::-webkit-scrollbar-thumb:hover{background:#006663}.gallery-card{flex-shrink:0;width:200px;background:#fff;border-radius:.75rem;overflow:hidden;box-shadow:0 2px 8px #0000001a;transition:all .3s ease;cursor:pointer;animation:cardFadeIn .3s ease-out}@keyframes cardFadeIn{0%{opacity:0}to{opacity:1}}.gallery-card:hover{transform:translateY(-6px);box-shadow:0 12px 24px #00827f40}.card-image-wrapper{position:relative;width:100%;height:140px;overflow:hidden;background:#f3f4f6}.image-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#e5e7eb,#f3f4f6,#e5e7eb,#f3f4f6,#e5e7eb);background-size:400% 100%;animation:shimmer 2s ease-in-out infinite;z-index:1}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}.card-image{position:relative;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .3s ease,opacity .3s ease;z-index:2;opacity:0}.card-image.loaded{opacity:1}.card-image-wrapper:has(.card-image.loaded) .image-placeholder{opacity:0;transition:opacity .3s ease}.gallery-card:hover .card-image{transform:scale(1.15)}.card-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00827fd9;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}.gallery-card:hover .card-overlay{opacity:1}.card-overlay .material-symbols-outlined{color:#fff;font-size:3rem}.card-title{padding:.75rem;font-size:.875rem;font-weight:600;color:#374151;line-height:1.4;text-align:center}.lightbox-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:9999;animation:lightboxFadeIn .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@keyframes lightboxFadeIn{0%{opacity:0}to{opacity:1}}.lightbox-content{position:relative;max-width:90vw;max-height:90vh;animation:lightboxZoomIn .4s ease-out}@keyframes lightboxZoomIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.lightbox-content img{width:auto;height:auto;max-width:90vw;max-height:80vh;-o-object-fit:contain;object-fit:contain;border-radius:.5rem;box-shadow:0 20px 60px #00000080}.lightbox-caption{position:absolute;bottom:-60px;left:0;right:0;text-align:center;color:#fff}.lightbox-caption h3{margin:0 0 .25rem;font-size:1.125rem;font-weight:600}.lightbox-caption p{margin:0;font-size:.875rem;opacity:.8}.lightbox-close{position:absolute;top:1.5rem;right:1.5rem;width:48px;height:48px;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;z-index:10000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.lightbox-close:hover{background:#fff3;border-color:#ffffff80;transform:rotate(90deg)}.lightbox-close .material-symbols-outlined{color:#fff;font-size:28px}.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;z-index:10000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.lightbox-nav:hover{background:#fff3;border-color:#ffffff80;transform:translateY(-50%) scale(1.1)}.lightbox-prev{left:2rem}.lightbox-next{right:2rem}.lightbox-nav .material-symbols-outlined{color:#fff;font-size:32px}@media (max-width: 768px){.student-gallery-compact{padding:1rem}.gallery-title-compact{font-size:1rem}.scroll-hint{display:none}.category-tabs{gap:.375rem}.tab-button{padding:.425rem .75rem;font-size:.8125rem}.tab-button .material-symbols-outlined{font-size:16px}.tab-count{min-width:18px;height:18px;font-size:.7rem}.gallery-card{width:160px}.card-image-wrapper{height:120px}.card-title{font-size:.8125rem;padding:.625rem}.lightbox-nav{width:48px;height:48px}.lightbox-prev{left:1rem}.lightbox-next{right:1rem}.lightbox-close{top:1rem;right:1rem;width:40px;height:40px}}@media (max-width: 480px){.student-gallery-compact{padding:.75rem}.gallery-card{width:140px}.card-image-wrapper{height:105px}.tab-button .tab-label{display:none}.tab-button{padding:.5rem .625rem}.lightbox-nav{width:40px;height:40px}.lightbox-nav .material-symbols-outlined{font-size:24px}.lightbox-content img{max-width:95vw;max-height:70vh}.lightbox-caption{bottom:-50px}.lightbox-caption h3{font-size:1rem}}:root{--thai-red: #ED1C24;--thai-blue: #241D4F;--thai-white: #FFFFFF;--thai-red-light: rgba(237, 28, 36, .1);--thai-blue-light: rgba(36, 29, 79, .1)}.function5-container{background-color:var(--background-light);min-height:100vh;padding-top:4rem;position:relative;overflow-x:hidden}.function5-wrapper{position:relative;display:flex;min-height:100vh;width:100%;flex-direction:column}.page-header{text-align:center;margin-bottom:2rem;padding:1rem 0}.module-badge{display:inline-flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding:.5rem 1rem;background-color:#00827f1a;border-radius:1.5rem;border:1px solid rgba(0,130,127,.2);box-shadow:0 2px 4px #0000001a}.module-icon{display:flex;align-items:center;justify-content:center;background-color:var(--primary-color);border-radius:50%;width:2rem;height:2rem}.module-icon .material-symbols-outlined{color:#fff;font-size:1.25rem}.module-text{color:var(--primary-color);font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:0}.page-title{color:var(--text-dark);font-size:1.75rem;font-weight:900;margin:0 0 .75rem}@media (min-width: 768px){.page-title{font-size:2rem}}.page-subtitle{color:var(--text-light);font-size:1rem;font-weight:400;max-width:600px;margin:0 auto;line-height:1.6}.input-selection-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-out;padding:2rem;overflow-y:auto}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.input-selection-modal .input-selection-card{background:#fff;border-radius:1.5rem;padding:3rem 3.5rem;max-width:650px;width:100%;box-shadow:0 20px 60px #0000004d;border:3px solid var(--primary-color);animation:slideUp .4s ease-out;position:relative;margin:auto}@keyframes slideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.input-selection-card{background:#fff;border-radius:1rem;padding:1.75rem;margin-bottom:2rem;box-shadow:0 2px 8px #00000014;border:1px solid var(--border-color);animation:fadeInUp .5s ease-out}.card-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem;padding-bottom:.75rem;border-bottom:2px solid var(--background-light)}.card-header .material-symbols-outlined{color:var(--primary-color);font-size:1.5rem}.card-header h3{color:var(--text-dark);font-size:1.125rem;font-weight:700;margin:0}.selection-grid{display:grid;grid-template-columns:1fr;gap:1.25rem;margin-bottom:1.5rem}.input-selection-modal .selection-grid{grid-template-columns:1fr;gap:1.75rem;margin-top:2rem;margin-bottom:2rem}.selection-item{display:flex;flex-direction:column}.selection-item label{display:block;margin-bottom:.75rem;font-weight:700;color:var(--text-dark);font-size:1.05rem;line-height:1.8}.selection-item select{width:100%;padding:1rem 1.25rem;border:2px solid var(--border-color);border-radius:.75rem;font-size:1.05rem;color:var(--text-dark);background:#fff;cursor:pointer;transition:all .3s;line-height:1.6}.selection-item select:hover{border-color:var(--primary-color);box-shadow:0 2px 8px #00827f1a}.selection-item select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #00827f1a}.selection-actions{display:flex;justify-content:center;gap:1rem;margin-top:2.5rem;padding-top:2rem;border-top:2px solid var(--background-light)}.selection-actions .primary-button{min-width:200px;font-size:1.1rem;padding:1rem 2rem}@media (min-width: 640px){.selection-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.selection-grid{grid-template-columns:repeat(4,1fr)}.input-selection-modal .selection-grid{grid-template-columns:1fr}}@media (max-width: 768px){.input-selection-modal{padding:1rem}.input-selection-modal .input-selection-card{padding:2rem 1.5rem;border-radius:1rem}.selection-actions .primary-button{min-width:100%;padding:.875rem 1.5rem;font-size:1rem}}.welcome-guide{background:#fff;border-radius:1rem;padding:3rem 2rem;box-shadow:0 2px 8px #00000014;border:1px solid var(--border-color);animation:fadeInUp .5s ease-out;margin-bottom:2rem;text-align:center}.welcome-title{font-size:1.75rem;font-weight:700;color:var(--text-dark);margin:0 0 1rem}.welcome-subtitle{font-size:1rem;color:var(--text-light);margin:0 0 3rem;line-height:1.6}.guide-cards{display:grid;grid-template-columns:1fr;gap:2rem;margin-bottom:3rem}@media (min-width: 768px){.guide-cards{grid-template-columns:repeat(3,1fr);gap:2rem}}.guide-card{background:var(--background-light);border:1px solid var(--border-color);border-radius:.75rem;padding:2rem 1.5rem;transition:all .3s ease}.guide-card:hover{box-shadow:0 4px 16px #0000001a;transform:translateY(-4px)}.guide-icon{display:inline-flex;align-items:center;justify-content:center;width:4rem;height:4rem;background:var(--primary-color);color:#fff;border-radius:.75rem;margin-bottom:1.25rem}.guide-icon .material-symbols-outlined{font-size:2.5rem}.guide-card-title{font-size:1.125rem;font-weight:700;color:var(--thai-blue);margin:0 0 .75rem;line-height:1.6}.guide-card-desc{font-size:.95rem;line-height:1.7;color:var(--text-dark);margin:0}.welcome-action{text-align:center}.welcome-button{display:inline-flex;align-items:center;justify-content:center;gap:.625rem;padding:1rem 3rem;background:linear-gradient(135deg,var(--primary-color) 0%,#006b69 100%);color:#fff;font-weight:600;font-size:1.05rem;border-radius:.75rem;box-shadow:0 4px 16px #00827f59;transition:all .3s ease;cursor:pointer;border:none;line-height:1.6}.welcome-button .material-symbols-outlined{font-size:1.5rem;line-height:1;display:flex;align-items:center;justify-content:center}.welcome-button:hover{background:linear-gradient(135deg,#006b69,#005856);box-shadow:0 6px 20px #00827f73;transform:translateY(-2px)}.welcome-button:active{transform:translateY(0);box-shadow:0 2px 8px #00827f4d}.stats-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;background:linear-gradient(135deg,#00827f14,#00827f1f);border:2px solid rgba(0,130,127,.3);border-radius:2rem;margin-bottom:1.5rem;animation:fadeInUp .5s ease-out}.stats-badge .material-symbols-outlined{color:var(--primary-color);font-size:1.25rem}.stats-badge span:last-child{color:var(--primary-color);font-weight:600;font-size:.95rem;line-height:1.6}.learning-stats{display:flex;gap:1.5rem;margin-bottom:2rem;padding:1.5rem;background:linear-gradient(135deg,#00827f14,#00827f0a);border-radius:1rem;border:2px solid rgba(0,130,127,.3);flex-wrap:wrap}.stat-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.5rem;background:#fff;border-radius:.75rem;box-shadow:0 2px 8px #00000014;flex:1;min-width:200px}.stat-item .material-symbols-outlined{color:var(--primary-color);font-size:2rem}.stat-item span:last-child{color:var(--text-dark);font-size:.95rem;line-height:1.6}.stat-item strong{color:var(--primary-color);font-size:1.5rem;font-weight:700}.cultural-warning-toast{position:absolute;top:1rem;left:50%;transform:translate(-50%);z-index:1000;max-width:90%;width:600px;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.warning-content{display:flex;align-items:flex-start;gap:1rem;padding:1.25rem 1.5rem;background:linear-gradient(135deg,#fef3c7,#fee2e2);border:2px solid var(--thai-red);border-radius:.75rem;box-shadow:0 8px 24px #ed1c244d}.warning-content .material-symbols-outlined{color:var(--thai-red);font-size:1.75rem;flex-shrink:0}.warning-text{color:var(--thai-blue);font-size:.95rem;line-height:1.8;white-space:pre-line;font-weight:500}.stage-container{background:#fff;border-radius:1rem;padding:2rem;box-shadow:0 2px 8px #00000014;border:1px solid var(--border-color);animation:fadeInUp .5s ease-out;margin-bottom:2rem}.stage-title{display:flex;align-items:center;gap:.75rem;font-size:1.5rem;font-weight:700;color:var(--text-dark);margin:0 0 1.5rem;line-height:1.6}.stage-title .material-symbols-outlined{font-size:1.75rem;color:var(--primary-color);flex-shrink:0}.stage-title-bilingual{display:flex;flex-direction:column;gap:.25rem}.stage-title-bilingual .title-zh{font-size:1.5rem;color:var(--text-dark);font-weight:700}.stage-title-bilingual .title-th{font-size:1.125rem;color:#6b7280;font-weight:600;font-style:italic}.study-card-title{display:flex;align-items:center;gap:.5rem;line-height:1.6}.study-card-title .material-symbols-outlined{font-size:1.25rem;color:var(--primary-color)}.stage-actions{padding-top:1.5rem;text-align:center}.study-card{background:var(--background-light);border:1px solid var(--border-color);border-radius:.75rem;padding:1.5rem;margin-bottom:1.5rem}.study-card:last-of-type{margin-bottom:0}.study-card-title{font-size:1.125rem;font-weight:600;color:var(--primary-color);margin:0 0 1rem}.study-card-content{color:var(--text-dark);font-size:1rem;line-height:1.6;white-space:pre-line}.loading-content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;gap:1.5rem}.loading-spinner{width:50px;height:50px;border:5px solid rgba(0,130,127,.1);border-top:5px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}.loading-text{text-align:center;width:100%;max-width:500px}.loading-main{font-size:1.1rem;color:var(--primary-color);font-weight:600;margin-bottom:.5rem;animation:pulse 2s ease-in-out infinite}.loading-tips{font-size:.95rem;color:#666;margin-bottom:1rem;opacity:.8}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.loading-progress{width:100%;height:4px;background-color:#00827f1a;border-radius:2px;overflow:hidden;margin-top:1rem}.progress-bar{height:100%;background:linear-gradient(90deg,var(--primary-color),var(--primary-light),var(--primary-color));background-size:200% 100%;animation:progressAnimation 1.5s ease-in-out infinite;border-radius:2px}@keyframes progressAnimation{0%{width:0%;background-position:0% 0%}50%{width:70%;background-position:100% 0%}to{width:100%;background-position:200% 0%}}.loading-content p{color:var(--text-light);font-size:.95rem;margin:0}.primary-button{padding:.875rem 2rem;background:var(--primary-color);color:#fff;font-weight:600;font-size:1rem;border-radius:.5rem;box-shadow:0 4px 12px #00827f4d;transition:all .3s ease;cursor:pointer;width:100%;max-width:500px;line-height:1.6;border:none}.primary-button:hover{background:#006b69;box-shadow:0 6px 16px #00827f66;transform:translateY(-2px)}.roleplay-stage{display:flex;flex-direction:column;padding:0;overflow:hidden;height:auto;min-height:500px}@media (min-width: 768px){.roleplay-stage{flex-direction:row;min-height:600px;height:auto}}.roleplay-sidebar{background:var(--background-light);padding:1.5rem;border-right:1px solid var(--border-color);overflow-y:auto}@media (min-width: 768px){.roleplay-sidebar{width:35%;max-width:400px}}.task-card{background:#fff;border:1px solid var(--border-color);border-radius:.75rem;padding:1.25rem;position:sticky;top:0}.task-card-title{font-size:1rem;font-weight:600;color:var(--thai-red);margin:0 0 1rem;line-height:1.6}.task-card p{font-size:.875rem;color:var(--text-dark);margin:.5rem 0;line-height:1.6}.task-reminder{color:#dc2626!important;margin-top:1rem!important;padding-top:1rem;border-top:1px solid var(--border-color)}.roleplay-chat{flex:1;display:flex;flex-direction:column;background:#fff;min-height:0}.chat-messages{flex:1;overflow-y:auto;padding:1.5rem;display:flex;flex-direction:column;gap:1.25rem;min-height:300px;max-height:700px}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-thumb{background-color:#cbd5e1;border-radius:3px}.chat-messages::-webkit-scrollbar-track{background-color:#f1f5f9}.message{display:flex;animation:messageSlideIn .3s ease-out}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message.ai{justify-content:flex-start}.message.user{justify-content:flex-end}.message-bubble{max-width:85%;padding:1rem 1.25rem;border-radius:.75rem}.message.ai .message-bubble{background:#e5e7eb;color:var(--text-dark)}.message.user .message-bubble{background:var(--primary-color);color:#fff}.message-name{font-weight:700;font-size:.95rem;margin:0 0 .5rem}.message-text{font-size:1rem;margin:0;line-height:1.7}.chat-input-area{padding:1rem 1.5rem;border-top:1px solid var(--border-color);display:flex;gap:.5rem;background:#fff;align-items:stretch}.chat-input{flex:1;border:1px solid var(--border-color);border-radius:.5rem;padding:.75rem 1rem;font-size:.95rem;outline:none;transition:all .3s ease;min-width:0}.chat-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #00827f1a}.send-button{background:var(--primary-color);color:#fff;font-weight:600;padding:.75rem 1.25rem;border-radius:.5rem;transition:all .3s ease;cursor:pointer;white-space:nowrap;flex-shrink:0;border:none;line-height:1.6}.send-button:hover{background:#006b69}.end-button{background:#dc2626;color:#fff;font-weight:600;padding:.75rem 1.25rem;border-radius:.5rem;transition:all .3s ease;cursor:pointer;border:none;white-space:nowrap;flex-shrink:0;line-height:1.6}.end-button:hover{background:#b91c1c}.summary-grid{display:grid;grid-template-columns:1fr;gap:1.5rem;margin-bottom:1.5rem}@media (min-width: 768px){.summary-grid{grid-template-columns:repeat(2,1fr)}}.summary-section-title{font-size:1.125rem;font-weight:600;color:var(--thai-blue);margin:0 0 1rem;line-height:1.6}.image-container{background:#1f2937;border-radius:.75rem;aspect-ratio:1;display:flex;align-items:center;justify-content:center;padding:1rem;overflow:hidden}.image-container img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:.5rem}.report-container{background:var(--background-light);border:1px solid var(--border-color);border-radius:.75rem;padding:1.5rem;height:600px;overflow-y:auto}.report-container::-webkit-scrollbar{width:6px}.report-container::-webkit-scrollbar-thumb{background-color:#cbd5e1;border-radius:3px}.report-container::-webkit-scrollbar-track{background-color:#f1f5f9}.report-container p{margin:0 0 1.25rem;line-height:2;font-size:1.05rem;color:var(--text-dark)}.report-container p:last-child{margin-bottom:0}.report-container ul,.report-container ol{margin:.75rem 0 1.25rem 1.5rem}.report-container li{margin-bottom:.75rem;line-height:1.9}.secondary-button{padding:.875rem 2rem;background:#4b5563;color:#fff;font-weight:600;font-size:1rem;border-radius:.5rem;box-shadow:0 4px 12px #4b55634d;transition:all .3s ease;cursor:pointer;width:100%;max-width:500px;line-height:1.6;border:none}.secondary-button:hover{background:#374151;box-shadow:0 6px 16px #4b556366;transform:translateY(-2px)}.main-content{flex:1;padding:2rem 1rem;position:relative;z-index:2}@media (min-width: 768px){.main-content{padding:2.5rem 2rem}}.content-container{max-width:100%;margin:0 auto;padding:0 1rem}@media (min-width: 1024px){.content-container{max-width:1200px;padding:0 1.5rem}}@media (min-width: 1440px){.content-container{max-width:1400px;padding:0 2rem}}@media (min-width: 1920px){.content-container{max-width:1600px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 640px){.function5-container{padding-top:3rem}.page-title{font-size:1.5rem}.page-subtitle{font-size:.9rem}.input-selection-card,.stage-container{padding:1.25rem}.roleplay-stage{height:auto;min-height:500px}.chat-input-area{flex-wrap:wrap}.chat-input{flex:1 1 100%}.send-button,.end-button{flex:1;padding:.625rem 1rem;font-size:.875rem}.summary-grid{gap:1rem}.image-container{aspect-ratio:1}.report-container{height:450px}.welcome-guide{padding:2rem 1.5rem}.welcome-title{font-size:1.5rem}.welcome-subtitle{font-size:.95rem;margin-bottom:2rem}.guide-cards{gap:1.5rem;margin-bottom:2rem}.guide-card{padding:1.75rem 1.25rem}.guide-icon{width:3.5rem;height:3.5rem}.guide-icon .material-symbols-outlined{font-size:2rem}.guide-card-title{font-size:1rem}.guide-card-desc{font-size:.9rem}.welcome-button{padding:.875rem 2rem;font-size:1rem}}@media (max-width: 480px){.selection-grid{gap:1rem}.stage-title{font-size:1.25rem}.study-card{padding:1.25rem}.message-bubble{max-width:90%;padding:.875rem 1rem}.welcome-title{font-size:1.35rem}.guide-card{padding:1.5rem 1rem}.welcome-button{width:100%;padding:.875rem 1.5rem}}.markdown-content{line-height:1.7;font-size:1rem}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4{margin-top:1.75em;margin-bottom:1em;font-weight:600;color:var(--primary-color)}.markdown-content h1{font-size:1.9em;border-bottom:2px solid var(--primary-light);padding-bottom:.4em}.markdown-content h2{font-size:1.6em}.markdown-content h3{font-size:1.35em}.markdown-content p{margin-bottom:1.25em}.markdown-content ul,.markdown-content ol{margin-left:1.5em;margin-bottom:1.25em}.markdown-content li{margin-bottom:.65em;line-height:1.9}.markdown-content code{background-color:#00827f1a;padding:.2em .4em;border-radius:3px;font-family:Courier New,Courier,monospace;font-size:.9em}.markdown-content pre{background-color:#f6f8fa;padding:1em;border-radius:6px;overflow-x:auto;margin-bottom:1em}.markdown-content pre code{background-color:transparent;padding:0}.markdown-content blockquote{border-left:4px solid var(--primary-color);padding-left:1em;margin-left:0;color:#666;font-style:italic}.markdown-content strong{font-weight:600;color:var(--primary-dark)}.markdown-content em{font-style:italic;color:#555}.markdown-content a{color:var(--primary-color);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s}.markdown-content a:hover{border-bottom-color:var(--primary-color)}.markdown-content table{border-collapse:collapse;width:100%;margin-bottom:1em}.markdown-content table th,.markdown-content table td{border:1px solid #ddd;padding:.75em;text-align:left}.markdown-content table th{background-color:var(--primary-light);color:#fff;font-weight:600}.message-bubble .markdown-content p{margin-bottom:.5em}.message-bubble .markdown-content p:last-child{margin-bottom:0}.study-card-content.markdown-content p{margin-bottom:.8em;line-height:1.6;font-size:1rem}.study-card-content.markdown-content a{display:inline-block;margin:.4em 0;padding:.5em .8em;background:linear-gradient(135deg,#00827f1f,#00827f14);border-radius:6px;border:1.5px solid rgba(0,130,127,.3);color:var(--primary-color);font-size:.9em;font-weight:500;word-break:break-all;transition:all .3s;box-shadow:0 2px 4px #00827f1a}.study-card-content.markdown-content a:hover{background:linear-gradient(135deg,#00827f33,#00827f26);border-color:var(--primary-color);transform:translate(3px);box-shadow:0 3px 8px #00827f33}.study-card-content.markdown-content p:has(strong):first-of-type,.study-card-content.markdown-content p strong:first-child{color:var(--thai-blue);font-weight:700}.study-card-content.markdown-content p{text-indent:0}.study-card-content.markdown-content ol,.study-card-content.markdown-content ul{margin-top:1em;margin-bottom:1.5em}.study-card-content.markdown-content li{padding:.5em 0;border-bottom:1px solid rgba(0,130,127,.08);line-height:1.6;font-size:1rem;margin-bottom:.4em}.study-card-content.markdown-content li:last-child{border-bottom:none}.bilingual-content{font-size:1rem;line-height:1.7;contain:content;transform:translateZ(0);will-change:auto}.bilingual-pair{margin-bottom:.875em;padding:.625em .875em;background:linear-gradient(to right,rgba(0,130,127,.04) 0%,transparent 100%);border-left:3px solid var(--primary-color);border-radius:.375rem;contain:layout style}.bilingual-pair .text-zh{color:#1f2937;font-weight:500;margin-bottom:.4em;font-size:1rem;line-height:1.6}.bilingual-pair .text-th{color:#6b7280;font-size:.95rem;font-style:italic;line-height:1.6;padding-left:1.2em;position:relative}.bilingual-pair .text-th:before{content:"→ ";position:absolute;left:0;color:var(--primary-color);font-weight:600;font-style:normal}.bilingual-single{margin-bottom:.75em;line-height:1.6;padding:.25em 0}.bilingual-single.text-zh{color:#1f2937;font-size:1rem;font-weight:500}.bilingual-single.text-th{color:#6b7280;font-size:.95rem;font-style:italic}.bilingual-title{font-size:1.125rem;font-weight:700;margin:1.25em 0 .75em;padding-bottom:.5em;border-bottom:2px solid rgba(0,130,127,.2)}.bilingual-title.level-1{font-size:1.35rem;border-bottom-width:3px;padding-bottom:.6em}.bilingual-title.level-2{font-size:1.2rem;border-bottom-width:2px}.bilingual-title.level-3{font-size:1.1rem;border-bottom-width:1px}.bilingual-title:first-child{margin-top:0}.bilingual-title .title-zh{color:var(--primary-color);font-size:1.125rem;margin-bottom:.25em}.bilingual-title .title-th{color:#6b7280;font-size:1rem;font-style:italic}.bilingual-link{margin:.75em 0}.bilingual-link a{display:inline-block;padding:.5em .875em;background:linear-gradient(135deg,#00827f1f,#00827f14);border-radius:.5rem;border:1.5px solid rgba(0,130,127,.3);color:var(--primary-color);font-size:.9em;font-weight:500;text-decoration:none;word-break:break-all;transition:all .3s ease;box-shadow:0 2px 4px #00827f1a}.bilingual-link a:hover{background:linear-gradient(135deg,#00827f33,#00827f26);border-color:var(--primary-color);transform:translate(3px);box-shadow:0 3px 8px #00827f33}.task-card{background:linear-gradient(135deg,#fff,#f8f9fa);border:2px solid rgba(0,130,127,.2);border-radius:.875rem;padding:1.5rem;position:sticky;top:0;box-shadow:0 4px 12px #00827f26}.task-card-title{display:flex;align-items:center;gap:.5rem;font-size:1.125rem;font-weight:700;color:var(--primary-color);margin:0 0 1.25rem;padding-bottom:.75rem;border-bottom:2px solid rgba(0,130,127,.2)}.task-card-title .material-symbols-outlined{font-size:1.5rem;color:var(--primary-color)}.task-card-content{display:flex;flex-direction:column;gap:1rem}.task-item{background:#fff;border-radius:.625rem;padding:1rem;border:1px solid rgba(0,130,127,.15);transition:all .3s ease}.task-item:hover{border-color:#00827f4d;box-shadow:0 2px 8px #00827f1a;transform:translate(2px)}.task-label{display:flex;align-items:center;gap:.375rem;font-weight:700;color:var(--primary-color);font-size:.875rem;margin-bottom:.625rem;text-transform:uppercase;letter-spacing:.05em}.task-label .material-symbols-outlined{font-size:1.125rem}.task-item .bilingual-content{font-size:.925rem;line-height:1.65}.task-item .bilingual-pair{margin-bottom:.625em;padding:.5em .75em;background:#00827f0a}.task-item .bilingual-pair .text-zh{font-size:.95rem;margin-bottom:.25em}.task-item .bilingual-pair .text-th{font-size:.875rem;padding-left:1em}.task-reminder-item{background:linear-gradient(135deg,#fef3c7,#fee2e2);border-color:#dc26264d}.task-reminder-item:hover{border-color:#dc262680;box-shadow:0 2px 8px #dc262626}.task-reminder-label,.task-reminder-label .material-symbols-outlined{color:#dc2626}.task-reminder-item .bilingual-pair{background:#dc26260f;border-left-color:#dc2626}@media (max-width: 768px){.bilingual-pair{padding:.625em .75em}.bilingual-pair .text-zh{font-size:.975rem}.bilingual-pair .text-th{font-size:.9rem;padding-left:1em}.task-card{padding:1.25rem}.task-item{padding:.875rem}.task-label{font-size:.8125rem}.task-item .bilingual-content{font-size:.875rem}}.floating-ai{position:fixed;bottom:2rem;right:2rem;z-index:1000}.ai-toggle-button{width:3.5rem;height:3.5rem;border-radius:50%;background-color:var(--primary-color, #00827F);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #00827f4d;transition:all .3s ease}.ai-toggle-button:hover{background-color:#006b68;transform:scale(1.1);box-shadow:0 6px 16px #00827f66}.ai-toggle-button .material-symbols-outlined{font-size:1.5rem}.ai-chat-panel{position:absolute;bottom:4rem;right:0;width:320px;height:400px;background-color:#fff;border-radius:1rem;box-shadow:0 8px 32px #00000026;border:1px solid #e5e7eb;display:flex;flex-direction:column;overflow:hidden}.ai-chat-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;background-color:var(--primary-color, #00827F);color:#fff}.ai-chat-title{font-size:1rem;font-weight:600;margin:0}.ai-close-button{background:none;border:none;color:#fff;cursor:pointer;padding:.25rem;border-radius:.25rem;transition:background-color .2s}.ai-close-button:hover{background-color:#ffffff1a}.ai-close-button .material-symbols-outlined{font-size:1.25rem}.ai-messages{flex:1;padding:1rem;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem}.ai-message{display:flex;max-width:80%}.ai-message.user{align-self:flex-end}.ai-message.bot{align-self:flex-start}.ai-message-content{padding:.75rem;border-radius:1rem;font-size:.875rem;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word;white-space:pre-wrap}.ai-message-content .markdown-paragraph{word-break:break-word;hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto}.ai-message.user .ai-message-content{background-color:var(--primary-color, #00827F);color:#fff;border-bottom-right-radius:.25rem}.ai-message.bot .ai-message-content{background-color:#f3f4f6;color:var(--text-dark, #0A1414);border-bottom-left-radius:.25rem}.ai-input-form{display:flex;align-items:flex-end;padding:1rem;gap:.5rem;border-top:1px solid #e5e7eb}.ai-input{flex:1;padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.875rem;outline:none;transition:border-color .2s;font-family:inherit;line-height:1.4;overflow-y:auto}.ai-input:focus{border-color:var(--primary-color, #00827F)}.ai-send-button{padding:.75rem;background-color:var(--primary-color, #00827F);color:#fff;border:none;border-radius:.5rem;cursor:pointer;transition:background-color .2s;display:flex;align-items:center;justify-content:center;min-height:2.5rem;flex-shrink:0}.ai-send-button:hover{background-color:#006b68}.ai-send-button .material-symbols-outlined{font-size:1.125rem}.ai-send-button:disabled{background-color:#9ca3af;cursor:not-allowed}.markdown-paragraph{margin:.5rem 0;line-height:1.6;word-wrap:break-word;overflow-wrap:break-word}.markdown-paragraph:first-child{margin-top:0}.markdown-paragraph:last-child{margin-bottom:0}.markdown-bold{font-weight:700;color:#1e293b}.markdown-italic{font-style:italic;color:#374151}.markdown-strikethrough{text-decoration:line-through;color:#6b7280}.markdown-highlight{background-color:#fef3c7;color:#92400e;padding:.125rem .25rem;border-radius:.25rem}.markdown-h1{font-size:1.25rem;font-weight:700;margin:.75rem 0 .5rem;color:#1e293b;border-bottom:2px solid #e2e8f0;padding-bottom:.25rem}.markdown-h2{font-size:1.125rem;font-weight:700;margin:.5rem 0 .25rem;color:#1e293b;border-bottom:1px solid #e2e8f0;padding-bottom:.125rem}.markdown-h3{font-size:1rem;font-weight:700;margin:.5rem 0 .25rem;color:#1e293b}.markdown-h4{font-size:.875rem;font-weight:700;margin:.5rem 0 .25rem;color:#1e293b}.markdown-h5{font-size:.75rem;font-weight:700;margin:.5rem 0 .25rem;color:#1e293b}.markdown-h6{font-size:.6875rem;font-weight:700;margin:.5rem 0 .25rem;color:#6b7280;text-transform:uppercase;letter-spacing:.05em}.markdown-list,.markdown-ordered-list{margin:.5rem 0;padding-left:1.5rem}.markdown-list-item{margin:.25rem 0;line-height:1.5}.markdown-code-inline{background-color:#f1f5f9;color:#e11d48;padding:.125rem .25rem;border-radius:.25rem;font-family:Fira Code,Courier New,monospace;font-size:.875em;border:1px solid #e2e8f0}.markdown-code{background-color:#f1f5f9;color:#e11d48;padding:.125rem .25rem;border-radius:.25rem;font-family:Fira Code,Courier New,monospace;font-size:.875em}.markdown-pre{background-color:#1e293b;color:#e2e8f0;border:1px solid #334155;border-radius:.5rem;padding:.75rem;margin:.5rem 0;overflow-x:auto;font-family:Fira Code,Courier New,monospace;font-size:.75rem;line-height:1.4;box-shadow:0 2px 4px #0000001a}.markdown-pre code{background:none;padding:0;color:inherit;border:none;font-size:inherit}.markdown-blockquote{border-left:3px solid var(--primary-color, #00827F);padding-left:.75rem;margin:.5rem 0;color:#6b7280;font-style:italic;background-color:#f8fafc;padding:.5rem .75rem;border-radius:0 .375rem .375rem 0}.markdown-hr{border:none;height:1px;background:linear-gradient(90deg,transparent,#e2e8f0,transparent);margin:1rem 0}.markdown-link{color:var(--primary-color, #00827F);text-decoration:underline;text-decoration-color:#00827f4d;transition:all .2s ease}.markdown-link:hover{color:#006b6b;text-decoration-color:#006b6b}.markdown-image{max-width:100%;height:auto;border-radius:.375rem;box-shadow:0 1px 4px #0000001a;margin:.25rem 0}.markdown-table{width:100%;border-collapse:collapse;margin:.5rem 0;font-size:.75rem;box-shadow:0 1px 2px #0000001a;border-radius:.375rem;overflow:hidden}.markdown-table-head{background-color:#f8fafc}.markdown-table-body{background-color:#fff}.markdown-table-row{border-bottom:1px solid #e2e8f0}.markdown-table-row:last-child{border-bottom:none}.markdown-table-header{padding:.5rem;text-align:left;font-weight:600;color:#374151;background-color:#f1f5f9}.markdown-table-cell{padding:.5rem;color:#1e293b}.markdown-table-row:nth-child(2n) .markdown-table-cell{background-color:#f9fafb}.markdown-checkbox{margin-right:.375rem;accent-color:var(--primary-color, #00827F)}.markdown-paragraph img[alt*=emoji]{width:1.1em;height:1.1em;vertical-align:middle;margin:0 .05em}.floating-ai-panel .thinking-indicator{display:flex;align-items:center;gap:.5rem;color:#6b7280}.floating-ai-panel .thinking-dots{display:flex;gap:.25rem}.floating-ai-panel .thinking-dots .dot{width:.375rem;height:.375rem;background-color:#6b7280;border-radius:50%;animation:thinking-pulse 1.4s infinite ease-in-out}.thinking-dots .dot:nth-child(1){animation-delay:-.32s}.thinking-dots .dot:nth-child(2){animation-delay:-.16s}@keyframes thinking-pulse{0%,80%,to{transform:scale(.8);opacity:.5}40%{transform:scale(1);opacity:1}}.floating-ai-panel .thinking-text{font-size:.8rem}.loading-spinner{width:1rem;height:1rem;border:2px solid transparent;border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 640px){.floating-ai{bottom:1rem;right:1rem}.ai-chat-panel{width:calc(100vw - 2rem);height:350px;right:-1rem}.ai-toggle-button{width:3rem;height:3rem}.ai-toggle-button .material-symbols-outlined{font-size:1.25rem}}.ai-context-badge{display:inline-block;margin-left:.5rem;padding:.125rem .5rem;background-color:#fff3;border-radius:.25rem;font-size:.75rem;font-weight:500;text-transform:capitalize}.floating-ai{position:fixed;bottom:2rem;right:2rem;z-index:9999!important}.function1-container .floating-ai,.function2-container .floating-ai,.function3-container .floating-ai,.function4-container .floating-ai,.function5-container .floating-ai{position:fixed;bottom:2rem;right:2rem}