﻿/*4pics*/ .advanced-options{border:3px solid #808080;max-width:500px;background-color:#efefef;padding:20px;margin:0 auto;}
h1{font-size:40px;}
a.nav-link{color:#4488a7;text-decoration:underline dotted #4488a7;}
.level_header{padding:10px;border-top:#a89f99 solid 3px;background-color:#efefef;margin-bottom:20px;font-size:1.1em;}
.large input[type=text],.large input[type=number],.large button,.large select,.large input[type=button],.large input[type=submit]{height:55px !important;font-size:20px;}
.large input[type=text],.large input[type=number],.large select,.large input[type=button],.large button,.large input[type=submit]{border:2px solid #627282;}
label{margin-top:15px;text-transform:uppercase;font-size:.9em;}
.border-bottom{margin-bottom:10px;padding-bottom:5px;border-bottom:1px solid #a89f99;}
ul.level{list-style:none;padding:0;}
ul.level > li{border-bottom:#808080 1px solid;margin-bottom:8px;/*margin-left:15px;margin-right:15px;*/ font-size:1.1em;}
ul.level > li > a{display:block;background-color:#e1e1e1;padding:5px;}
.content{padding-top:0;}
.breadcrumb{padding:5px 10px !important;font-size:.9em;margin-bottom:0 !important;background-color:#fff;}
ul.letter_length > li > a{display:block;background-color:#69adbd;padding:10px;margin:5px;font-weight:bold;color:#fff;font-size:1.3em;}
ul.letter_length > li{display:inline-block;}
ul.letter_length{list-style:none;margin:0;padding:0;}
.accent{background-color:#7a9e9f;color:#fff;}
.accent > a{color:#fff;}
h3{margin-top:0px;}
h3.p-header{margin-top:18px;}
.m-top{margin-top:22px;}
ul.ul-btn.light{list-style:none;margin:0;padding:0;}
ul.ul-btn.light>li{display:inline-block;color:#336699;border:2px solid #c4def8;padding:5px;margin:5px 5px 5px 0;/*font-weight:bold;*/}
.nletters{color:#336699;display:inline-block;background-color:#c4def8;margin:5px;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}
.nletters.gray{background-color:#e1e0e0;border:2px solid #ccc;}
.nletters sup{font-weight:bold;padding-right:5px;font-size:.8em;}
.nletters a{display:inline-block;width:auto;padding:10px 5px 10px 10px;font-size:1.2em;font-weight:bold;}
.invert.light.points{font-size:1.1em;padding:8px;}
.invert.light.points>span>a{font-size:1.1em;padding:8px;margin:2px;margin-right:5px;}
.invert.light.points > span{display:inline-block;background-color:#7ca1c7;font-weight:bold;color:#f3f3f3;padding-right:10px;margin-bottom:8px;}
.invert.light a{color:#336699;background-color:#c4def8;/*#c4def8*/ padding:10px;}
.invert.light a.green{color:#fff;background-color:#4bb67e;padding:10px;}
.invert.light a.red{color:#fff;background-color:#f67373;padding:10px;}
.invert.light a.blue{color:#fff;background-color:#69adbd;padding:10px;}
.invert.light a.gray{color:#fff;background-color:#dedede;padding:10px;}
/*wordcookies*/ .level_section{margin-bottom:10px;background-color:#e6e4e4;border-top:2px solid #4bb67e;}
.level_section a{display:block;padding:10px;font-size:1.2em;font-weight:bold;color:#2455a4;}
.level_section a:hover{background-color:#534d4d;color:#f3f3f3;}
.board{border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;text-align:center;margin-bottom:20px;background-color:#e6e4e4;/*border-top:2px solid #4bb67e;*/ min-height:65px;/*padding-left:10px;*/ /*border:2px solid #e1e1e1;*/}
.board .header{padding-left:10px;}
.board a{display:block;padding-top:10px;font-size:1.3em;font-weight:bold;color:#2455a4;}
.board a:hover{background-color:#534d4d;color:#f3f3f3;}
.date_section{margin-bottom:10px;background-color:#e6e4e4;border-top:2px solid #4bb67e;}
.date_section a{display:block;padding:10px;font-size:1.2em;font-weight:bold;color:#2455a4;}
.date_section a:hover{background-color:#534d4d;color:#f3f3f3;}
.sub_levels{text-align:left;}
.sub_levels a{display:block;font-size:.9em;border-bottom:1px solid #69adbd;background-color:#f3f3f3;padding:10px;}
.light-box{margin-bottom:15px;font-size:18px;}
.list-header{margin:-10px -10px 20px -10px;padding:5px;}
.text-md-center{text-align:center;}
.form-group-md{max-width:600px;margin:20px auto;}
.form-group-md > .row > .col-md-6,.form-group-md > .row > .col-xs-12{margin-top:10px;}
@media only screen and (max-width:550px){.text-md-center{text-align:left;}
h1{font-size:30px;margin-left:0;}
h2{font-size:26px;}
.content{padding:5px;}
.light-box{padding:5px;}
.col-xs-6{margin-top:10px;margin-bottom:10px;padding-left:5px;padding-right:5px;}
.col-xs-12{padding:0 5px 10px 5px;}
.col-xs-8,.col-sm-8,.col-md-8{padding:0 !important;margin:5px;}
.level_header{margin-left:15px;margin-right:15px;}
.form-group-md{max-width:90%;margin:20px auto;}
}
/* ============================== Light Box H3 + Highlight ============================== */ .light-box h3{font-weight:bold;margin:25px 0 10px 0;}
.highlight-section{animation:highlight 1.5s ease-in-out;}
@keyframes highlight{0%{background-color:transparent;}
50%{background-color:#ffffcc;}
100%{background-color:transparent;}
}
/* ============================== Rack Preview ============================== */ .rack-preview-wrapper{margin-top:12px;}
.rack-preview-note{font-size:13px;color:#555;margin-bottom:6px;}
.rack-preview-tiles{display:flex;flex-wrap:wrap;gap:6px;}
.rack-preview-tile{min-width:38px;height:40px;border-radius:6px;border:2px solid #d4d4d4;background:#fff;color:#333;font-weight:700;text-transform:uppercase;box-shadow:0 1px 2px rgba(0,0,0,0.08);transition:all 0.15s ease;}
.rack-preview-tile:hover{transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,0.12);}
.rack-preview-tile.is-locked{background:#22c55e;color:#fff;border:3px solid #16a34a;box-shadow:0 2px 6px rgba(22,163,74,0.35);transform:scale(1.02);}
/* ============================== Pill Search Input ============================== */ .search-wrap{position:relative;margin-bottom:10px;}
.search-input{width:100%;border:2px solid #336699;border-radius:50px;padding:14px 60px 14px 22px;font-size:17px;font-weight:500;color:#1f2937;background:#fff;transition:border-color 0.2s ease,box-shadow 0.2s ease;}
.search-input:focus{outline:none;border-color:#1f6fb2;box-shadow:0 0 0 3px rgba(51,102,153,0.18);}
.search-input::placeholder{color:#94a3b8;font-weight:400;}
.search-go{position:absolute;right:5px;top:50%;transform:translateY(-50%);background:#336699;color:#fff;border:none;border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background 0.15s ease;}
.search-go:hover{background:#2d5580;}
.search-go svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}
/* ============================== FAQ Accordion ============================== */ .faq-list{border-top:1px solid #e2e8f0;margin-top:12px;}
.faq-item{border-bottom:1px solid #e2e8f0;padding:8px 0;}
.faq-toggle{width:100%;text-align:left;border:0;background:transparent;padding:8px 0;font-weight:600;font-size:16px;color:#1f2937;display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;}
.faq-caret{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #64748b;transition:transform 0.2s ease;flex-shrink:0;}
.faq-item.is-open .faq-caret{transform:rotate(180deg);}
.faq-answer{display:none;color:#475569;padding-bottom:8px;line-height:1.6;}
.faq-item.is-open .faq-answer{display:block;}
/* ============================== Results Sort Bar ============================== */ .results-sort-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:10px 0 15px;padding:10px 12px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc;}
.results-filter-group{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.results-filter-inline{flex-wrap:nowrap;white-space:nowrap;}
.results-sort-label{font-weight:600;color:#334155;font-size:13px;}
.results-sort-bar .sort-btn{border:1px solid #cbd5e1;background:#fff;color:#334155;border-radius:14px;padding:5px 12px;font-size:13px;font-weight:600;cursor:pointer;transition:all 0.15s ease;}
.results-sort-bar .sort-btn:hover{border-color:#336699;color:#336699;}
.results-sort-bar .sort-btn.active{background:#336699;color:#fff;border-color:#336699;}
.results-sort-bar .length-filter-select,.results-sort-bar .jump-select{border:1px solid #b8cbe3;border-radius:12px;background:#fff;color:#1f4d7a;padding:5px 10px;font-size:13px;font-weight:500;cursor:pointer;min-width:100px;}
/* ============================== Results Jump Bar (Sticky) ============================== */ .results-jump-bar{position:sticky;top:8px;z-index:25;display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:8px 10px;box-shadow:0 2px 8px rgba(0,0,0,0.06);margin:10px 0 15px;}
.results-jump-bar .length-jump-select{min-width:160px;border-radius:12px;border:1px solid #b8cbe3;background:#fff;color:#1f4d7a;padding:6px 10px;font-size:13px;}
.results-jump-bar .results-count{font-size:12px;color:#475569;font-weight:600;}
/* ============================== Copy Group Button ============================== */ .result-group-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;padding-bottom:5px;border-bottom:1px solid #a89f99;}
.result-group-header h3{margin:0;}
.copy-group-btn{border:1px solid #cbd5e1;background:#fff;color:#334155;border-radius:14px;padding:4px 10px;font-size:11px;font-weight:600;white-space:nowrap;cursor:pointer;transition:all 0.15s ease;}
.copy-group-btn:hover{border-color:#336699;color:#336699;}
.copy-group-btn.is-copied{border-color:#16a34a;color:#16a34a;}
/* ============================== Quick Nav Cards ============================== */ .quick-nav{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:20px;margin-bottom:15px;}
.quick-nav h2{font-size:22px;margin-bottom:4px;}
.quick-nav-subtitle{color:#64748b;font-size:14px;margin-bottom:16px;}
.quick-nav-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.quick-nav-link{display:flex;align-items:center;gap:8px;padding:10px 14px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;color:#1f4d7a;font-weight:500;font-size:14px;text-decoration:none;transition:all 0.15s ease;}
.quick-nav-link:hover{border-color:#336699;color:#336699;background:#f0f7ff;text-decoration:none;transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,0.06);}
.quick-nav-link i{color:#336699;font-size:12px;flex-shrink:0;}
/* ============================== Scrabble Tools Pills ============================== */ .tools-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.tool-pill{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:#fff;border:1px solid #c4def8;border-radius:24px;color:#336699;font-weight:600;font-size:14px;text-decoration:none;transition:all 0.15s ease;}
.tool-pill:hover{background:#336699;color:#fff;border-color:#336699;text-decoration:none;}
.tool-pill i{font-size:13px;}
/* ============================== Board Promo Card ============================== */ .promo-card{background:linear-gradient(135deg,#e3f2fd 0%,#dbeafe 100%);border:1px solid #93c5fd;border-radius:12px;padding:24px;margin-bottom:15px;text-align:center;}
.promo-card h2{color:#1e40af;font-size:22px;margin-bottom:8px;}
.promo-card p{color:#334155;margin-bottom:16px;}
.promo-card .btn-primary{background:#336699;border-color:#2d5580;border-radius:10px;padding:10px 24px;font-size:16px;font-weight:600;transition:all 0.15s ease;}
.promo-card .btn-primary:hover{background:#2d5580;transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,0.15);}
/* ============================== Content Section (replaces light-box) ============================== */ .content-section{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px;margin-bottom:15px;}
.content-section > h2{font-size:22px;margin-bottom:8px;}
.content-section > h3{font-size:17px;color:#1e40af;margin-top:20px;margin-bottom:10px;}
.content-section > h4,.content-section h4{font-size:15px;color:#334155;margin-top:14px;margin-bottom:6px;}
.content-section ul.spaced li{padding:6px 0;border-bottom:1px solid #f1f5f9;}
.content-section ul.spaced li:last-child{border-bottom:0;}
/* HowTo Steps */ .howto-section{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:24px;margin-bottom:15px;}
.howto-section > h2{font-size:22px;margin-bottom:4px;}
.howto-section > p:first-of-type{color:#475569;margin-bottom:16px;}
.howto-step{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid #e2e8f0;}
.howto-step:last-of-type{border-bottom:0;}
.howto-step-num{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:#336699;color:#fff;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;margin-top:2px;}
.howto-step-body h3{font-size:16px;color:#1e3a5f;margin:0 0 6px 0;}
.howto-step-body p{font-size:14px;color:#475569;margin-bottom:6px;line-height:1.6;}
.howto-step-body ul{margin:6px 0 0 0;padding-left:18px;}
.howto-step-body ul li{font-size:13px;color:#334155;padding:3px 0;line-height:1.5;}
.howto-step-body code{background:#e0ecf7;color:#1e3a5f;padding:1px 5px;border-radius:4px;font-size:13px;}
/* Bonus Squares Visual */ .bonus-list{list-style:none;padding:0;margin:12px 0;display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.bonus-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;font-size:14px;color:#334155;}
.bonus-badge{flex-shrink:0;width:36px;height:36px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:11px;color:#fff;}
.bonus-badge.tw{background:#dc2626;}
.bonus-badge.dw{background:#ea580c;}
.bonus-badge.tl{background:#2563eb;}
.bonus-badge.dl{background:#16a34a;}
.bonus-badge.star{background:#f59e0b;font-size:16px;}
.bonus-item strong{color:#1e293b;}
/* Game Links Grid (Other Games) */ .game-links-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;}
.game-link-card{display:flex;align-items:center;gap:8px;padding:10px 14px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;color:#1f4d7a;font-weight:500;font-size:14px;text-decoration:none;transition:all 0.15s ease;}
.game-link-card:hover{border-color:#336699;color:#336699;background:#f0f7ff;text-decoration:none;transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,0.06);}
.game-link-card i{color:#336699;font-size:12px;}
/* Download Links */ .download-links{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;}
.download-link{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;background:#336699;color:#fff;border-radius:10px;font-weight:600;font-size:14px;text-decoration:none;transition:all 0.15s ease;}
.download-link:hover{background:#2d5580;color:#fff;text-decoration:none;transform:translateY(-1px);box-shadow:0 3px 8px rgba(0,0,0,0.15);}
.download-link i{font-size:16px;}
/* Language Links */ .language-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.language-pill{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:#fff;border:1px solid #e2e8f0;border-radius:24px;color:#336699;font-weight:500;font-size:14px;text-decoration:none;transition:all 0.15s ease;}
.language-pill:hover{background:#f0f7ff;border-color:#336699;color:#336699;text-decoration:none;}
/* Tile Table Styling */ .tile-table{border-radius:8px;overflow:hidden;}
.tile-table thead th{background:#336699;color:#fff;font-size:13px;font-weight:600;text-align:center;padding:8px;border:0;}
.tile-table tbody td{text-align:center;padding:6px 8px;font-size:14px;border-color:#e2e8f0;}
.tile-table tbody td strong{color:#1e40af;font-size:15px;}
.content-section .tip-box{margin-top:12px;padding:10px 14px;background:#f0f7ff;border-left:3px solid #336699;border-radius:0 8px 8px 0;font-size:14px;color:#334155;}
/* Disclaimer */ .disclaimer{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:16px 20px;margin-bottom:15px;font-size:12px;color:#64748b;line-height:1.6;}
/* ============================== Strategy Guide ============================== */ .strategy-guide{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:20px;margin-bottom:15px;}
.strategy-guide > h2{font-size:22px;margin-bottom:4px;}
.strategy-subtitle{color:#64748b;font-size:14px;margin-bottom:16px;}
.strategy-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.strategy-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:16px;}
.strategy-card h3{font-size:16px;color:#1e40af;margin:0 0 8px 0;display:flex;align-items:center;gap:8px;}
.strategy-card h3 i{color:#336699;font-size:14px;}
.strategy-card p{font-size:14px;color:#475569;margin-bottom:8px;line-height:1.5;}
.strategy-card ul{list-style:none;padding:0;margin:0;}
.strategy-card ul li{font-size:13px;color:#334155;padding:4px 0;border-bottom:1px solid #f1f5f9;line-height:1.5;}
.strategy-card ul li:last-child{border-bottom:0;}
.strategy-card ul li strong{color:#1e40af;}
.strategy-card .pro-tip{margin-top:8px;padding:8px 12px;background:#f0f7ff;border-left:3px solid #336699;border-radius:0 6px 6px 0;font-size:13px;color:#334155;}
.strategy-full-width{grid-column:1 / -1;}
.two-letter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px;}
.two-letter-cell{background:#f0f7ff;border-radius:8px;padding:10px;font-size:13px;line-height:1.6;}
.two-letter-cell strong{display:block;color:#1e40af;font-size:12px;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px;}
/* ============================== Resource Grid ============================== */ .resource-grid{background:#f0f7ff;border:1px solid #bfdbfe;border-radius:12px;padding:20px;margin-bottom:15px;}
.resource-grid h2{margin-bottom:4px;}
.resource-grid h3{font-size:17px;color:#1e40af;margin-bottom:10px;margin-top:16px;}
.resource-subtitle{color:#64748b;font-size:14px;margin-bottom:12px;}
.resource-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.resource-card{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#fff;border:1px solid #bfdbfe;border-radius:10px;color:#1f4d7a;font-weight:500;font-size:14px;text-decoration:none;transition:all 0.15s ease;}
.resource-card:hover{border-color:#336699;color:#336699;background:#f8fbff;text-decoration:none;transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,0.06);}
.resource-card i{color:#336699;font-size:14px;flex-shrink:0;width:16px;text-align:center;}
.resource-card small{color:#94a3b8;font-weight:400;}
/* ============================== Mobile:All Components ============================== */ @media only screen and (max-width:667px){.search-input{font-size:16px;padding:12px 56px 12px 18px;}
.search-go{width:40px;height:40px;}
.results-sort-bar{gap:6px;padding:8px;}
.results-jump-bar{gap:6px;padding:6px 8px;}
.faq-toggle{font-size:15px;}
.quick-nav-grid{grid-template-columns:1fr;}
.quick-nav-link{padding:10px 12px;}
.tools-grid{gap:6px;}
.tool-pill{padding:6px 12px;font-size:13px;}
.resource-card-grid{grid-template-columns:1fr;}
.resource-card{padding:10px 12px;}
.strategy-cards{grid-template-columns:1fr;}
.two-letter-grid{grid-template-columns:1fr 1fr;}
.content-section{padding:16px;}
.howto-section{padding:16px;}
.howto-step{gap:10px;}
.howto-step-num{width:28px;height:28px;font-size:12px;}
.bonus-list{grid-template-columns:1fr;}
.game-links-grid{grid-template-columns:1fr 1fr;}
}
